Inkrementieren Element-ID beim Klonen einer Zeile in Javascript

Ich habe eine HTML-Seite, wo in einer Zeile 2 Dropdown-Elemente und ein Texteingabeelement hat. Ich habe eine Schaltfläche hinzugefügt, um diese Zeile erfolgreich zu klonen. Ich fügte eine weitere Schaltfläche für eine Aktion POST hinzu, um alle Dropdown- und Textinput-Werte in die Datenbank zu übertragen. Problem hier ist beim Klonen, die Id der Elemente in der Zeile sind auch geklont - so kann ich die Werte nicht abrufen.Inkrementieren Element-ID beim Klonen einer Zeile in Javascript

Mein HTML-Code:

<div class="rule"> 
       <div class="form-group"> 

        <div class="col-md-3 col-sm-3 col-xs-3"> 
        <select class="form-control" name="condition" id="condition"> 
        <option value="">Choose Sensor</option> 
        <option>1</option> 
         <option>2</option> 
         <option>3</option> 
        </select> 
        </div> 


        <div class="col-md-3 col-sm-3 col-xs-3"> 
        <select class="form-control" name="paraop" id="paraop"> 
         <option>Choose Condition</option> 
         <option>Equal to</option> 
         <option>Less than</option> 
         <option>Greater than</option> 
        </select> 
        </div> 

        <div class="col-md-3 col-sm-3 col-xs-3"> 
        <input type="text" required="true" placeholder="Value..." class="form-control" name="value" id="value"> 
        </div> 
       </div> 

       <div class="rule-options"> 
       <a href="#" class="add-rule-btn"><i class="fa fa-plus-circle"></i></a> 
       <a href="#" class="remove-rule-btn"><i class="fa fa-times-circle"></i></a> 
       </div> 
       </div>

Die Elemente geklont sind "Bedingung", "paraop" und "Wert".

Javascript-Code zu klonen:

 handleAddRule: function() { 

     var _self = this; 

    $('.add-rule-btn').live('click', function() { 
     var parentRuleGroup = $(this).parents('.rule'); 
     var newRule = $('.rule:first').clone(); 

    newRule.insertAfter($(this).parents('.rule')); 

     return false; 
    }); 
    },

Ich denke das Element Ids jedes Mal zu inkrementieren drücke ich das Add Knopf- So kann ich leicht die Elemente durch ihre Ids von der POST PHP-Datei holen. Aber wie kann ich den Id Wert erhöhen? Oder gibt es eine andere Möglichkeit, die Elemente von der POST-Seite abzurufen?

Quelle

2016-09-08 NoMadic

Welche Werte müssen Sie holen, und wie tun Sie das? Zeigen Sie den relevanten Code an. Es gibt unzählige andere Möglichkeiten, Elemente auszuwählen. Die einfachste Lösung wäre wahrscheinlich, in der Unterstruktur, die Sie klonen, überhaupt keine IDs zu verwenden. – CBroe

Ihre Frage ist zu vage, bitte markieren Sie die relevanten Teile Ihrer Frage, welche IDs möchten Sie erhalten und erhöhen? Welche IDs möchten Sie auf der POST-Seite abrufen? –

Die IDs, die ich abrufen möchte, sind "condition", "paraop" und "value" (und ihre Klone) – NoMadic

Haben Sie dies zur Arbeit. Alles, was ich brauchte, war dieser zusätzliche Block in Javascript, der die Eingaben findet und eine inkrementierte Zahl an ihn anfügt.

count++; 
newRule.find(':input').attr('id', function(i, val) { 
     return val + count; 
    });

Basierend auf der Antwort hier auf diese Frage Clone form and increment ID

Quelle

2016-09-12 11:41:11 NoMadic

Inkrementieren Element-ID beim Klonen einer Zeile in Javascript

Antwort

Verwandte Themen