循环每个输入的相对记录和更正重复记录

Question

我的表单记录一个JSON数组，包括每个输入的名称和值。我试图根据输入类"optionprix“的相对值为每个输入类"optionname”添加一个"optionprix“属性。

我的html表格：

<div id="sortables-form">
<ul id="sortables"><li>
<input name="checkboxes-label" value="Options" type="text">
<ul id="checkboxes">                         
<li>
<input class="optionname" name="checkbox-2778418" value="Option1" optionprix="5" type="text">
<input class="optionprix" name="checkbox-2778418" value="5" type="text">
</li>
<li>
<input class="optionname" name="checkbox-2778419" value="Option2" optionprix="10" type="text">
<input class="optionprix" name="checkbox-2778419" value="10" type="text">
</li>
<li>
<input class="optionname" name="checkbox-2778420" value="Option3" optionprix="15" type="text">
<input class="optionprix" name="checkbox-2778420" value="15" type="text">
</li>
</ul>
<button class="saveButton" data-type="single-checkbox">Save</button>
</li></ul>
</div>

我的javascript函数：

function update_CF_Data(CF_SortablesForm){
    var mySelector = $("sortables-form");
    var data_array = new Array();
    $("#sortables-form :input").not("#sortables-form :input[class=optionprix]").each(function(){

        var item = {};
        item['name'] = $(this).attr('name');
        item['value'] = $(this).attr('value');

        var optionPrix = $("#sortables-form li input[class=optionprix]").val();

        if ($(this).hasClass('optionname')){
        item['optionprix'] = optionPrix;
        }

        data_array.push(item);

    });
    var sortableContent = JSON.stringify(data_array);
    $('#myparentform').val(sortableContent);

    console.log(data_array);
};

JSON记录：

array(6) { [0]=> array(2) { ["name"]=> string(18) "required---2778418" ["value"]=> string(2) "on" } [1]=> array(2) { ["name"]=> string(26) "checkboxes-label" ["value"]=> string(7) "Options" } [2]=> array(3) { ["name"]=> string(25) "checkbox-2778418" ["value"]=> string(7) "Option1" ["optionprix"]=> string(1) "5" } [3]=> array(3) { ["name"]=> string(25) "checkbox-2778419" ["value"]=> string(7) "Option2" ["optionprix"]=> string(1) "5" } [4]=> array(3) { ["name"]=> string(25) "checkbox-2778420" ["value"]=> string(7) "Option3" ["optionprix"]=> string(1) "5" } [5]=> array(0) { } } 

实际上，所有记录的数据都使用我输入的class="optionprix“的第一条记录，并打印5作为值。

我试图改变我的javascript代码以达到我的目标，但没有成功.

也许我是与排除部分.not有关的(“#sortables form :inputclass=optionprix")

Answer 1

您每次都得到相同的值，因为在获取相应的$(this)文本框(该迭代的值)时，您没有使用optionprix。可以在siblings()中使用JQuery方法访问相邻元素的值。

兄弟姐妹()

尝尝这个,

function update_CF_Data(CF_SortablesForm){
    var mySelector = $("sortables-form");
    var data_array = new Array();
    $("#sortables-form :input").not("#sortables-form :input[class=optionprix]").each(function(){

        var item = {};
        item['name'] = $(this).attr('name');
        item['value'] = $(this).attr('value');

        //var optionPrix = $("#sortables-form li input[class=optionprix]").val();
        var optionPrix = $(this).siblings("input.optionprix").val();

        if ($(this).hasClass('optionname')){
        item['optionprix'] = optionPrix;
        }

        data_array.push(item);

    });
    var sortableContent = JSON.stringify(data_array);
    $('#myparentform').val(sortableContent);

    console.log(data_array);
};