Ausweitung der Klon-Tabelle-Reihen - Funktionen- ändern von Zeilen-ID

Habe ich diese Geige am: http://jsfiddle.net/radi8/EwQUW/33/

Beachten Sie, dass die erste Tabelle definiert ist:

<table class="reference" width="100%" border="1" align=left id="secondaryEmails">
<thead>
    <tr>
        <th width="30%">SelectRow</th>
        <th width="40%">Email</th>
        <th width="30%">Ship Type</th>
    </tr>
</thead>
<tbody>
    <tr id="template" style="display:none">
        <td align="center">
            <input type=radio id="index_" name = "index" value="0">
        </td>
        <td align="center">
            <input type="text" id="email_" name ="email_" value="" size=40>
        </td>
        <td align="center">
            <select style=width:150 id="shipType_" name="shipType_">
                <option value="0" "selected">Both</option>
                <option value="1">Over Road</option>          
                <option value="2">Over Rail</option>
            </select>
        </td>
    </tr>
    <tr>
        <td align="center">
            <input type=radio id="index_2" name = "index" value="2">
        </td>
        <td align="center">
            <input type="text" id="email_2" name ="email_2" value="[email protected]" size=40>
        </td>
        <td align="center">
            <select style=width:150 name="shipType_2" id="shipType_2">
                <option value="0" >Both</option>
                <option value="1" >Over Road</option>
                <option value="2" selected>Over Rail</option>
            </select>
        </td>
    </tr>
</tbody>
<tfoot>
    <tr>
        <th align="center">
            <button id='Add'>Add Row</button>
        </th>
        <th>&nbsp;</th>
        <th align="center">
            <button id='update'>Update</button>
        </th>
    </tr>
</tfoot>

Wenn ich clone die erste Zeile, die ich ändern muß die ID der neuen Zeile, um so etwas wie

<tr id="emlRow_1">

wobei die Zahl der neuen ID der Zeile.

Kann jemand mich leiten, wie dies zu tun?

InformationsquelleAutor radi8 | 2011-08-08

jquery

4

Vielleicht bin ich etwas fehlt, aber das sollte so einfach, wie die Einstellung das Attribut "ID":
```
var $clone = $("#template").clone();
var index = $("table.reference tr:not(.template)").length;
$clone.attr("id", "emlRow_" + index);
```
UPDATES

var count = $("table.Referenz-tr").Länge;
```
$("#Add").click(function() {
    count++;
    var $clone = $("#secondaryEmails tbody tr:first").clone();
    $clone.attr({
        id: "emlRow_" + count,
        name: "emlRow_" + count,
        style: "" //remove "display:none"
    });
    $clone.find("input,select").each(function(){
        $(this).attr({
            id: $(this).attr("id") + count,
            name: $(this).attr("name") + count
        });
    });
    $("#secondaryEmails tbody").append($clone);
});
```
Beispiel: http://jsfiddle.net/hunter/EwQUW/35/
- Ja, aber Blick auf die Fiedel, es ist strukturiert, ein wenig anders als das, was Sie beschreiben.
- aktualisiert meine Antwort und erstellt ein Turnschuh Weg von Ihnen. Können Sie mir sagen, warum es wichtig wäre, für Sie zu haben, die ids w/o jeder numerischen Lücken? Ich sage nicht, Sie brauchen Sie nicht, aber ich will wissen, was Sie versuchen bis zum Ende mit.
- Ist das eine Hausaufgabe?
- Das ist der Teil, der mir fehlte!!! Vielen Dank für die hervorragenden Antworten!!!
- Und, Nein, dies ist keine Hausaufgabe. Meine Absicht ist, dass diese id ' s verwaltbar. Wenn der Benutzer das hinzufügen und entfernen von E-Mails aus der Daten-Tabelle, ich will nicht diese id ' s alle über dem Platz. Ich weiß, es macht wenig Unterschied, ob die id ist 1 oder 1000 aus einer Datenbank-Sicht, aber ich bin ganz besonders über, wie ich möchte, dass meine Daten-Tabellen verwaltet. Vielleicht klingt es ein wenig OCD, aber es ist ein Personal-Präferenz.
InformationsquelleAutor hunter

Können Sie versuchen, diese js-code.

Szenario:-ich war mit dem Szenario machen Klon von Tabelle innerhalb eines div und entfernen auch den Klon auf klicken Sie auf entfernen, Klonen link.

    <script>
    var count=1;
    function makeClone()
    {
    var $clone = $(".cloneTable:first").clone(true);

    $clone.find(':text,:file').each(function() {
            $(this).attr('id',($(this).attr("id")+count));
            $(this).val(' ');
        });
         $clone.find("a").each(function() {
              $(this).val('').attr('id', function(_, id) {
                return count;
              });
            });
         $clone.find("span").each(function() {
             $(this).attr({
                id: $(this).attr("id") + count
         });
        });
             $clone.attr( 'id', function() { 

                  return this.id + count; });
      //for use of datepicker 
      $clone.find('.myDate').removeClass('hasDatepicker').datepicker();

    $clone.appendTo('#addCarrierDiv');
    $('#Test'+count).html('<strong>Test '+(parseInt(count)+parseInt(1))+'</strong>');

    count=count+1;
}
    </script>

Hier bin ich aktualisieren meine Antwort für die Bereitstellung, den code zu entfernen, zu Klonen.

$(document).ready(function(){

$('.removeClone').live('click',function() {

        var length=$('.cloneTable').length;
        if(length==1)
            {
            alert('There should be atleast one clone');
            return false;
            }


        var id = $(this).attr('id');
        var countVal=parseInt(id)+parseInt(1);
        $(this).closest('.cloneTable').remove();
         for(var removecount=parseInt(countVal);removecount<=length;removecount++)
            {
             $clone=jQuery("#maintable"+removecount);
             if(removecount==1)
                 {
                 $clone.find(':text,:file').each(function() {
                        var textId=$(this).attr("id");
                        var testVal=textId.replace(/[0-9]/g, '');
                        $(this).attr('id',testVal);

                    });

                 $clone.find("a").each(function() {
                        var textId=$(this).attr("id");
                        var testVal=textId.replace(/[0-9]/g, '');
                        $(this).attr('id',testVal+id);

                    });

                 $clone.find("span").each(function() {
                        var textId=$(this).attr("id");
                        var testVal=textId.replace(/[0-9]/g, '');
                        $(this).attr({
                         id: testVal
                     });
                         $(this).html('<strong>Test '+removecount+'</strong>');
                    });

                 $clone.attr( 'id', function() { 
                     var textId=$(this).attr("id");
                     var testVal=textId.replace(/[0-9]/g, '');
                      return (testVal);
                      });
                 id=parseInt(id)+parseInt(1);
            }  

             else
                 {
                $clone.find(':text,:file').each(function() {
                    var textId=$(this).attr("id");
                    var testVal=textId.replace(/[0-9]/g, '');
                    $(this).attr('id',testVal+id);

                });
                $clone.find("a").each(function() {
                    var textId=$(this).attr("id");
                    var testVal=textId.replace(/[0-9]/g, '');
                    $(this).attr('id',testVal+id);

                });

                $clone.find("span").each(function() {
                    var textId=$(this).attr("id");
                    var testVal=textId.replace(/[0-9]/g, '');

                    $(this).attr({
                     id: testVal+id
                 });
                     $(this).html('<strong>Test '+removecount+'</strong>');
                });

                 $clone.attr( 'id', function() { 
                     var textId=$(this).attr("id");
                     var testVal=textId.replace(/[0-9]/g, '');
                      return (testVal+id);
                      });
                 id=parseInt(id)+parseInt(1);
                 }
            } 
         count=parseInt(count)-parseInt(1);
    });
});

Diese Arbeit ist in Ordnung für mich.Hoffe, dieser code kann dir helfen.

InformationsquelleAutor Ravi Kant

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.