How to stop last instance of a dynamic form element from being deleted?

its probably easier if you can have a look at the code in action:

http://jsfiddle.net/qe2zt/

Bascially, 开发者_StackOverflowall I want to do is stop the last set of dropdowns from being able to be deleted and as a bonus - figure out how to fade out the deletes aswell - I couldn't get that to work for some reason.

Thanks for any help, it's much appreciated.

Regards,

Martin

I added code to fade out the deleted drop downs.

http://jsfiddle.net/6xPye/1/

Also, the following code:

    if ($(this).is(".dropdown")) {
        $(".dropdownclone:first").toggleClass("dropdown dropdownclone");
    }
    $(this).remove();

Assures that if the user deletes the top row there is still a .dropdown for the addNew() function to clone.

i modified it:

http://jsfiddle.net/scheffield/esEmh/

Essentially I added a function remove

function remove(element) {
    var amountEntries = $('.dropdown').size() + $('.dropdownclone').size();
    if (amountEntries  <= 1) {
        return;
    }
    if (amountEntries === 2) {
        $('.deleteButton').hide();
    }
    element.parentNode.parentNode.removeChild(element.parentNode);
}

It's not exactly perfect but it works...