2016-07-20 1 views
0

У меня есть форма, как это:JQuery: Генерация «имя» Атрибут массива Динамически

<form> 
    <div class="repeatable"> 
    <div class="repeatable"> 
     <div class="repeatable"> 
     <input name="level_three"> 
     <input name="inner_three"> 
     <a>+</a> 
     </div> 
     <input name="level_two"> 
     <a>+</a> 
    </div> 
    <input name="level_one"> 
    <a>+</a> 
    </div> 
</form> 

знак плюс клоны весь repeatable ближе к себе. Я хочу, чтобы функция JQuery для перебирает repeatable с и сделать имя входного это массив так:

<form> 
    <div class="repeatable"> 
    <div class="repeatable"> 
     <div class="repeatable"> 
     <input name="level_three[0][0]"> 
     <input name="inner_three[0][0]"> 
     <a>+</a> 
     </div> 
     <div class="repeatable"> 
     <input name="level_three[0][1]"> 
     <input name="inner_three[0][1]"> 
     <a>+</a> 
     </div> 
     <input name="level_two[0]"> 
     <a>+</a> 
    </div> 
    <div class="repeatable"> 
     <div class="repeatable"> 
     <input name="level_three[1][0]"> 
     <input name="inner_three[1][0]"> 
     <a>+</a> 
     </div> 
     <div class="repeatable"> 
     <input name="level_three[1][1]"> 
     <input name="inner_three[1][1]"> 
     <a>+</a> 
     </div> 
     <div class="repeatable"> 
     <input name="level_three[1][2]"> 
     <input name="inner_three[1][2]"> 
     <a>+</a> 
     </div> 
     <input name="level_two[1]"> 
     <a>+</a> 
    </div> 
    <input name="level_one"> 
    <a>+</a> 
    </div> 
</form> 

Мы можем иметь любое количество repeatable с. В этом примере всего 3 уровня. Это может 1, 2, 3, 4 или любое число.

+1

показать свои усилия. – BenG

+0

@BenG, я только подумал об этом и написал его на бумаге без успеха. –

ответ

0
$(function(){ 

    $('form > .repeatable').each(function(l1_Index, l1_elem){ 
     $('> .repeatable', l1_elem).each(function(l2_Index, l2_elem){ 
      $('> .repeatable', l2_elem).each(function(l3_Index, l3_elem){ 
       $('input', l3_elem).each(function(input_Index, input_elem){ 

       var computed = (input_Index === 0 ? 'level_three' : 'inner_three') + 
         '[' + l1_Index + ']' + '[' + l2_Index + ']' ; 

       $(input_elem).attr('name', computed); 

       }); 
      }); 
     }); 
    }); 
}); 

см пример кода здесь https://jsbin.com/colocunoqo/edit?html,js,output

P.S. любой шаблонный Lib как угловые бы сделать это очень легко для вас

EDIT: с рекурсией https://jsbin.com/sisivucaxe/edit?html,js,output

+0

Благодарим за решение. Как я уже сказал в последнем предложении, количество «повторяемых» s неизвестно. Не могли бы вы отредактировать сообщение для неизвестного числа «повторяемых»? Заранее спасибо. –

+0

Помогает ли вам вторая ссылка? – bresleveloper