Question

iam使用jquery在我的视图中动态添加多行这是代码

 // start a counter for new row IDs
// by setting it to the number
// of existing rows
$(".datepick").datepicker();
var newRowNum = 0;

// bind a click event to the "Add" link
$('#addnew').click(function() {

    $(".datepick").datepicker("destroy");

    // increment the counter
    newRowNum = $(productTable).children('tbody').children('tr').length + 1;

    // get the entire "Add" row --
    // "this" refers to the clicked element
    // and "parent" moves the selection up
    // to the parent node in the DOM
    var addRow = $(this).parent().parent();

    // copy the entire row from the DOM
    // with "clone"
    var newRow = addRow.clone();

    // set the values of the inputs
    // in the "Add" row to empty strings
    $('input', addRow).val('');

    // insert a remove link in the last cell
    $('td:last-child', newRow).html('<a href="" class="remove">rem<i class="icon-minus"><\/i><\/a>');


    // insert the new row into the table
    // "before" the Add row
    addRow.before(newRow);


    $(".datepick").datepicker();

    // add the remove function to the new row
    $('a.remove', newRow).click(function() {
        $(this).closest('tr').remove();
        return false;
    });

    $('#date', newRow).each(function(i) {
        var newID = 'date_' + newRowNum;
        $(this).attr('id', newID);

    });

    // prevent the default click
    return false;
});

// remove's default rows
$('.removeDefault').click(function() {
    $(this).closest('tr').remove();
    return false;
});

我使用此代码参考http://jsfiddle.net/vdFaH/200/

在jsfiddle它工作正常，但在我看来，它不起作用。我错过了任何脚本文件。

Answer 1

我仍然认为你可能缺少jQuery UI脚本文件。看一下Datepicker示例。

http://jqueryui.com/datepicker/

http://jqueryui.com/

使用jquery添加动态行

1 个答案: