Registrieren Sie die dynamische Steuerung mit Jquery für die automatische Vervollständigung

Question

i die area per erschaffe dynamisch jquery auf eine Schaltfläche klicken werden.

<table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td>
                <div id="lblCustName">
                </div>
            </td>
            <td>
                <div id="lblRemove">
                </div>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <input type="button" value="Add" id="AddRow" />
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <input type="submit" value="Submit" id="SaveCustomers" />
            </td>
        </tr>
        </table>

     <script type="text/javascript" language="javascript">
        $(document).ready(function() {
           //validate post form
            $("#CustomersForm").validate({ ignore: ":not(:visible)" });
           //Initialize the dynamic id
           _DynId = 1;
           //Click Event for Customers
            $('#AddRow').click(function(e) {
                $('#lblCustName').append('<div id="lblCustName' + _DynId + '" style="height:20px;padding-left:10px;">' + '<input type="text" name="CustName" id="CustName' + _DynId + '" class="required" value="" title="*" />');
                $('#lblRemove').append('<div id="lblRemove' + _DynId + '" style="height:20px;padding-left:10px;">' + '<img src="../../Content/Images/delete_icon.gif" onclick=Remove("' + _DynId + '"); title="Remove" id="iRemove' + _DynId + '"></img>');
                _DynId += 1;
            });
 </script>

Ich versuche, die Textbox für Kunden dynamisch hinzuzufügen. Dies ist die HTML-Beispiel für die Funktionalität von Kunden für einen Bericht Verarbeitung Hinzufügen ... Ich brauche die Autocomplete-Option für die Textfelder zu geben.

Ich habe die unten Skript für das verwendet:

$.getJSON("/User/GetAllCustomers/?t=" + new Date(), {},
         function(data) {
             if (data != null) {
                 $("input:text[name=CustName]").autocomplete(data, { mustMatch: false, matchContains: 4, max: 50,
                     formatItem: function(row) {
                         if (row.CustomerName!= "") {
                             return row.CustomerName;
                         }
                     },
                     formatResult: function(row) {
                         return row.CustomerName;
                     }
                 }).result(function(e, row) {
                    //do something
                 });
             }
         });

Die Autovervollständigen funktioniert nicht für die dynamisch hinzugefügt Kontrollen.

Ich versuche, für jede Möglichkeit, die dynamisch hinzugefügt Steuerelemente zum Formular zu registrieren, so dass die zum automatischen Vervollständigung für die dynamisch hinzugefügt Kontrollen funktioniert

Answer 1

Das Problem ist, dass, wenn Sie, dass binden automatisch vervollständigt es auf die Felder verbindlich, die die Wähler übereinstimmen, wenn die Funktion läuft wird. Wenn Sie fügen etwas später, das auch passt es nicht automatisch binden wird.

Für grundlegende jQuery Ereignisse gibt es eine leben Bindung, können Sie dies automatisch, aber die automatische Vervollständigung wird nicht durch diese Arbeit - im Grunde der einzige Wahl jedes Mal ein neues auto-Vervollständigen Sie ein neues Textfeld hinzufügen zu binden, ist

Beispiel: In der AddRow Funktion:

$("#lblCustName" + _DynId + " input[name=CustName]").autocomplete(...);

(Natürlich ersetzen ... mit den Parametern, die Sie wollen)

Sie wollen wahrscheinlich Ihr Datenobjekt setzen, die Sie von dem Webservice in einer globalen Variablen zurück gezogen, dies zu unterstützen, und wahrscheinlich das gleiche mit den Autovervollständigen-Optionen (nur Code-Duplizierung zu vermeiden).