Print value of textarea using javascript

We are facing the problem to print the full textarea text when using the default browser print. It will print the full content of the pages which will print only that text which is visible to the textarea.

Content which is not displaying or go out of page due to overflow. Please use below code to see that.

We are having the Textarea and div control and when we click on the print then it will hide the text area and put the Textarea text to div

simple jquery popup example code

Simple jquery popup which generally use to show or to perform some operations as supplementary operations.

You will get the popup as like below.

This popup doesn’t need any plugin, you only need to take the reference of the

Read Array object in Javascript Based on Query String

Please check the previous article  Click here to see how we can read the value which we pass in query string

Now Framing the javascript array  Object,

var val = [

        { Id: 1, Image: 'Content/Images/2.jpg', Value:'This is 1 content' },

        { Id: 2, Image: 'Content/Images/2.jpg', Value:'This is 2 content' }

    ];

Code to read array of object is javascript

Reading Query string Values in Javascript

Using simple javascript to get the  query string value of URL.

We have URL as 

<a href="DisplayContent.html?id=0"> 0</a>

<a href="DisplayContent.html?id=1">1</a>

To Read the content of URL you can use below method as;

function getParameterValueByName(name, url) {

        if (!url) url = window.location.href;

        name = name.replace(/[\[\]]/g, "\\$&");

        var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),

            results = regex.exec(url);

        if (!results) return null;

        if (!results[2]) return '';

        return decodeURIComponent(results[2].replace(/\+/g, " "));

    }

Changing icon on Collapse and Expand Panel

Collapsing and Expanding  for Panel is make very easy by Bootstrap that you can directly achieve using bootstrap.js and Bootstap.css [You can download it from getbootstrap.com]. Than need to write a simple code to change the icon using jQuery. 

Please see below that how to demostrate Changing icon on Collapse and Expand Panel.

It will be look alike below.

get current location in android example code.

Below demonstration is in Visual Studio 2015, cordova application to get the current location in android. It will give the overview that how you will get your current location in google map. Like Below.

Follow the below steps to get current location in android code.

AngularJs Service, Factories and Providers

 Service in AngularJS

AngularJs Service, Factories and providers are all injectable types.

An AngularJs service encapsulates specific business logic & exposes an API to be used by other components to invoke this logic.

e.g. $timeout service executes function after specifies interval. $http service encapsulates the logic required to interact with REST backbends.

AngularJS service is always Singleton.

Service is registered using service function of angular.module().

The Second argument to service() is a constructor function to inject the service.

read json in c#

Reading the JSON file passing from Jscript file and read that in C# Code

Suppose you are creating the JSON file like below;

function GetInsertedData() {

    var CustomerDetailsModels = {

        CustomerDetailId: $("#hdnId").val(),

        ClinicName: $("#txtClinicName").val(),

       PhoneNumber: $("#txtPhoneNumber").val(),

        UserName: $("#txtUserName").val(),

        Password: $("#txtPassword").val(),

        // DateOfRegistration: $("#DateOfRegistration").val(),

        ValidaityDate: $("#txtValidaityDate").val(),

        ActiveDate: $("#txtDateOfActivation").val(),

        Address1: $("#txtAddress1").val(),

        Address2: $("#txtAddress2").val(),

        CountryId: $("#ddlSelecteCountry").val(),

        StateId: $("#ddlSelectState").val(),

        DisctrictId: $("#ddlDistrict").val(),

        PinCode: $("#txtPincode").val(),

        EmailId: $("#txtEmailID").val(),

        Website: $("#txtWebsite").val(),

        OfficeNumber: $("#txtOfficeNumber").val(),

        NumberOfUser: $("#ddlAllowedNumberUser").val(),

        IsActive: $("#chkISActive").val(),

        IsPaid: $("#chkISPaid").val(),

        AmountPaid: $("#txtPaidAmount").val()

Calling webmethod from Jquery

Calling the web method from Client side event and Jquery;

You need to first create the webmethod,
Creating the webmethod to add the employee;

[System.Web.Services.WebMethod]

    public static string AddEmployeeDetails(int num, string  Name)

    {

        EmplyeeBAO ObjEmplyeee = new EmplyeeBAO();

        ObjEmplyeee.AddItem(num, Name);

        return "Add";

    }

Call below jqery code to insert the employee data by calling the web method which has written on code behind window;

jQuery.ajax({

            url: 'Default.aspx/AddEmployeeDetails',

            type: "POST",

            data: "{'num' : " + num + ",'Name':" + Name + "}",

            contentType: "application/json; charset=utf-8",

            dataType: "json",

            beforeSend: function () {

                alert("Start!!! ");

            },

            success: function (data) {

                alert("a");

            },

            failure: function (msg) { alert("Sorry Not inserted!!! "); }

        });

Validations in asp.net using javascript

Article will cover basic type of javascript validation, it validate the input\textbox values records in client side itself.

First you need to add the javascript file\javascript section where you need to put the javascript code. I am putting the Javascript section on the ASPX file itself. Like below;

<head runat="server">

    <title>Validation by Javascript</title>

    <script type="text/javascript"  >

        function validateData() {

        //all code come under this function

        }

    </script>

   

</head>

Validations in asp.net using Jquery

Article will cover basic type of jquery validation in ASP.Net, it validate the input\textbox values records in client side itself.

First you need to add the javascript file\javascript section where you need to put the jquery code. I am putting the Javascript section on the ASPX file itself. Like below;

Before starting the code need to take the reference of JQuery file into your system.

<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>

Bind the Button click event while loading the page at first time.

<script type="text/javascript">

        $(document).ready(function () {

            $('#btnClick').click(function () {

//Your code should be there

  });

        });

    </script>

get dropdown value in jquery

The .val() method is primarily used to get the values of form elements such as input, select and textarea, And to get the text of the dropdown values by jquery need to use .text() method.

@Code snippet how to get Value of dropdown in Jquery

<head runat="server">

    <title>Validation by Javascript</title>

    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            $("#ddlvalues").change(function () {

                alert($("#ddlvalues option:selected").val()); //get Value of dropdown in Jquery

                alert($("#ddlvalues option:selected").text()); //get text of dropdown in Jquery

            });

        });

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        <table width="60%" align="center">

            <tr>

                <td colspan="2" align="center">

                    <h1>

                        Validation by Javascript</h1>

                </td>

            </tr>

            <tr>

                <td align="right">

                    Get Value

                </td>

                <td align="left">

                    <asp:DropDownList ID="ddlvalues" ClientIDMode="Static" runat="server">

                        <asp:ListItem Text="first" Value="1"></asp:ListItem>

                        <asp:ListItem Text="second" Value="2"></asp:ListItem>

                        <asp:ListItem Text="Third" Value="3"></asp:ListItem>

                    </asp:DropDownList>

                </td>

            </tr>

           

        </table>

    </div>

    </form>

</body>

@Screen out put in Browser

jquery how to disable a button

Many times we got issue in web form when multiple time of save button click, It can be handle by disabling the save button while clicking the first time.

Here is code by which you can disable the button by jquery.

You just need to take the reference of Jquery js file into your application or page;

<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>

@Code to make the button disable in JQuery;

<script type="text/javascript">

        $(document).ready(function () {

            $("#Button1").click(function () {

                $("#Button1")[0].disabled = true;

            });

        });

    </script>

@Html code for button;

<asp:Button ID="Button1" runat="server" Text="Button"  />

@complete code;

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>Make button disable</title>

    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            $("#Button1").click(function () {

                $("#Button1")[0].disabled = true;

            });

        });

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        <table width="60%" align="center">

            <tr>

                <td colspan="2" align="center">

                    <h1>

                       Disable button control</h1>

                </td>

            </tr>

            <tr>

               

                <td align="right">

                    Disable

                </td>

                <td align="left">

                   <asp:Button ID="Button1" runat="server" Text="Button"  />

                </td>

            </tr>

           

        </table>

    </div>

    </form>

</body>

</html>

@output

Before click on button, page will appear as;

After clicking button;

jquery how to check a checkbox

Many time we need to peform the operation of select all check box while clicking some button or in some behavior and some for de-selecting all the check box,

It became very easy by just simple two lines in Jquery; selecting and de-selecting check box;

You just need to take the reference of Jquery js file into your application or page;

<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>

@Code to make the checkbox checked in JQuery;

<script type="text/javascript">

    //Check box checked

        $(document).ready(function () {

            $("#Button1").click(function () {

                $('#idChecked').attr('checked', true);

                // $("#Button1")[0].disabled = true;

            });

            //Check box unchecked

            $("#Button2").click(function () {

                $('#idChecked').attr('checked', false);

                // $("#Button1")[0].disabled = true;

            });

        });

    </script>

@Html code for button;

<asp:CheckBox ID="idChecked" runat="server" Text="Checked" />

                    <br />

                    <asp:Button ID="Button1" runat="server" Text="Checked" />

                    <asp:Button ID="Button2" runat="server" Text="Un Checked" />

@complete code;

<body>

    <form id="form1" runat="server">

    <div>

        <table width="60%" align="center">

            <tr>

                <td colspan="2" align="center">

                    <h1>

                         Check box test

</h1>

                </td>

            </tr>

            <tr>

                <td align="right">

                </td>

                <td align="left">

                  

                    <asp:CheckBox ID="idChecked" runat="server" Text="Checked" />

                    <br />

                    <asp:Button ID="Button1" runat="server" Text="Checked" />

                    <asp:Button ID="Button2" runat="server" Text="Un Checked" />

                </td>

            </tr>

        </table>

    </div>

    </form>

</body>

@output screen to checked check box in jquery

On unchecked

On checked