According to your description,there are two ways for you to choose.
First, as Bruce recommends, you could use the
onSelect event of the datepicker to call the Ajax method to rebind the filtered data to the gridview when you select a date.
Second, you could use the OnTextChanged event of textbox to get the date value selected by textbox directly in the code behind, then rebind the data filtered by gridview.
Here I use the second method to do an example, you could refer to the following code:
Participant
753 Points
2406 Posts
How to fire when the text 's jquery datepicker is selected
Jun 02, 2019 01:01 PM|hkbeer|LINK
I have a date textbox which filters the Gridview.
I added a jquery datepicker to this textbox
How to make it fire when date is selected so the Gridview filter based on this date is selected ?
Thanks
www.developerfusion.com/tools/convert/csharp-to-vb/
All-Star
58164 Points
15647 Posts
Re: How to fire when the text 's jquery datepicker is selected
Jun 02, 2019 08:49 PM|bruce (sqlwork.com)|LINK
try the docs:
https://api.jqueryui.com/datepicker/#option-onSelect
Contributor
3710 Points
1043 Posts
Re: How to fire when the text 's jquery datepicker is selected
Jun 03, 2019 02:23 AM|Yongqing Yu|LINK
Hi hkbeer,
According to your description,there are two ways for you to choose.
First, as Bruce recommends, you could use the onSelect event of the datepicker to call the Ajax method to rebind the filtered data to the gridview when you select a date.
Second, you could use the OnTextChanged event of textbox to get the date value selected by textbox directly in the code behind, then rebind the data filtered by gridview.
Here I use the second method to do an example, you could refer to the following code:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <link href="../jquery-ui-1.12.1.custom/jquery-ui.structure.min.css" rel="stylesheet" /> <link href="../jquery-ui-1.12.1.custom/jquery-ui.min.css" rel="stylesheet" /> <script src="../Scripts/jquery-1.10.2.min.js"></script> <script src="../jquery-ui-1.12.1.custom/jquery-ui.min.js"></script> <script type="text/javascript"> $(function () { $("#datepicker").datepicker(); }); </script> </head> <body> <form id="form1" runat="server"> <div> Date:<asp:TextBox ID="datepicker" runat="server" OnTextChanged="datepicker_TextChanged" AutoPostBack="true"></asp:TextBox><br /> <br /> <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="ResultId" OnRowDataBound="GridView1_RowDataBound"> <Columns> <asp:BoundField DataField="ResultId" HeaderText="ResultId" InsertVisible="False" ReadOnly="True" SortExpression="ResultId" /> <asp:BoundField DataField="ResumeID" HeaderText="ResumeID" SortExpression="ResumeID" /> <asp:BoundField DataField="HRID" HeaderText="HRID" SortExpression="HRID" /> <asp:BoundField DataField="TelInterviewerID" HeaderText="TelInterviewerID" SortExpression="TelInterviewerID" /> <asp:BoundField DataField="F2FInterviewerID" HeaderText="F2FInterviewerID" SortExpression="F2FInterviewerID" /> <asp:BoundField DataField="AvgScore" HeaderText="AvgScore" SortExpression="AvgScore" /> <asp:BoundField DataField="Result" HeaderText="Result" SortExpression="Result" /> <asp:BoundField DataField="EntryDate" HeaderText="EntryDate" SortExpression="EntryDate" /> </Columns> </asp:GridView> </div> </form> </body> </html>
code behind:
The result of my work demo:
Best Regards,
YongQing.
Please remember to click "Mark as Answer" the responses that resolved your issue.
If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.