This is a migrated thread and some comments may be shown as answers.

Datepicker clear script for dynamic Telerik control

4 Answers 207 Views
Calendar
This is a migrated thread and some comments may be shown as answers.
Benjamin
Top achievements
Rank 1
Benjamin asked on 08 Mar 2010, 01:39 PM
I have seen a similar issue and client side solution for clearing the Telerik date picker on this forum, but for a dynamically added date picker I can't see the solution. The scenario is the following:
I have a grid where in each row a date picker sits with a clear button to remove the selected date. The grid is built from scratch in code behind and thus the client side clear action script must know which date picker to clear for each grid row.
I ttried to build the script as a string and adding to each grid row as a literal:

dpExpiryDatePicker = new Telerik.WebControls.RadDatePicker();
dpExpiryDatePicker.ID = "dpExpiryDatePicker_" + nCount;
dpExpiryDatePicker.ToolTip = "Select the date";
dpExpiryDatePicker.Width = Unit.Pixel(90);
dpExpiryDatePicker.MinDate = DateTime.Now.Date.AddDays(1);


"<script>" +
"function ClearExpiryDate()" +
"{" +
"   var dpDatePicker = <%=" + dpExpiryDatePicker.ClientID+ "%>;" +
//    "var dpDatePicker = $find(\"<%=" + dpExpiryDatePicker.ClientID+ "%>\");" +
"alert(dpDatePicker);" +
"if(dpDatePicker != null)" +
"{" +
"   dpDatePicker.DateInput.Clear();" +
"}" +
"}" +
"</script>";

Can someone point out how to handle the clearing of each date picker added dynamically? Unfortunately the script above doesn't work, neither work the other commented out line. So how to achieve this?

4 Answers, 1 is accepted

Sort by
0
robertw102
Top achievements
Rank 1
answered on 08 Mar 2010, 04:43 PM
First off, you should be using the commented $find line to get the RadDatePicker control.

Second, the line that your calling to clear the RadDatePicker is incorrect. It should be this: dpDatePicker.clear()

I hope that helps.
0
Benjamin
Top achievements
Rank 1
answered on 09 Mar 2010, 03:52 PM
thanks for a quick reply robert,

maybe I have done something wrong but the commented out section
"   var dpDatePicker = $find(\"<%=" + dpExpiryDatePicker.ID + "%>\");"
returns null as the alert displays it. the stripped down version of the dynamic control creation is below
public void CreateControls()
{
Telerik.WebControls.RadDatePicker dpExpiryDatePicker;
string szScript;
LiteralControl lcClearLiteralControl;
TableCell tcTableCell
TableRow trTableRow;

trTableRow = new TableRow();




dpExpiryDatePicker = new Telerik.WebControls.RadDatePicker();
dpExpiryDatePicker.ID = "dpExpiryDatePicker_" + nCount;
dpExpiryDatePicker.ToolTip = "Select the date";
dpExpiryDatePicker.Width = Unit.Pixel(90);
dpExpiryDatePicker.MinDate = DateTime.Now.Date.AddDays(1);
// I left out the styling of the date picker just to have more readable code

szScript =
"<script>" +
"function ClearExpiryDate()" +
"{" +
"   var dpDatePicker = $find(\"<%=" + dpExpiryDatePicker.ClientID+ "%>\");" +
"alert(dpDatePicker);" +
"if(dpDatePicker != null)" +
"{" +
"   dpDatePicker.DateInput.Clear();" +
"}" +
"}" +
"</script>";
lcClearLiteralControl = new LiteralControl(szScript);

tcTableCell = new System.Web.UI.WebControls.TableCell();
tcTableCell.ID = "ExpiryDateCell_" + nCount;
tcTableCell.CssClass = "MMSTableCell";
tcTableCell.Controls.Add(lbExpiryDateLabel);
tcTableCell.Controls.Add(dpExpiryDatePicker);
tcTableCell.Controls.Add(lcClearLiteralControl);
trTableRow.Cells.Add(tcTableCell);

// table on the aspx page
tDynamicTable.Rows.Add(trTableRow);
}
can actually someone from the Telerik team comment on this if the above code would work with the date picker or anyone else who actually tried similar approach?






0
robertw102
Top achievements
Rank 1
answered on 09 Mar 2010, 04:15 PM
Remove the <%= and %> tags from your script output. You only use that if your writing .NET code in the ASPX page, not in the code behind. So if you DatePicker's ClientID is dpDatePicker_ct100, what your actually outputting in your script is <%=dpDatePicker_ct100%>, which would obviously return null because it doesn't exist.

I hope that helps.
0
Benjamin
Top achievements
Rank 1
answered on 09 Mar 2010, 05:48 PM
OK, here is the reason why it is failing:
 - the page where I am adding the DatePicker to the ControlCollection has a Masterpage and it is breaking the client side API.I have created a simple project with and without MasterPage and the one sitting on a MasterPage is failing when I am trying to add the DatePicker dynamically. unfortunately I cannot add the project as I can only add image files as attachement :(
Hopefully this is just a version bug which was already fixed. Can anyone confirm such a bug and its fix?
I am working with Telerik Q2 2007 version - I guess it is a very old version with this bug so I am just wondering if there is a free upgrade to a version where this bug is fixed?
Tags
Calendar
Asked by
Benjamin
Top achievements
Rank 1
Answers by
robertw102
Top achievements
Rank 1
Benjamin
Top achievements
Rank 1
Share this question
or