Многократные итерации переменной javascript с помощью jquery - PullRequest
1 голос
/ 15 апреля 2009

У меня есть форма, и я хотел бы дать пользователям возможность дублировать группу полей столько раз, сколько необходимо. С одной группой он выполняет итерацию правильно, но когда я добавляю вторую группу, переменная «current» выполняет итерацию коллективно, а не является уникальной для каждой группы ... Я попытался изменить все «current» на «newFieldset.current», но это возвращает NAN. .. есть идеи?

<script type="text/javascript">
$(document).ready(function() {
var current = 0;
    //Add New Fieldset with Button
    var newFieldset = {
        init: function(groupIndex) {
            current++;
            $newPerson= $("#Template"+groupIndex).clone(true);
            $newPerson.children("p").children("label").each(function(i) {
                var $currentElem= $(this);
                $currentElem.attr("for",$currentElem.attr("for")+current);
            });
            $newPerson.children("p").children("input").each(function(i) {
                var $currentElem= $(this);
                $currentElem.attr("name",$currentElem.attr("name")+current);
                $currentElem.attr("value",$currentElem.attr("value")+groupIndex+current);
                $currentElem.attr("id",$currentElem.attr("id")+current);
            });

            $newPerson.appendTo("#mainField"+groupIndex);
            $newPerson.removeClass("hideElement");
        },
        currentID: null,
        obj: null
    };
    $(".addButton").each(function() {
        $(this).click(function() {
            var groupIndex = $(this).attr("title");
            //newFieldset.obj = this;
            //var fieldIndex = $(this).attr("class");
            newFieldset.init(groupIndex);
        });
    });

    console.log('r');
});
</script>
<style>
.hideElement {display:none;}
</style>

<form name="demoForm" id="demoForm" method="post" action="#">
<div id="groupCtr1">
    <fieldset id="mainField1">
    <div id="Template1" class="hideElement">
    <p>
        <label for="firstname">Name</label> <em>*</em>
        <input id="firstname" name="firstname" size="25" /> <input id="lastname" name="lastname" size="25" />
    </p>
    <p>
        <label for="email">Email</label> <em>*</em><input id="email" name="email" size="25" />
    </p>
    </div>
    <div>
    <p>
        <label for="firstname1">Name</label> 
        <em>*</em> <input id="firstname1" name="firstname1" size="25" /> <input id="lastname1" name="lastname1" size="25" />
    </p>
    <p>
        <label for="email1">Email</label>  
        <em>*</em><input id="email1" name="email1" size="25" />
    </p>
    </div>
    </fieldset>
    <p>
    <input type="button" class="addButton" title="1" value="Add Another Person">
    </p>
</div>
<div id="groupCtr2">
    <fieldset id="mainField2">
    <div id="Template2" class="hideElement">
        <p>
            <label for="coname">Company Name</label> <em>*</em>
            <input id="coname" name="coname" size="25" />
        </p>
        <p>
            <label for="codesc">Description</label> <em>*</em><input id="codesc" name="codesc" size="25" />
        </p>
    </div>
    <div>
        <p>
            <label for="coname1">Company Name</label> 
            <em>*</em> <input id="coname1" name="coname1" size="25" />
        </p>
        <p>
            <label for="codesc1">Description</label>  
            <em>*</em><input id="codesc1" name="codesc1" size="25" />
        </p>
    </div>
    </fieldset>
    <p>
    <input type="button" class="addButton" title="2" value="Add Another Company">
    </p>
</div>
<input type="submit" value="Save">
</form>

Ответы [ 3 ]

0 голосов
/ 15 апреля 2009

Я бы сделал что-то подобное:

...
var currents = {};
var newFieldset = {
    init: function(groupIndex) {
        var current = 0;
        if (currents[groupIndex]) {
            current = currents[groupIndex];
        }
        ++current;
        currents[groupIndex] = current;
...
0 голосов
/ 15 апреля 2009

Присоедините значение к элементу с помощью метода данных jQuery. Увеличьте его по щелчку, а затем передайте его методу newFieldset.init в качестве второго параметра. Voila!

$(document).ready(function() {
    //Add New Fieldset with Button
    var newFieldset = {
        init: function(groupIndex,current) {
                $newPerson= $("#Template"+groupIndex).clone(true);
                $newPerson.children("p").children("label").each(function(i) {
                        var $currentElem= $(this);
                        $currentElem.attr("for",$currentElem.attr("for")+current);
                });
                $newPerson.children("p").children("input").each(function(i) {
                        var $currentElem= $(this);
                        $currentElem.attr("name",$currentElem.attr("name")+current);
                        $currentElem.attr("value",$currentElem.attr("value")+groupIndex+current);
                        $currentElem.attr("id",$currentElem.attr("id")+current);
                });

                $newPerson.appendTo("#mainField"+groupIndex);
                $newPerson.removeClass("hideElement");
        },
        currentID: null,
        obj: null
    };
    $(".addButton").click(function() {
        var groupIndex = $(this).attr("title");
        var current = $(this).data('current');
        $(this).data('current',++current);
        //newFieldset.obj = this;
        //var fieldIndex = $(this).attr("class");
        newFieldset.init(groupIndex,current);
    }).data('current',0);

    console.log('r');
});

Удачи вам, сэр.

0 голосов
/ 15 апреля 2009

если вы не сделаете текущую переменную глобальной, то будет работать . попробуйте это:

var newFieldset = { 
                  current: 0,
                  init: function() {
                      this.current++; 
                      //rest of init code
                  },
                  //all your other fieldset code here
};
/* all other code */

РЕДАКТИРОВАТЬ: Перечитав вопрос, я бы использовал совершенно другой подход к тому, чего вы пытаетесь достичь. Приведенный выше код будет демонстрировать то же поведение для вас. Если на вопрос не ответили успешно, я сделаю большую запись, когда вернусь домой.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...