удалить кнопку удаления на первом наборе полей

Question

http://jsfiddle.net/NzbRQ/2/

Я позволяет пользователю добавить несколько строк полей, но я не хочу, чтобы включить ссылку удалить на первом ряду полей, поэтому они не могут удалите все поля.

Также, как ограничить его только тремя строками полей?

Answer 1

попробовать эту скрипку: Fiddle

Для первой части скрытия удаления в первом ряду я вызывал следующее на загрузку страницы:

$(".removeoutcome").hide(); 

Тогда, чтобы убедиться, что они не могут добавить больше чем 3 или удалить последний, я добавил проверки длины в ваших click методах см:

$('.addoutcome').live('click', function() { 
    if ($(".outcomegroup").length < 3) { 
     $('#template').clone().removeAttr('id').insertAfter($(this).closest('.outcomegroup')).find('.minus').show(); 
     renumber(); 
    } 
}); 

$('.removeoutcome').live('click', function() { 
    if ($(".outcomegroup").length > 1) { 
     $(this).closest('.outcomegroup').remove(); 
     renumber() 
    } 
}); 

Кроме того, на стороне записки, live является теперь, если вы используете jQuery 1.7, измените эти методы на on или, если вы до 1.7, используйте delegate.

Answer 2

Обновлено: http://jsfiddle.net/NzbRQ/5/

Во-первых, канавы .live. Я добавил section, чтобы дать более конкретный селектор, чем body, но, вероятно, что-то лучше, что вы можете использовать в своем оригинальном DOM.

Просто не удаляйте последнюю строку с помощью простой логики. Ваша логика для отображения будущего «del» link была на самом деле уже там! Вам даже не нужна логика удаления последней строки, так как просто не показывать «del» достаточно, но я был просто тщательным.

Answer 3

Вы можете просто скрыть дель для первого элемента и ограничить его только добавить 3 больше набора, используя следующий код

var count = 3; 
$('.minus').first().hide(); 
$('.addoutcome').live('click', function() { 
count--; 
    if(count < 0)return; 
    $('#template').clone().removeAttr('id').insertAfter($(this).closest('.outcomegroup')).find('.minus').show(); 

}); 

здесь является рабочей скрипкой http://jsfiddle.net/joycse06/uW9NQ/

Answer 4

Я не знаю, почему кто-то не обратили пристальное внимание на эту линию:

.find('.minus').show(); 

, где он определенно был не-скрытием del элемента. Короче говоря, единственное, что вам нужно сделать, это добавить надлежащее правило CSS:

.minus { display: none; } 

и это его первый элемент не будет показывать del ссылку и другие будут.

Ограничение на три элемента просто.

$("[parent element]").on('click', '.addoutcome', function() { 
    if($('.addoutcome').length > 2) return;  
    ... 
}); 

Лучше селектор [parent selector] необходимо и полностью зависит в макете. По сути, это элемент, который обертывает все эти элементы, родительский элемент всех из них.