Обновление нескольких переключателей на основе опции выбора

Question

Я пытаюсь обновить серию переключателей в новой настраиваемой форме sharepoint 2013 на основе опции выбора. Мой код до сих пор:

function setTierDestinations(destination) { 
    var radios = $("#DeltaPlaceHolderMain").find("span[title='" + destination + "']:first-child"); 
    console.log(radios); 
    $.each(radios, function(i, value) { 
     $(value).prop("checked",true); 
    }); 
} 

document.getElementByID(ctl00_ctl43_g_f596e023_21bc_42e0_b68b_c8a7b74467a3_ff151_ctl00_DropDownChoice).onchange = function() { 
    var destination = document.getElementByID(ctl00_ctl43_g_f596e023_21bc_42e0_b68b_c8a7b74467a3_ff151_ctl00_DropDownChoice).value; 
    setTierDestinations(destination); 
}; 

<select name="ctl00$ctl43$g_f596e023_21bc_42e0_b68b_c8a7b74467a3$ff151$ctl00$DropDownChoice" id="ctl00_ctl43_g_f596e023_21bc_42e0_b68b_c8a7b74467a3_ff151_ctl00_DropDownChoice" title="Destination" class="ms-RadioText"> 
    <option selected="selected" value=""></option> 
    <option value="Store">Store</option> 
    <option value="Shed">Shed</option> 
</select> 

<span id="radioA"><span dir="none"> 
    <table cellpadding="0" cellspacing="1"> 
     <tr> 
      <td> 
       <span class="ms-RadioText" title="Store"> 
        <input id="ctl00_ctl43_g_f596e023_21bc_42e0_b68b_c8a7b74467a3_ff271_ctl00_ctl00" type="radio" name="ctl00$ctl43$g_f596e023_21bc_42e0_b68b_c8a7b74467a3$ff271$ctl00$RadioButtons" value="ctl00" checked="checked" /><label for="ctl00_ctl43_g_f596e023_21bc_42e0_b68b_c8a7b74467a3_ff271_ctl00_ctl00">Store</label> 
       </span> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <span class="ms-RadioText" title="Shed"> 
        <input id="ctl00_ctl43_g_f596e023_21bc_42e0_b68b_c8a7b74467a3_ff271_ctl00_ctl01" type="radio" name="ctl00$ctl43$g_f596e023_21bc_42e0_b68b_c8a7b74467a3$ff271$ctl00$RadioButtons" value="ctl01" /><label for="ctl00_ctl43_g_f596e023_21bc_42e0_b68b_c8a7b74467a3_ff271_ctl00_ctl01">Shed</label> 
       </span> 
      </td> 
     </tr> 
    </table> 
</span></span> 

Все содержание в #radioA получает дублируется несколько раз #radioB, #radioC и т.д.

Я думаю, что я не выбирая радио Var правильно. В консоли я получаю массив из нескольких «span.ms-RadioText», где я должен получать входные данные. Правильное ли использование первого ребенка?

Answer 1

Ваше использование первого ребенка не выбирает детей вашего целевого элемента. Вы хотите .children() Это должно работать var radios = $ ("# DeltaPlaceHolderMain"). Find ("span [title = '" + destination + "']"). Children() [0];

Который выберет первый ребенок пролета.

Селектор first-child не выбирает первый дочерний элемент, а элемент, который соответствует селектору, который является первым дочерним элементом родителя. http://www.w3.org/wiki/CSS/Selectors/pseudo-classes/:first-child

Чтобы подтвердить и уточнить, что сказал Захария, getElementByID написано неправильно. Он должен быть document.getElementById Обратите внимание на строчку d.

Ваш идентификатор должен быть в кавычках, так как это строка, а не переменная. Итак, document.getElementById('ctl00_ctl43_g_f596e023_21bc_42e0_b68b_c8a7b74467a3_ff151_ctl00_DropDownChoice').onchange и т. Д.