如何将两个gridview文本框值传递给javascript函数

Question

hi,i am new to javascript,

my problem is i have a simple date check function as follow

function CompareDates(str1, str2) 
   {
          var dt1 = parseInt(str1.substring(0, 2), 10);
          var mon1 = parseInt(str1.substring(3, 5), 10);
          var yr1 = parseInt(str1.substring(6, 10), 10);
          var dt2 = parseInt(str2.substring(0, 2), 10);
          var mon2 = parseInt(str2.substring(3, 5), 10);
          var yr2 = parseInt(str2.substring(6, 10), 10);
          var date1 = new Date(yr1, mon1, dt1);
          var date2 = new Date(yr2, mon2, dt2);

          if (date2 < date1) {
                alert("To date cannot be greater than from date");
                return false;
          }
          else
          {
                return true;
          } 

      }

In Gridview

        <asp:TemplateField HeaderText="Start Dtae">
                           <ItemTemplate>
                                        <asp:TextBox ID="txtStartDate" runat="server" Text='<%# Bind("StartDate") %>'></asp:TextBox>
                                        <asp:CalendarExtender ID="txtStartDate_CalendarExtender" runat="server" Format="dd/MM/yyyy"                 Enabled="True" TargetControlID="txtStartDate"></asp:CalendarExtender>
                            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="End Dtae">
                           <ItemTemplate>
                                        <asp:TextBox ID="txtEndDate" runat="server" Text='<%# Bind("EndDate") %>' **onchange="CompareDates(txtStartDate.Text,this.Text)**;" ></asp:TextBox>
                                        <asp:CalendarExtender ID="txtEndDate_CalendarExtender" runat="server" Format="dd/MM/yyyy" Enabled="True" TargetControlID="txtEndDate">**strong text**</asp:CalendarExtender>
                           </ItemTemplate>
         </asp:TemplateField>

grid is dynamic and user can add any number of rows to it. my need is to check the date without looping the entire gridview rows on submit button click. onchange of the txtenddate i want to pass the values of both text boxes..

can anybody help me..

Thank You..

Answer 1

Use GridView_RowDataBound event of gridview and on attributes you can attach the javascript onchange event

void GridView_RowDataBound(Object sender, GridViewRowEventArgs e)
{

    if(e.Row.RowType == DataControlRowType.DataRow)
    {
        if(e.Item.ItemType == ListItemType.Item)
        {
            TextBox txtStartDate = e.Row.FindControl("txtStartDate") as TextBox;
            TextBox txtEndDate= e.Row.FindControl("txtEndDate") as TextBox;

            txtEndDate.Attributes.Add("onchange", "CompareDates('" + txtStartDate.ClientID+ "', '" +txtEndDate.ClientID+ "');");
        }
}

}

And in your javascript function

function CompareDates(ctrlStartID, ctrlEndID) 
{ 
   var startDate = document.getElementByID(ctrlStartID).value; 
   var endDate = document.getElementByID(ctrlEndID).value; 
   //your further code
} 

Answer 2

You can try following code

TextBox txtStartDate = yourGridViewName.SelectedRow.FindControl("txtStartDate") as TextBox;
TextBox txtEndDate = yourGridViewName.SelectedRow.FindControl("txtEndDate") as TextBox;

Then you can get text as normally:

 string startDate = txtStartDate.Text;
 string endDate = txtEndDate .Text;

Please consider that follwong code is . You can try RowDataBound event of GridView to add JavaScript function

protected void yourGridView_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
         //Get TextBoxes
         TextBox txtStartDate = yourGridViewName.SelectedRow.FindControl("txtStartDate") as TextBox;
         TextBox txtEndDate = yourGridViewName.SelectedRow.FindControl("txtEndDate") as TextBox;

         //Get text
         string startDate = txtStartDate.Text;
         string endDate = txtEndDate .Text;

         //Assign the function
         e.Row.Attributes.Add("Onchange", "CompareDates('" + startDate + "', '" + endDate + "'");
    }
}

Answer 3

The best method I would suggest you is to add the Row_DataBound and in this event read the rows and add the change event programmatically.

void CustomersGridView_RowDataBound(Object sender, GridViewRowEventArgs e) {

if(e.Row.RowType == DataControlRowType.DataRow)
{
            Textbox text1 = ((Textbox )e.Row.FindControl("Textbox1"));
            Textbox text2 = ((Textbox )e.Row.FindControl("Textbox2"));
            text2 .Attributes.Add("onfocus", "EventName('"+text1 .Text+"','"+text1.Text+"')"+);


}

}