Wednesday, October 17, 2012

How to use javascript to trigger the server side event

put the following javascript code in the Javascript file

 $(function () {
                 var dates = $("#txtDateFrom, #txtDateTo").datepicker({
                     defaultDate: "+1w",
                     changeMonth: true,
                     changeYear: true,
                     numberOfMonths: 1,
                     onSelect: function (selectedDate) {
                         var option = this.id == "txtDateFrom" ? "minDate" : "maxDate",
     instance = $(this).data("datepicker"),
     date = $.datepicker.parseDate(
      instance.settings.dateFormat ||
      $.datepicker._defaults.dateFormat,
      selectedDate, instance.settings);
                         dates.not(this).datepicker("option", option, date);
 
                        
                         if (this.id == "txtDateFrom") {
                             $("#txtDateFrom").change();
                         }
                       
                         else if (this.id == "txtDateTo") {
                             $("#txtDateTo").change();
                         }
                     }
                 });
           });

use the html element change event to trigger the server side. we fill the date from or date to textbox,
the textbox change event will be fired in the client.we must force the change event to fire since we do not use keyboard to input the date, instead we selected the date from the slide out calendar. as a result the textbox is unable to capture the content change.

$("#txtDateFrom").change();

in aspx page

<asp:textbox id="txtDateFrom" runat="server" AutoPostBack="true" 
OnTextChanged="txtDateFrom_onTextChanged"></asp:textbox>
 
in the code behind file we need to implement the evnet
 
 protected void txtDateFrom_onTextChanged(object sender, EventArgs e)
 {
         //your logic to implement here
 } 

No comments:

Post a Comment