jQuery動態選擇複選框組onChange

我有一組動態的行，每個行中都有一個下拉框和複選框，並且如果選擇某個選項值，需要選擇onChange上的所有複選框。jQuery動態選擇複選框組onChange

這對一個組很好，但是當有多行並且從一行中選擇選項值時，onChange會觸發從所有行中選擇所有複選框而不是特定行。

我設置了一個小提琴來澄清我的意思 - 非常確定我需要以某種方式獲得一個計數器的行並通過onChange中的計數器號碼，因此它不會選中所有複選框，並且只會更改下拉列是英寸

<table> 
<tr> 
    <td> 
     <!--First row eventRegistrations[1]--> 
     <select name="eventRegistrations[1].eventRegistrationStatusTypeID" id="registrationStatusSelect"> 
      <option value="1">Pending</option> 
      <option value="2">Attended</option> 
     </select> 
    </td> 
    <td> 
     <input type="checkbox" name="eventRegistrations[1].markAttendance[1].attendanceDate" value="1">9/21/14 
     <input type="checkbox" name="eventRegistrations[1].markAttendance[2].attendanceDate" value="2">9/22/14</td> 
</tr> 
<!--There could be multiple dynamic rows whose input names increment like eventRegistrations[i]--> 
<tr> 
    <td> 
     <!--Next dynamic row eventRegistrations[2]--> 
     <select name="eventRegistrations[2].eventRegistrationStatusTypeID" id="registrationStatusSelect"> 
      <option value="1">Pending</option> 
      <option value="2">Attended</option> 
     </select> 
    </td> 
    <td> 
     <input type="checkbox" name="eventRegistrations[2].markAttendance[1].attendanceDate" value="1">10/23/14 
     <input type="checkbox" name="eventRegistrations[2].markAttendance[2].attendanceDate" value="2">10/24/14</td> 
</tr>

工作正常的第一下拉改爲「出席」如果我在eventRegistrations硬編碼1 [1]。我認爲需要一個計數器以獲得每一行以某種方式，環或做一個各（）和在couner數通過基於該下拉選擇是eventRegistrations基於[I]在其上選擇

$("select[name^='eventRegistrations[1]']").change(function() { 
if ($(this).val() === '2') { 
    $("input[name^='eventRegistrations[1]']").prop('checked', true); 

    /* 
    var regCount = $(":input[name^='eventRegistrations[i]']").length 
    for (i = 1; i <= regCount; i++) { 
     $("input[name^='eventRegistrations[i]']").prop('checked', true); 
    }*/ 
} 
});

感謝幫助！

來源

2014-10-29 Jibes

你需要保持這樣的名字呢？方括號中的名字是很少見的 – 2014-10-29 18:04:49

@ k-nut是的，如果可能的話，我需要將它們的名字保留在標記中。謝謝！！ – Jibes 2014-10-29 18:05:42

好吧，我會盡快給你解決方案 – 2014-10-29 18:07:58

您可以將更改功能綁定到所有選擇。然後，您可以檢查使用哪一個，並獲取與複選框開頭相同的起始字符串。就像這樣：

$("select").change(function() { 
    if ($(this).val() === '2') { 
     var start = $(this).attr("name").split(".")[0]; 
     $("input[name^='" + start + ".markAttendance']").prop('checked', true); 
    } 
});

http://jsfiddle.net/7brzct64/2/

來源

2014-10-29 18:22:03

這個作品完美！ @ k-nut我怎麼能做到相反如果選擇了所有日期，請將下拉值更改爲「參加」？ – Jibes 2014-10-29 18:41:59

你會綁定輸入變化監視，然後遍歷所有選擇開始相同的字符串（類似於其他方式），然後獲得相應的下拉列表（也通過名稱），並更改其值 – 2014-10-29 18:55:24

@Jibes：你可以標記如果它符合你的需求，那麼它是否正確？ – 2014-10-29 19:12:50

jQuery動態選擇複選框組onChange

回答

相關問題