I am facing issue while executing and cloning datepicker. The base datepicker working fine, however the cloned datepicker not working. Can somebody please help me with this. Struggling to get is solve. Here is what I tried:
<input type="button" class="addbutton" id="addfield_button" style="font-size: x-small; color: blue; vertical-align: middle" value="Add" />
<table id="mitigationsTable">
<tr><td>@(Html.Kendo().DatePicker().Name("datepicker").Value("10/10/2011").HtmlAttributes(new { type = "text" }))
</td>
</tr>
</table>
<script type="text/javascript">
$(document).ready(function () {
$("#addfield_button").click(function (e) {
$("#mitigationsTable tr:first").clone().find("input").each(function () { }).end().appendTo("table");
});
});
Managed to solve this. Instead of using kendo datepicker to clone from, just make a generic editor in your HTML:
@Html.Editor("date_0", new { htmlAttributes = new { style="width:100%" } })
Whenever you click your clone button, get the new input element and use JQuery to intialize it with kendo date picker:
$("#mitigationsTable tr:first").clone().find("input").kendoDatePicker();
This will make the cloned elements have the datepicker.
In my case, I had the original input in a hidden div. If you make your first tr field hidden then did a clone with initialzing kendo datepicker on document ready, you should be able to have a datepicker by default when the page loads and then allow it to work for subsequent cloning.
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments