Wie klonen Elemente für CakePHP Elemente

Question

Ich habe eine Vorlage (aus einer Menge von HTML-Tags, die es TextArea oder Arten von Eingaben sein könnten) Ich möchte die Vorlage klonen. Ich möchte die Attribute 'name' und 'id' jedes Elements umbenennen, indem Sie die Nummer beim Klonen ersetzen. Ich bevorzuge Regex, um das zu tun.

Ich möchte alle HTML-Elemente durchlaufen und die Attribute neuer Elemente umbenennen. z.B.

id="extrainfofiles-0-extrainfofile-extra-info-file-type-id" 
for="extrainfofiles-0-extrainfofile-extra-info-file-type-id" 
name="ExtraInfoFiles[0][ExtraInfoFile][extra_info_file_type_id]" 

An:

id="extrainfofiles--566345634-extrainfofile-extra-info-file-type-id" 
for="extrainfofiles--566345634-extrainfofile-extra-info-file-type-id" 
name="ExtraInfoFiles[-566345634][ExtraInfoFile][extra_info_file_type_id]" 

Jede Hilfe bitte. Hier

ist JsFiddle: https://jsfiddle.net/isaacrajaei/133ko1un/

Answer 1

/** 
* Add A File 
*/ 
$('#extrainfo-files').on('click', '.extrafile-add', function(){ 

    // Create the new row 
    var $fileList = $('.file-list-extrainfo'); 
    var $template = $('.extrainfo-file-template').clone(); 

    var rowId = '-' + (new Date).getTime(); 
    $template.removeClass('extrainfo-file-template hide').attr('data-id', rowId); 

    // Append the new row to the list 
    $template.appendTo($fileList); 

    // Rename the attributes 
    var $row = $('.file-row[data-id="' + rowId + '"]'); 
    updateElements($row.selector, 0, rowId); 

}); 


function updateElements(el, from, to) 
    { 
     $(el).find('[name*="['+from+']"], [id*="-'+from+'-"], [for*="-'+from+'-"]').attr({ 
      "name" : function(int, input){ 
       if (input != null){ 
        return input.replace('['+from+']', '[' + to + ']'); 
       } 
      }, 
      "id" : function(int, input){ 
       if (input != null){ 
        return input.replace('-'+from+'-', '-' + to + '-'); 
       } 
      }, 
      "for" : function(int, input){ 
       if (input != null){ 
        return input.replace('-'+from+'-', '-' + to + '-'); 
       } 
      }, 
      "value" : "" 
     }).end(); 
    } 

Answer 2

$('#extrainfo-files').on('click', '.extrafile-add', function(){ 

    // Create the new row 
    var $fileList = $('.file-list-extrainfo'); 
    var $template = $('.extrainfo-file-template').clone(); 

    var rowId = '-' + (new Date).getTime(); 
    $template.removeClass('extrainfo-file-template hide').attr('data-id', rowId); 

    $template.find('[name*="[0]"], [id*="-0-"], [for*="-0-"]').attr({ 
       "name" : function(int, input){ 
        if (input != null){ 
         return input.replace('[0]', '[' + rowId + ']'); 
        } 
       }, 
       "id" : function(int, input){ 
        if (input != null){ 
         return input.replace('-0-', '-' + rowId + '-'); 
        } 
       }, 
       "for" : function(int, input){ 
        if (input != null){ 
         return input.replace('-0-', '-' + rowId + '-'); 
        } 
       }, 
       "value" : "" 
    }).end(); 


    $template.appendTo($fileList); 

});