在Telerik的radgrid控件的FormTemplate

這個問題類似於this question選擇在asp.net CheckBoxList的所有項目，位最大的區別是，CheckBoxList是一個Telerk的RadGrid的FormTemplate。在Telerik的radgrid控件的FormTemplate

我試過這個方法，但他們不工作：

Check/Uncheck all Items in an ASP.NET CheckBox List using jQuery

Java Script for checkbox list in grid's editformsettings

這裏是我的代碼：

<telerik:RadGrid ID="RadGrid1" runat="server" ... > 
    ... 
    <MasterTableView ...> 
     ... 
     <EditFormSettings EditFormType="Template"> 
     <EditColumn UniqueName="EditCommandColumn1"></EditColumn> 
     <FormTemplate> 
      <table class="edit-table-rad" cellspacing="2" cellpadding="1" width="100%" border="0"> 
       ... 
       <tr> 
        <td align="left" width="200px"> 
        <b>Languages:</b><br /> 
        <asp:CheckBox ID="chbSelectAllLanguage" runat="server" 
            Text="Select All" 
            ClientIDMode="Static"/> 
        </td> 
        <td> 
        <asp:CheckBoxList ID="cblLanguage" runat="server" 
             DataSourceID="entityDataSourceLanguage" 
             DataTextField="LanguageName" 
             DataValueField="LanguageID" 
             RepeatColumns="4"> 
        </asp:CheckBoxList> 
        </td> 
       </tr> 
       ... 
      </table> 
     </FormTemplate> 
     </EditFormSettings> 
    </MasterTableView> 
</telerik:RadGrid>

以上使用jQuery的例子，以獲得CheckBox並添加一個click函數。但我無法獲得CheckBox。我試圖通過ID和cssclass來獲取它，但我認爲RadGrid的FormTemplate中的CheckBox不在document.ready時間的DOM中。

有沒有辦法通過選擇/取消選擇單個CheckBox選擇/取消選擇所有CheckBoxList項目？

編輯點評

前後我打開編輯表單我找不到FormTemplate的HTML。當窗體打開時，HTML是這樣的：

<tr> 
<td width="200px" align="left"> 
    <b>Languages:</b> 
    <br> 
    <span class="chbSelectAllLanguage"> 
     <input id="chbSelectAllLanguage" type="checkbox" name="ctl00$MainContent$rgSurvey$ctl00$ctl02$ctl04$chbSelectAllLanguage"> 
     <label for="chbSelectAllLanguage">Select All</label> 
    </span> 
</td> 
<td> 
    <table id="ctl00_MainContent_rgSurvey_ctl00_ctl02_ctl04_cblLanguage" class="kipCheckBoxList"> 
     <tbody> 
      <tr> 
       //the CheckBoxList generated data, like this: 
       <td> 
        <input id="ctl00_MainContent_rgSurvey_ctl00_ctl02_ctl04_cblLanguage_0" type="checkbox" value="1" name="ctl00$MainContent$rgSurvey$ctl00$ctl02$ctl04$cblLanguage$0"> 
        <label for="ctl00_MainContent_rgSurvey_ctl00_ctl02_ctl04_cblLanguage_0">English</label> 
       </td> 
       ... 
      </tr> 
      ... 
     </tbody> 
    </table> 
</td>

來源

2011-12-02 Mentoliptus

上面產生的代碼肯定會在文檔加載時準備就緒，所以這不是問題。您可以發佈這個HTML生成，因爲它更容易看到什麼jQuery代碼將需要。 –

我找到了答案！訣竅是把<script>標籤的<telerik:RadCodeBlock ID="RadCodeBlock" runat="server">標籤裏面，然後將此代碼添加到ItemDataBound事件OD的RadGrid：

if (e.Item is GridEditableItem && e.Item.IsInEditMode) 
{ 
    GridEditableItem geiItem = e.Item as GridEditableItem; 
    CheckBox chbSelectAllLanguage = geiItem.FindControl("chbSelectAllLanguage") as CheckBox; 
    CheckBoxList cblLanguage = geiItem.FindControl("cblLanguage") as CheckBoxList; 
    chbSelectAllLanguage.Attributes.Add("onclick", "javascript:SelectDeselect('" + chbSelectAllLanguage.ClientID + "','" + cblLanguage.ClientID + "')"); 
}

那麼對於選擇/取消選擇的功能是這樣的：

<telerik:RadCodeBlock ID="RadCodeBlock" runat="server"> 
    <script type="text/javascript"> 
     function SelectDeselect(chk, chklst) { 
     var isChecked = $('#' + chk).is(':checked'); 
     $("[id^=" + chklst + "]").each(function() { 
      $(this).attr("checked", isChecked); 
     }); 
     } 
    </script> 
</telerik:RadCodeBlock>

來源

2011-12-19 14:44:06 Mentoliptus

在Telerik的radgrid控件的FormTemplate

回答

相關問題