Использование Jquery для динамического добавления / удаления строк таблицы - PullRequest
Новая
       4

Использование Jquery для динамического добавления / удаления строк таблицы

1 голос
/ 09 ноября 2011

Я работаю над тем, чтобы динамически разрешить пользователю добавлять или удалять строки таблицы, которые содержат поля формы.

Есть две основные проблемы, которые у меня возникают, которые связаны с возможностью использовать селектор для захвата второго элемента таблицы (в надежде игнорировать строку заголовка)

и второй работы сjQuery и отключенный атрибут.При первоначальном вызове я не могу изменить атрибут после этого с помощью оператора js if.

мой код находится здесь для проверки: http://jsfiddle.net/Jcortes/BE5Lr/792/

Если кто-то может помочь, это будетценится. 

$(document).ready(function() {
$('#DelBtn').attr('disabled', 'disabled');
var count = 1;
//*******************************************************************    
$('#AddBtn').click(function() {
    //problem is below, the selector is not returning the other elements. (ex=second)
    $("table tr:first").clone().find("input").each(function() {
        $(this).val('').attr('id', function(_, id) {
            return id + count;
        });
    }).end().appendTo("table");
    count++;
    if (count == 2) {
        $('#DelBtn').attr('disabled', '');
    }        
    if (count == 5) {
        $('#AddBtn').attr('disabled', 'disabled');
    }
}); //end AddBtn Function
//*******************************************************************    
$('#DelBtn').click(function() {
    $("table tr:last").remove();
    count--;
    if (count == 1) {
        $('#DelBtn').attr('disabled', 'disabled');
        $('#AddBtn').attr('disabled', '');
    }
}); //end DelBtn Function
//*******************************************************************    
}); //end DOM Ready

1 Ответ

0 голосов
/ 09 ноября 2011

Причина, по которой вызов attr('disabled', '') не удался i, потому что вы используете jQuery 1.7. jquery 1.7 теперь правильно различает атрибуты и свойства. Отключено это свойство. Вместо этого используйте метод .prop () . 

$('selector').prop('disabled', 'disabled');
$('selector').prop('disabled', '');

Ах, теперь я вижу вторую проблему. Вы можете использовать селектор nth-child, чтобы получить второй ряд. 

$('table tr:nth-child(2)').clone();

http://jsfiddle.net/BE5Lr/793/

...