对动态添加的行进行验证

Question

我正在克隆一行，如果代码存在，我想检查数据库。这一切在第一行都可以正常工作，但在克隆的行上却没有。我有一个想法，我必须使该字段的ID唯一，我试图添加代码，检查代码是否存在添加按钮事件，但它不起作用。有人可以告诉我如何合并这两个脚本，以便它可以在克隆的行上工作。

代码：

HTML

<table>
<tr id="show_codes">
    <td colspan="2" class="text-fields" align="center" valign="middle">
        <div class="codeForm">
            <table class="codeForm" align="left" width="500px" cellpadding="0" style="padding-left: 20px;" cellspacing="0">
                <tr>
                    <td height="15px">Codes that exist is 0011, 1234</td>
                </tr>
                <tr class="code_row">
                    <td class="details-border1" height="40px" valign="middle" bgcolor="#f3f3f3" align="center">
                        <input id="code" value="" class="text ui-widget-content ui-corner-all" type="text" name="code[]" />
                        <div id="status"></div>
                    </td>
                    <td class="details-border2" bgcolor="#f3f3f3" align="center">
                        <input value="" class="text ui-widget-content ui-corner-all" type="text" name="value[]" />
                    </td>
                    <td class="borders-right-bottom" bgcolor="#f3f3f3" align="center">
                        <input type="button" class="btnDeleteCode" value="Delete" />
                    </td>
                </tr>
            </table>
        </div>
        <table width="500px" align="left">
            <tr>
                <td align="right"><span style="cursor: pointer; color: #007FC6; font-weight: bold;" id="btnAddCode" value="add more">Add another code</span>

                </td>
            </tr>
        </table>
    </td>
</tr>

JQUERY

var dom = {};
dom.query = jQuery.noConflict(true);

dom.query(document).ready(function () {

    var clonedRow = dom.query('.code_row').clone().html();
    var appendRow = '<tr class = "code_row">' + clonedRow + '</tr>';
    var counter = 0;
    dom.query('#btnAddCode').click(function () {

        dom.query('.codeForm tr:last').after(appendRow);
        counter++;
        $('.codeForm tr:last input[type="text"]').attr('id', 'code[' + counter + ']');
        $('.codeForm tr:last').find('input').val('');
    });

    dom.query('.btnDeleteCode').live('click', function () {
        var rowLength = dom.query('.code_row').length;
        if (rowLength > 1) {
            deleteRow(this);
        } else {
            dom.query('.codeForm tr:last').after(appendRow);
            deleteRow(this);
        }
    });

    function deleteRow(currentNode) {
        dom.query(currentNode).parent().parent().remove();
    }
});

pic1 = new Image(16, 16);
pic1.src = "loader.gif";

pic2 = new Image(16, 16);
pic2.src = "tick.gif";

dom.query(document).ready(function () {

    dom.query("#code").change(function () {

        var usr = dom.query("#code").val();

        if (usr.length >= 4) {
            dom.query("#status").html('<img src="loader.gif" align="absmiddle">&nbsp;Checking availability...');
            alert(usr);
            dom.query.ajax({
                type: "POST",
                url: "setup_practice_preference_check_code.php",
                data: "username=" + usr,
                success: function (msg) {

                    dom.query("#status").ajaxComplete(function (event, request, settings) {

                        if (msg == 'OK') {
                            dom.query("#code").removeClass('object_error'); // if necessary
                            dom.query("#code").addClass("object_ok");
                            dom.query(this).html('&nbsp;<img src="tick.gif" align="absmiddle">');
                        } else {
                            alert('msg');
                            dom.query("#code").removeClass('object_ok'); // if necessary
                            dom.query("#code").addClass("object_error");
                            dom.query(this).html(msg);
                        }
                    });
                }
            });

        } else {
            dom.query("#status").html('<font color="red">The username should have at least <strong>4</strong> characters.</font>');
            dom.query("#code").removeClass('object_ok'); // if necessary
            dom.query("#code").addClass("object_error");
        }
    });

});

Fiddle

谢谢