簡體   English   中英

如何在chckebox循環中遍歷一組對象並替換一個對象:檢查每個函數-jQuery

[英]How to iterate through an array of objects and replace one object while in the loop of chckebox : checked each function - jquery

在jquery中單擊一個按鈕,我循環遍歷所有已選中/選中其復選框的行,同時,我必須創建一個選定或修改對象的數組。

不能將數組重置為,如果一個Company第一次出現而第二次沒有出現,因為未檢查該行,我必須保留以前的值

看看這個小提琴

https://jsfiddle.net/shaswatatripathy/y7jqb5hp/1/

因此,假設您首先選擇了兩行,然后在文本框中添加了一些文本,則對象數組將具有兩個具有該屬性的對象,但是第二次他從那兩行中選擇了一行,然后取消選擇另一行並給出了其他值文本框,我們必須使用具有該值的公司名稱更新對象

的HTML

 <table>
      <tr>
      <th>checkbox</th>
        <th>Company</th>
        <th>Contact</th>
        <th>Country</th>
      </tr>
      <tr>
      <td><input name="eachRow" type="checkbox"/> </td>
        <td>Alfreds </td>
        <td>Maria </td>
        <td>Germany</td>
      </tr>
      <tr>
       <td><input name="eachRow" type="checkbox"/> </td>
        <td>Centro </td>
        <td>Francisco </td>
        <td>Mexico</td>
      </tr>
      <tr>
       <td><input name="eachRow" type="checkbox"/> </td>
        <td>Ernst </td>
        <td>Roland </td>
        <td>Austria</td>
      </tr>
      <tr>
       <td><input name="eachRow" type="checkbox"/> </td>
        <td>Island </td>
        <td>Helen </td>
        <td>UK</td>
      </tr>
      <tr>
       <td><input name="eachRow" type="checkbox"/> </td>
        <td>Laughing  </td>
        <td>Yoshi </td>
        <td>Canada</td>
      </tr>
      <tr>
       <td><input name="eachRow" type="checkbox"/> </td>
        <td>Magazzini </td>
        <td>Giovanni </td>
        <td>Italy</td>
      </tr>
    </table>

    <input type="button" onclick="getdetails()" value="click me"/><br>
     <input type="text" id="txtBox" name="name"><br>

jQuery的

var selectedRows=[];

function getdetails() {
var modifier = $('#txtBox').val();
        $.each($("input[name='eachRow']:checked").parents("tr"), function () {


        selectedRows.push ({
          company : $(this).find('td:eq(1)').text(),
          contact: modifier


        })

        console.log(selectedRows);

        });


        }

的CSS

table {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

td, th {
    border: 1px solid #dddddd;
    text-align: left;
    padding: 8px;
}

tr:nth-child(even) {
    background-color: #dddddd;
}

下面的代碼可以解決問題。

var selectedRowsArray= [];


$.each($("input[name='eachCheckbox']:checked").parents("tr"), function () {


ID= $(this).find('td:eq(1)').text(); 
var found = selectedRowsArray.filter(function (el) {
    return el.ID === ID;
});
if (found.length === 0) {
    selectedRowsArray.push({                   
        ID: ID,
        Col2value : $(this).find('td:eq(2)').text(),
        Col3value : //somevalue manupulated,
        Col4value : //somevalue manupulated
    });
} else {
    // Do the updating here with the object `found`
}

});

鏈接到解決方案https://jsfiddle.net/y7jqb5hp/3/

您可以使用filter函數來獲取ID為selectedRowsArray的數組中的對象

嘗試這個

var objs = selectedRowsArray.filter(function(row){return row.ID == ID;});

返回的objs是在您的數組中ID為ID的對象數組。

現在,您可以通過迭代objs和upadate對象的屬性。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM