为所有数据选择器文本框使用单个数据交换功能

Question

如何将单个日期选择器jquery用于所有新动态添加的日期选择器文本框

Answer 1

一个粗略的解决办法可以做得更好。但很管用。希望能帮上忙。

逻辑是根据行数动态更改id，并初始化每个输入的日期选择器。

您的版本不起作用，因为您只是复制了html内容并粘贴。数据报警器需要再次初始化才能工作。

cell1.innerHTML= '<input id="datePicker'+$(row).index()+'" /></td>';//change innerhtml
$('#datePicker'+c).kendoDatePicker({})); initialze the datepicker again.//init datepicker again

http://jsfiddle.net/9ZTXB/1/

Answer 2

由于您对每个datepicker重复相同的id，所以最好使用类而不是id。

而且，由于新的数据报警器是动态创建的，所以您需要在创建新的数据报警器之后调用kendoDatePicker函数。

<table id="myTable">
    <tr><td><input class="datePicker" /></td></tr>
 </table>
<br>
<button type="button" onclick="displayResult()">Insert new row</button>


$(".datePicker").kendoDatePicker({
    close: function() {
       console.log("closed datePicker");   
    }
});


function displayResult()
{
var table=document.getElementById("myTable");
var row=table.insertRow(-1);
var cell1=row.insertCell(0);
cell1.innerHTML=table.rows[0].cells[0].innerHTML;    
$(".datePicker").kendoDatePicker({
    close: function() {
       console.log("closed datePicker");   
    }
});
}