Unable to change my item id

I try to change the identifier of my elements when I clone an element, basically I keep a counter that I increment and add it at the end of the identifier every time it is cloned. It seems simple enough.

var addAnswerFlag = true;
function addAnswer(button)
{
    //flag to keep clicks from chaining
    if(addAnswerFlag)
    {
        addAnswerFlag = false;
        $('#answer_warning').fadeOut(600);
        $('.template').clone().attr('id','').insertAfter($('.template')).fadeIn(300, function() {

            $(this).removeClass('template'); 
            addAnswerFlag = true;

            $('.answer_li:not(.template)').each(function(index){
                ++index;

                $(this).children('.answer').each(function(){
                    $(this).attr('id', $(this).attr('id').replace("__", "_"+index+"_")).attr('name',$(this).attr('name').replace("__", "_"+index+"_"));         
                });

            });

        });

    }
}

Sorry if my code is a bit unclear.

Basically, my first loop goes through all my list items (except the dummy data template) and takes each “.answer” and replaces the double underscore “__” with “i”, where I am the counter.

For some reason, dang I am always 1. I know the increment values ​​for each element of the list, because if I warn its value before and after trying to reassign the id, the value increases, but in the actual destination it is always 1.

. :)

Edit:

HTML. , :

<ul id="answers">
    <li style="" class="answer_li template">
        <input id="question__en" name="question_[en]" class="answer" value="" type="text">
        <input id="question__fr" name="question_[fr]" class="answer" value="" type="text">              
    </li>
    <li id="" style="display: list-item;" class="answer_li">
        <input id="question_1_en" name="question_[en]" class="answer" value="" type="text">
        <input id="question_1_fr" name="question_[fr]" class="answer" value="" type="text">             
    </li>
</ul>

, - , - , . , , . , , , , , javascript, , - , :)

javascript, , ( ).

+3
1

( ), . , index , .

$('.answer_li:not(.template)').each( function(index){
    ++index; // to get one-based values
    $(this).children('.answer').each( function(){
        $(this).attr('id', $(this).attr('id').replace("__", "_"+index+"_")).attr('name',$(this).attr('name').replace("__", "_"+index+"_"));         
    });
});
+3

Source: https://habr.com/ru/post/1752347/


All Articles