如何使用jquery在radcombobox中禁用/啓用多個複選框？

我有一個ItemTemplate，其中每個項目包含一個啓用了複選框的RadComboBox。我需要應用一些業務邏輯，根據用戶的選擇禁用或啓用組合框中的複選框。我需要知道的是如何禁用這些複選框。例如：如何使用jquery在radcombobox中禁用/啓用多個複選框？

<Combobox CssClass="Assignees"> 
    <cb> <Item 1> 
    <cb> <Item 2> 
    <cb> <Item 3> 
    <cb> <Item 4>

如果選中第4項的複選框，則所有其他複選框都將被禁用。如果未選中，則所有內容都將重新啓用。如果選擇項目1,2或3，則項目4的複選框被禁用。

我已經試過類似：

$(".AssigneeTag").find(":checkbox").click(
    function() { 
     var allCheckboxes = $(this).closest(".AssigneeTag").find(":checkbox"); 
    });

只是爲了讓所有在下拉列表中的複選框。這不會返回任何東西。然後我知道我需要從這裏開始檢查項目數據以確定「類型」，以便我可以找出要隱藏或顯示的內容。

任何人都可以指向正確的方向嗎？編輯：根據要求，HTML。我能夠從中挖掘出它。只是看着它，我無法將自己的頭圍繞在做什麼。加載到項目列表中的項目實際上是包含3個字段的對象;一個名字，一個guid和一個類型。我需要看看應用的業務邏輯的類型，但我沒有看到它甚至出現在這裏：

<div id="ctl00_MainContent_lsvTickets_ctrl0_lsvActions_cboAssignTo" class="RadComboBox RadComboBox_Default AssigneeTag" ItemDataBound="Assignees_Bound" style="width:160px;"> 
    <table summary="combobox" style="border-width:0;border-collapse:collapse;table-layout:fixed;width:100%"> 
     <tr class="rcbReadOnly"> 
      <td style="margin-top:-1px;margin-bottom:-1px;width:100%;" class="rcbInputCell rcbInputCellLeft"> 
       <input name="ctl00$MainContent$lsvTickets$ctrl0$lsvActions$cboAssignTo" type="text" class="rcbInput" id="ctl00_MainContent_lsvTickets_ctrl0_lsvActions_cboAssignTo_Input" value="" style="display: block;" readonly="readonly" /> 
      </td> 
      <td style="margin-top:-1px;margin-bottom:-1px;" class="rcbArrowCell rcbArrowCellRight">< 
       a id="ctl00_MainContent_lsvTickets_ctrl0_lsvActions_cboAssignTo_Arrow" style="overflow: hidden;display: block;position: relative;outline: none;">select</a> 
      </td> 
     </tr> 
    </table> 

    <div class="rcbSlide" style="z-index:6000;"> 
     <div id="ctl00_MainContent_lsvTickets_ctrl0_lsvActions_cboAssignTo_DropDown" class="RadComboBoxDropDown RadComboBoxDropDown_Default " style="float:left;display:none;"> 
      <div class="rcbScroll rcbWidth" style="width:100%;"> 
       <ul class="rcbList" style="list-style:none;margin:0;padding:0;zoom:1;"> 
        <li class="rcbItem "><input type="checkbox" class="rcbCheckBox" />Mike ITTest</li> 
        <li class="rcbItem "><input type="checkbox" class="rcbCheckBox" />Jeremy Stafford</li> 
        <li class="rcbItem "><input type="checkbox" class="rcbCheckBox" />John Bell Test (Info. Tech.)</li> 
        <li class="rcbItem "><input type="checkbox" class="rcbCheckBox" />Mike ITTest (Info. Tech.)</li> 
        <li class="rcbItem "><input type="checkbox" class="rcbCheckBox" />AG Cust Support</li> 
        <li class="rcbItem "><input type="checkbox" class="rcbCheckBox" />AG Eng Support</li> 
        <li class="rcbItem "><input type="checkbox" class="rcbCheckBox" />AG HR Support</li> 
        <li class="rcbItem "><input type="checkbox" class="rcbCheckBox" />AG IT Support</li> 
       </ul> 
      </div> 
     </div> 
    </div> 
    <input id="ctl00_MainContent_lsvTickets_ctrl0_lsvActions_cboAssignTo_ClientState" name="ctl00_MainContent_lsvTickets_ctrl0_lsvActions_cboAssignTo_ClientState" type="hidden" /> 
</div>

來源

2012-03-23 Sinaesthetic

既然你停留在Telerik控制泥濘的抽象，後退一步，看看客戶端的HTML輸出。向我們展示HTML，因爲您的jQuery需要使用它。 – 2012-03-23 20:44:24

好了，開始用，有你的HTML語法錯誤難道不工作直到我修好它爲止。

在這裏看到：（誤差在返回字符後「<」的標籤之前的「a」）

<td style="margin-top:-1px;margin-bottom:-1px;" class="rcbArrowCell rcbArrowCellRight">< 
    a id="ctl00_MainContent_lsvTickets_ctrl0_lsvActions_cboAssignTo_Arrow" style="overflow: hidden;display: block;position: relative;outline: none;">select</a> 
</td> // also see no reason for display block on "a" as it will cause it to have 0 width and be invisible (more or less)

變化太大

<td style="margin-top:-1px;margin-bottom:-1px;" class="rcbArrowCell rcbArrowCellRight"> 
    <a id="ctl00_MainContent_lsvTickets_ctrl0_lsvActions_cboAssignTo_Arrow" style="overflow: hidden;position: relative;outline: none;">select</a> 
</td>

接下來，複選框問題，我不確定你想要哪個確切的東西被選中和取消選中，所以我添加了一個標記爲「全部選中」的複選框，您可以單擊以選中所有選項，或者如果取消選中某個名稱，則選中所有選項都不選中，因爲我們二。 See the working jsFiddle HERE，看看下面的jQuery代碼：

$(function() { 
    $("#rcbCheckAll").on("change", function(e) { 
     $(".rcbCheckBox").prop("checked", $(this).prop("checked")); 
    }); 
    $(".rcbCheckBox").on("change", function(e) { 
     if (!$(this).is("checked")) $("#rcbCheckAll").prop("checked", false); 
    }); 
})

來源

2012-03-24 02:04:03 SpYk3HH

如何使用jquery在radcombobox中禁用/啓用多個複選框？

回答

相關問題