How to assign a javascript variable to ASP.NET Control in javascript?

Hi Coders,

This post will give you an idea on how to assign a JavaScript variable to Asp.net control at Client Side (i.e., JavaScript).

Here, Controls I used to show a sample code:

1. Hidden Field - Asp.Net Control
2. JavaScript snippet

Steps : 

First create a new web project and then add a new file.
Further, Follow the below steps ,

Step 1:  Create a new Hidden Field in our page 
Example: <asp:HiddenField ID="HiddenFieldGetValueFromJS" runat="server" />

Step 2: Access this hidden filed in javascript
Example: document.getElementById('<%= HiddenFieldGetValueFromJS.ClientID %>').value;

Step 3: Create a new variable in javascript and assign it to the above created hidden field
Example:   
   var valueForHidden=10;
   //Its time to assign this variable : valueForHidden to HiddenField : HiddenFieldGetValueFromJS
   document.getElementById('<%= HiddenFieldGetValueFromJS.ClientID %>').value=valueForHidden;
   
Step 4: To Test it put this hidden field in alert and see the output.
 alert("Value of this Hidden Field is assigned from JS to ASPX Control : " + document.getElementById('<%= HiddenFieldGetValueFromJS.ClientID %>').value);
And here the sample output for the above code

Happy Coding :)

Yours, 
Nuthan Murarysetty.  

Adding new CSS Class to existing CSS Class using Jquery

If user want to add/append one more style to existing CSS then  we used the following method

Jquery is a javascript library (i.e., Enhanced library of Javascript) with this we use the following method to add new CSS class to existing one.


Ex : $(".existingone").addClass("newone");


And also we can remove the existing style to particular control using the following way,

       $('.classname').attr("style", "");
       Remove styles to the existing one


That's It,


Happy Coding:)

Calling Server Side event using Javascript

Scenario : In my case, I want to call/Fire button click event which is in invisible in page using javascript then i googled many sites but none of the solutions are not suite for my requirement. So at last i found the solution. The below method i solved my problem. I hope this will help you to fix the problem.

Pre-requisites : We include ScriptManger into your page.

   <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>

And then we used the below one in any where as per your requirement,

WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions('btnUploadFile', '', true, '', '', false, true));

Example :

Added the WebForm_DoPostBackWithOptions, inside the function,

function Firebutton()
{
       WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions('btnUploadFile', '', true, '', '', false, true));
}

then this fires btnUploadFile_click event.

Now we are knowing about the parameters of  WebForm_DoPostBackWithOptions are below and i mapped the value with above one,

1. eventTarget  - btnUploadFile
2. eventArgument - ''
3. validation - true
4. validationGroup - ''
5. actionUrl - ''
6. trackFocus - false
7. clientSubmit - true

That's It,
Happy Coding :)

Disable/Enable validation controls using javascript

Now we are going to discuss about enable/disable validation controls using javascript.

Scenario : In my case, After validation is done then i am resetting the form but validation messages are not cleared. For this scenario i used the below method/technique for enable/disable the validations.


Enable Validator :

               for (i = 0; i < Page_Validators.length; i++) {
                       if (Page_Validators[i].validationGroup == "Box") {
                              ValidatorEnable(Page_Validators[i], true);
                       }
              }

Disable Validator :

              for (i = 0; i < Page_Validators.length; i++) {
                      if (Page_Validators[i].validationGroup == "Cash") {
                        ValidatorEnable(Page_Validators[i], false);
                      }
             }

Explanation :

Page_Validators.length -  Get the length of validation controls count.

Page_Validators[value].validationGroup - It is used to compare with the validation group name.

ValidatorEnable() - It is used to set either Enable/Disable the validation for that control.

ValidatorEnable(Page_Validators[i], false); - If true then enable validator or other wise disable the validation.


That's it.

Happy Coding :)

How to validate form using javascript?

Page validation using javascript :

 Page_ClientValidate method is used for validation at client side and Page.IsValid is used for server side validation with Validation Controls in ASP.NET.

If page is validated then return true and execute the statements which we written inside { .... } braces.

Ex : function ValidatePage()
       {
           if(Page_ClientValidate("validate")
           {
               alert(" Your page is validated");
           }
       }

Where "validate" - is the group name of validation controls which is used in ASP.NET Page.


Happy Coding... :)