JQuery - für jeden Loadtemplate Namen des Eingangs zu ändern()

Question

Hier ist eine Vorlage ich jedes Mal auf eine Schaltfläche geklickt machen will, ist:

<script id="hidden-template" type="text/html"> 
<div id="order-container"> 
    <div class="form-group "> 
     <input class="form-control name" placeholder="Name" type="text"> 
    </div> 
    <div class="form-group "> 
     <ul class="food" style="list-style-type: none; display:inline-block;"> 
      <li><label><input value="burger" type="radio" class="burger" data-name="food">Burger</label></li> 
      <li><label><input value="chicken" type="radio" class="chicken" name="food">Chicken</label></li> 
      <li><label><input value="falafel" type="radio" class="falafel" name="food">Falafel</label></li> 
      <li><label><input value="fries" type="radio" class="fries" name="food">Fries</label></li> 
     </ul> 
     <ul class="veggies" style="list-style-type: none; display:inline-block;"> 
      <li><label><input type="checkbox" class="lettuce" name="veggie">Lettuce</label></li> 
      <li><label><input type="checkbox" class="tomato" name="veggie">Tomato</label></li> 
      <li><label><input type="checkbox" class="cucumber" name="veggie">Cucumber</label></li> 
      <li><label><input type="checkbox" class="onion" name="veggie">Onion</label></li> 
     </ul> 
     <ul class="sauces" style="list-style-type: none; display:inline-block;"> 
      <li><label><input type="radio" class="XSpice" name="sauce">Extra Spicy</label></li> 
      <li><label><input type="radio" class="spice" name="sauce">Spicy</label></li> 
      <li><label><input type="radio" class="mild" name="sauce">Mild</label></li> 
      <li><label><input type="radio" class="noSpice" name="sauce">No Spice</label></li> 
     </ul> 
    </div> 
</div> 

Und auf dem ersten Listenelement der ersten Ich versuche, für jede Vorlage einen benutzerdefinierten Namen hinzuzufügen, sodass beim Laden einer neuen Vorlage nicht alle anderen Eingaben in dieser Vorlage betroffen sind, da sie einen anderen Namen haben.

Hier ist, wo ich es bin Rendering:

$("#app").loadTemplate($("#hidden-template"), { 
    food: "TESTING" 
}) 

aber wenn ich den Namen des Eingangs console.log, gibt es nicht definiert. Gibt es keinen Datennamen? Ich kann nicht scheinen, eine gute Dokumentation zu finden, weil ich denke, dass es ein Plugin von JQuery ist. Wie kann ich den Namen der Eingänge bei jedem Laden der Vorlage ändern? Oder gibt es einen besseren Weg, dies zu tun?

Answer 1

Wie wäre es damit?

$("li").first().attr('data-name') = "TESTING";