Клон выбрать вместе с другими входными тегами?

Question

Я пытаюсь клонировать строку таблицы и сгенерировать массив с идентификатором, поскольку пользователь может вставить n строк. Проблема, с которой я сталкиваюсь, заключается в том, что у меня есть 1 вариант выбора в этой строке таблицы. Как клонировать выделение вместе с другими входными тегами, которые находятся в одной строке? (этот код генерирует 2 набора строк за раз, так как два appendTo () работают. Спасибо за помощь!

$("#add").click(function() {
    $("#comTable tr:eq(0)").clone().find("input").each(function() {
        // creates array of ids if the user wants to add more than 1 row so it is N[1], etc
        $(this).val('').attr('id', function(_, id) {
            return id + 'N' + '[' + i + ']'
        });
        $(this).val('').attr('name', function(_, name) {
            return name + 'N' + '[' + i + ']'
        });
    }).end().appendTo("#comTable");

    $("#comTable tr:eq(0)").clone().find("select").each(function() {
        // creates array of ids if the user wants to add more than 1 row so it is N[1], etc
        $(this).val('').attr('id', function(_, id) {
            return id + 'N' + '[' + i + ']'
        });
        $(this).val('').attr('name', function(_, name) {
            return name + 'N' + '[' + i + ']'
        });
    }).end().appendTo("#comTable");
    i++;
});​

Answer 1

Вы можете просто выбрать элемент input и select следующим образом:

Старый код:

$("#comTable tr:eq(0)").clone().find("input").each(function() {
    // creates array of ids if the user wants to add more than 1 row so it is N[1], etc
    $(this).val('').attr('id', function(_, id) {
        return id + 'N' + '[' + i + ']'
    });
    $(this).val('').attr('name', function(_, name) {
        return name + 'N' + '[' + i + ']'
    });
}).end().appendTo("#comTable");

$("#comTable tr:eq(0)").clone().find("select").each(function() {
    // creates array of ids if the user wants to add more than 1 row so it is N[1], etc
    $(this).val('').attr('id', function(_, id) {
        return id + 'N' + '[' + i + ']'
    });
    $(this).val('').attr('name', function(_, name) {
        return name + 'N' + '[' + i + ']'
    });
}).end().appendTo("#comTable");

Новый код:

$("#comTable tr:eq(0)").clone().find("input, select").each(function() {
    // creates array of ids if the user wants to add more than 1 row so it is N[1], etc
    $(this).val('').attr('id', function(_, id) {
        return id + 'N' + '[' + i + ']'
    });
    $(this).val('').attr('name', function(_, name) {
        return name + 'N' + '[' + i + ']'
    });
}).end().appendTo("#comTable");

Обратите внимание на селектор "input, select".

Редактировать

Другой способ, которым вы могли бы сделать это, если вы хотите обрабатывать select по-разному, это связать его по-другому:

$("#comTable tr:eq(0)")
    .clone()
    .find("input")
    .each(function() {
            // creates array of ids if the user wants to add more than 1 row so it is N[1], etc
            $(this).val('').attr('id', function(_, id) {
                return id + 'N' + '[' + i + ']'
            });
            $(this).val('').attr('name', function(_, name) {
                return name + 'N' + '[' + i + ']'
            });
        })
    .end() //End .find("input")
    .find("select")
    .each(function() {
            // creates array of ids if the user wants to add more than 1 row so it is N[1], etc
            $(this).val('').attr('id', function(_, id) {
                return id + 'N' + '[' + i + ']'
            });
            $(this).val('').attr('name', function(_, name) {
                return name + 'N' + '[' + i + ']'
            });
        })
    .end() //End .find("select")
    .appendTo("#comTable");
i++;

Этот способ удаляет лишний клон и снова запускает .find для вновь клонированного элемента DOM.