1

私の日付ピッカーは単純なコードで動作します。それを使用した後、クリックで機能しない新しい行を挿入<tr>します。しかし、最初のクリックでそのオブジェクトを取得できます<input/>。その他inputをクリックすると機能し、日付ピッカーのポップアップを表示するためにもう一度クリックしてみてください。

私のjQuery:

$('#myTable tr:last').after("<tr><td align='center'style='background-color:"+rcolor+"'>"+rowCount+
            "</td><td><input style='width:300px !important;' name='onvan' /></td>"+
            "<td><input style='width:100px !important;' name='' id='startdate'/></td>"+
            "<td><input style='width:100px !important;' name='' id='enddate'/></td>"+
            "<td><input style='width:100px !important;' name='' id='' /></td>"+
            "<td>"+
            "<select name='visible'>"+
            "<option></option>"+
            "<option></option>"+
            "<option></option>"+
            "<option></option>"+
            "<option></option>"+
            "<option></option>"+
            "</select></td>"+
            "<td><select name='visible'><option value='1' >فعال</option><option value='0' >غیرفعال</option></select>"+
            "&nbsp;&nbsp;<span id='saveToDb'><a href='#'>ذخیره</a></span>&nbsp;<span id='cancelToSave'><a href='#'>لفو</a></span></td>"+
            "</tr>");

データピッカー:

$(function() {
    $('#startdate').live('click', function() {
        // alert( $(this));

             $(this).datepicker({
                changeMonth: true,
                changeYear: true,
                showButtonPanel: true,
                dateFormat: 'yy/mm/dd',
                minDate: '-3y',
                maxDate: '+3y',
                regional: 'fa',
                onSelect: function (dateText, inst) {
                         var date = new JalaliDate(inst['selectedYear'], inst['selectedMonth'], inst['selectedDay']).getGregorianDate();
                          var month= (date.getMonth()+1).toString(); 
                          if (month.length <2) month='0'+ month; 

                          var day= date.getDate().toString(); 
                          if (day.length <2) day ='0'+ day;
                          $('#taTarikh').val(date.getFullYear() + '-' + month + '-' + day);
                          // alert($('#taTarikh').val());
                }
             });    
          });                 
});
4

1 に答える 1

1

.live('click',function(){});最初のクリックで日付ピッカーを実装しているため、2 回目のクリックで機能し始めます。

オブジェクトを作成した後、datepicker を実装する必要があります。

$(function() {
    $('#myTable tr:last').after("<tr><td align='center'style='background-color:yellow'>3</td><td><input style='width:300px !important;' name='onvan' /></td>" + "<td><input style='width:100px !important;' name='' id='startdate'/></td>" + "<td><input style='width:100px !important;' name='' id='enddate'/></td>" + "<td><input style='width:100px !important;' name='' id='' /></td>" + "<td>" + "<select name='visible'>" + "<option></option>" + "<option></option>" + "<option></option>" + "<option></option>" + "<option></option>" + "<option></option>" + "</select></td>" + "<td><select name='visible'><option value='1' >فعال</option><option value='0' >غیرفعال</option></select>" + "&nbsp;&nbsp;<span id='saveToDb'><a href='#'>ذخیره</a></span>&nbsp;<span id='cancelToSave'><a href='#'>لفو</a></span></td>" + "</tr>");
    $("#startdate").datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'yy/mm/dd',
        minDate: '-3y',
        maxDate: '+3y',
        regional: 'fa',
        onSelect: function(dateText, inst) {
            var date = new JalaliDate(inst['selectedYear'], inst['selectedMonth'], inst['selectedDay']).getGregorianDate();
            var month = (date.getMonth() + 1).toString();
            if (month.length < 2) month = '0' + month;
            var day = date.getDate().toString();
            if (day.length < 2) day = '0' + day;
            $('#taTarikh').val(date.getFullYear() + '-' + month + '-' + day);
            // alert($('#taTarikh').val());
        }
    });
});

デモ: http://jsfiddle.net/BerkerYuceer/pBQFF/14/

于 2012-12-11T10:12:00.263 に答える