搜索
搜索

如何在剑道网格中获取复选框的值

loremIpsum1771 发表于 Dev
75
loremIpsum1771

我有一个kendo网格，其中包含两种类型的行：一种是CSS类k-master-row，它最初在网格加载时出现，另一种是CSS类k-detail-row k-alt，当单击下拉列表时出现，本质上是每个主行的详细信息。每个主行都有一个复选框，需要获取该值：

<td class="" role="gridcell"><input id="TOC_ckbx" name="TOC_ckbx" type="checkbox" value="15" checked="checked" class="chkbx"></td>

最初，我是在更改事件上获得复选框的值，如下所示：

$("#sectionGrid .k-grid-content").on("change", "input.chkbx", function (e) {
            var dataItem = $grid.dataItem($(e.target).closest("tr"));            
            dataItem.set("TocShow", this.checked);
});

该代码有效，但是因为它检查了所有子元素中的所有输入复选框，所以它还跟踪了其下面的详细信息网格中两个复选框的更改：

<tr data-uid="34d19927-c356-4d6d-9e00-5b470fe369eb" role="row">
<td role="gridcell"><input class="k-checkbox" data-role="checkbox" id="0b1e4591-88c0-4796-aa62-1c9482005be1" aria-label="Select row" aria-checked="false" type="checkbox"><label for="0b1e4591-88c0-4796-aa62-1c9482005be1" class="k-checkbox-label k-no-text">​</label></td>
<td class="" role="gridcell"><input id="FirstRun" name="FirstRun" class="chkbx" type="checkbox" checked=""></td>
<td class="" role="gridcell"><input id="SecondRun" name="SecondRun" type="checkbox" checked="" class="chkbx"></td>
</tr>

然后，我尝试使用以下命令通过id获取主行中的每个#TOC_ckbx复选框，但是由于某些原因，仅跟踪对第一行中的复选框所做的更改，而未跟踪其他行中的任何复选框：

 $("#TOC_ckbx.chkbx").change(function (e) {
            var dataItem = $grid.dataItem($(e.target).closest("tr"));
            dataItem.set("TocShow", this.checked);
        });

为了获得change事件上所有TOC复选框的值，使用什么正确的Jquery选择器？

以下是html的摘要（为简洁起见，删除了一些列）：

<tbody>
<tr class="k-master-row" data-uid="c5aa3ba6-ecd6-47f3-aeb5-7e5c1111028e" role="row">
    <td class="k-hierarchy-cell" aria-expanded="false"><a class="k-icon k-i-expand" href="#" aria-label="Expand" tabindex="-1"></a></td>
    <td role="gridcell"><input class="k-checkbox" data-role="checkbox" id="01d0ab93-c661-439b-abee-01f9ce34b1b6" aria-label="Select row" aria-checked="false" type="checkbox"><label for="01d0ab93-c661-439b-abee-01f9ce34b1b6" class="k-checkbox-label k-no-text">​</label></td>
    <td style="display:none" class="" role="gridcell">15</td>
    <td style="display:none" class="" role="gridcell">4</td>
    <td class="" role="gridcell">3. Portfolio Characteristics and Investment Results</td>
    <td style="display:none" class="" role="gridcell"></td>
    <td class="" role="gridcell"><input id="TOC_ckbx" name="TOC_ckbx" type="checkbox" value="15" checked="checked" class="chkbx"></td>
    <td style="display:none" class="" role="gridcell">01/01/1900</td>
    <td style="display:none" class="" role="gridcell"></td>
    <td class="" role="gridcell"><span class="sortSpan"> 3 </span></td>
    <td class="" role="gridcell"></td>
    <td class="" role="gridcell"></td>
    <td class="" role="gridcell"></td>
    <td class="" role="gridcell"></td>
 </tr>


<tr class="k-detail-row k-alt">
    <td class="k-hierarchy-cell"></td>
    <td class="k-detail-cell" colspan="8">
    <div class="k-widget k-grid detail-grid k-display-block k-editable" id="grid_14" data-role="grid" style="height: 379px;">
        <div class="k-header k-grid-toolbar k-grid-top"><a class="k-button k-button-icontext k-grid-add" href="/Document/SectionPage?sectionID=%23%3DSectionID%23&amp;documentID=4&amp;_=1544475674808&amp;grid_%23%3DSectionID%23-mode=insert"><span class="k-icon k-i-add"></span>Add Page</a><a class="k-button k-button-icontext k-grid-save-changes" href="javascript:void(0)"><span class="k-icon k-i-check"></span>Save Pages</a><a class="k-button k-button-icontext k-grid-cancel-changes" href="javascript:void(0)"><span class="k-icon k-i-cancel"></span>Cancel changes</a></div>
        <div class="k-grid-header" style="padding-right: 17px;">
            <div class="k-grid-header-wrap k-auto-scrollable">
                <table role="grid">
                <colgroup>
                    <col style="width:60px">
                    <col style="width:225px">
                    <col style="width:300px">
                    <col style="width:120px">
                    <col>
                    <col>
                    <col>
                    <col>
                    <col>
                    <col style="width:110px">
                    <col style="width:110px">
                </colgroup>
                <thead role="rowgroup">
                    <tr role="row">
                        <th class="k-header" scope="col" data-index="0"><span class="k-link">Delete</span></th>
                        <th class="k-header" data-field="SectionPageID" data-index="1" data-title="Section Page ID" scope="col" style="display:none" data-role="columnsorter"><a class="k-link" href="/Document/SectionPage?sectionID=%23%3DSectionID%23&amp;documentID=4&amp;_=1544475674808&amp;grid_%23%3DSectionID%23-sort=SectionPageID-asc">Section Page ID</a></th>
                        <th class="k-header" data-field="SectionID" data-index="2" data-title="Section ID" scope="col" style="display:none" data-role="columnsorter"><a class="k-link" href="/Document/SectionPage?sectionID=%23%3DSectionID%23&amp;documentID=4&amp;_=1544475674808&amp;grid_%23%3DSectionID%23-sort=SectionID-asc">Section ID</a></th>
                        <th class="k-header" data-field="PageID" data-index="3" data-title="Page ID" scope="col" style="display:none" data-role="columnsorter"><a class="k-link" href="/Document/SectionPage?sectionID=%23%3DSectionID%23&amp;documentID=4&amp;_=1544475674808&amp;grid_%23%3DSectionID%23-sort=PageID-asc">Page ID</a></th>
                        <th class="k-header" data-field="PageCD" data-index="4" data-title="Page" scope="col" data-role="columnsorter"><a class="k-link" href="/Document/SectionPage?sectionID=%23%3DSectionID%23&amp;documentID=4&amp;_=1544475674808&amp;grid_%23%3DSectionID%23-sort=PageCD-asc">Page</a></th>
                        <th class="k-header" data-field="PageTitle" data-index="5" data-title="Page Title" scope="col" style="display:none" data-role="columnsorter"><a class="k-link" href="/Document/SectionPage?sectionID=%23%3DSectionID%23&amp;documentID=4&amp;_=1544475674808&amp;grid_%23%3DSectionID%23-sort=PageTitle-asc">Page Title</a></th>
                        <th class="k-header" data-field="PageTitleOverride" data-index="6" data-title="Page Title Override" scope="col" data-role="columnsorter"><a class="k-link" href="/Document/SectionPage?sectionID=%23%3DSectionID%23&amp;documentID=4&amp;_=1544475674808&amp;grid_%23%3DSectionID%23-sort=PageTitleOverride-asc">Page Title Override</a></th>
                    </tr>
                </thead>
                </table>
            </div>
        </div>
        <div class="k-grid-content" style="height: 307px;">
            <table role="grid" data-role="sortable">

                <tbody role="rowgroup">
                <tr data-uid="34d19927-c356-4d6d-9e00-5b470fe369eb" role="row">
                    <td role="gridcell"><input class="k-checkbox" data-role="checkbox" id="0b1e4591-88c0-4796-aa62-1c9482005be1" aria-label="Select row" aria-checked="false" type="checkbox"><label for="0b1e4591-88c0-4796-aa62-1c9482005be1" class="k-checkbox-label k-no-text">​</label></td>
                    <td class="" role="gridcell"><input id="FirstRun" name="FirstRun" class="chkbx" type="checkbox" checked=""></td>
                    <td class="" role="gridcell"><input id="SecondRun" name="SecondRun" type="checkbox" checked="" class="chkbx"></td>
                </tr>

                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <script>
        kendo.syncReady(function(){jQuery("#grid_14").kendoGrid({"dataBound":detailGrid_onDataBound,"saveChanges":detailGrid_onSaveChanges,"edit":detailGrid_onEdit,"columns":[{"width":"60px","selectable":true},{"title":"Section Page ID","headerAttributes":{"data-field":"SectionPageID","data-title":"Section Page ID"},"hidden":true,"field":"SectionPageID","encoded":true,"editor":"<input class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field SectionPageID must be a number.\" id=\"SectionPageID\" name=\"SectionPageID\" type=\"number\" value=\"\" /><span class=\"field-validation-valid\" data-valmsg-for=\"SectionPageID\" data-valmsg-replace=\"true\"></span>"},{"title":"Section ID","headerAttributes":{"data-field":"SectionID","data-title":"Section ID"},"hidden":true,"field":"SectionID","encoded":true,"editor":"<input class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field SectionID must be a number.\" id=\"SectionID\" name=\"SectionID\" type=\"number\" value=\"\" /><span class=\"field-validation-valid\" data-valmsg-for=\"SectionID\" data-valmsg-replace=\"true\"></span>"},{"title":"Page ID","headerAttributes":{"data-field":"PageID","data-title":"Page ID"},"hidden":true,"field":"PageID","encoded":true,"editor":"<input class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field PageID must be a number.\" id=\"PageID\" name=\"PageID\" type=\"number\" value=\"\" /><span class=\"field-validation-valid\" data-valmsg-for=\"PageID\" data-valmsg-replace=\"true\"></span>"},{"title":"Page","headerAttributes":{"data-field":"PageCD","data-title":"Page"},"width":"225px","field":"PageCD","encoded":true,"editor":"<input id=\"PageCD\" name=\"PageCD\" type=\"text\" /><script>  kendo.syncReady(function(){jQuery(\"#PageCD\").kendoDropDownList({\"dataSource\":{\"transport\":{\"read\":{\"url\":\"/Document/GetDropDownListItems?parentKey=Page_CD\u0026fieldText=Lookup\u0026fieldValue=LookupValue\u0026isSP=False\u0026includeValue=%20\"},\"prefix\":\"\"},\"schema\":{\"errors\":\"Errors\"}},\"dataTextField\":\"Text\",\"dataValueField\":\"Text\"});});<\/script><span class=\"field-validation-valid\" data-valmsg-for=\"PageCD\" data-valmsg-replace=\"true\"></span>"},{"title":"Page Title","headerAttributes":{"data-field":"PageTitle","data-title":"Page Title"},"hidden":true,"field":"PageTitle","encoded":true},{"title":"Page Title Override","headerAttributes":{"data-field":"PageTitleOverride","data-title":"Page Title Override"},"width":"300px","field":"PageTitleOverride","encoded":true,"editor":"<input class=\"text-box single-line\" id=\"PageTitleOverride\" name=\"PageTitleOverride\" type=\"text\" value=\"\" /><span class=\"field-validation-valid\" data-valmsg-for=\"PageTitleOverride\" data-valmsg-replace=\"true\"></span>"},{"title":"Account ID","headerAttributes":{"data-field":"AccountID","data-title":"Account ID"},"hidden":true,"field":"AccountID","encoded":true,"editor":"<input class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field AccountID must be a number.\" id=\"AccountID\" name=\"AccountID\" type=\"number\" value=\"\" /><span class=\"field-validation-valid\" data-valmsg-for=\"AccountID\" data-valmsg-replace=\"true\"></span>"},{"title":"Account","headerAttributes":{"data-field":"AccountCD","data-title":"Account"},"width":"120px","field":"AccountCD","encoded":true,"editor":"<input id=\"AccountCD\" name=\"AccountCD\" type=\"text\" /><script> kendo.syncReady(function(){jQuery(\"#AccountCD\").kendoAutoComplete({\"dataSource\":{\"transport\":{\"read\":{\"url\":\"/Document/GetAutoCompleteItems\",\"data\":txtFilterValue_onAdditionalData},\"prefix\":\"\"},\"schema\":{\"errors\":\"Errors\"}}});});<\/script><span class=\"field-validation-valid\" data-valmsg-for=\"AccountCD\" data-valmsg-replace=\"true\"></span>"},{"title":"Effective Date","headerAttributes":{"data-field":"EffectiveDate","data-title":"Effective Date"},"hidden":true,"width":"60px","field":"EffectiveDate","format":"{0:MM/dd/yyyy}","encoded":true,"editor":"<input class=\"text-box single-line\" data-val=\"true\" data-val-date=\"The field EffectiveDate must be a date.\" id=\"EffectiveDate\" name=\"EffectiveDate\" type=\"datetime\" value=\"\" /><span class=\"field-validation-valid\" data-valmsg-for=\"EffectiveDate\" data-valmsg-replace=\"true\"></span>"},{"title":"End Date","headerAttributes":{"data-field":"EndDate","data-title":"End Date"},"hidden":true,"width":"60px","field":"EndDate","format":"{0:MM/dd/yyyy}","encoded":true,"editor":"<input class=\"text-box single-line\" data-val=\"true\" data-val-date=\"The field EndDate must be a date.\" id=\"EndDate\" name=\"EndDate\" type=\"datetime\" value=\"\" /><span class=\"field-validation-valid\" data-valmsg-for=\"EndDate\" data-valmsg-replace=\"true\"></span>"},{"title":"Sort Order","headerAttributes":{"data-field":"SPSortOrder","data-title":"Sort Order"},"template":"<span class='spSortSpan'>#if(SPSortOrder != null) {# #=SPSortOrder# #} else {# #=0# #}#</span>","field":"SPSortOrder","encoded":true,"editor":"<input class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field SPSortOrder must be a number.\" id=\"SPSortOrder\" name=\"SPSortOrder\" type=\"number\" value=\"\" /><span class=\"field-validation-valid\" data-valmsg-for=\"SPSortOrder\" data-valmsg-replace=\"true\"></span>"},{"title":"Added By","headerAttributes":{"data-field":"AddedBy","data-title":"Added By"},"field":"AddedBy","encoded":true},{"title":"Added On","headerAttributes":{"data-field":"AddedOn","data-title":"Added On"},"field":"AddedOn","format":"{0:MM/dd/yyyy}","encoded":true},{"title":"Updated By","headerAttributes":{"data-field":"UpdatedBy","data-title":"Updated By"},"field":"UpdatedBy","encoded":true},{"title":"Updated On","headerAttributes":{"data-field":"UpdatedOn","data-title":"Updated On"},"field":"UpdatedOn","format":"{0:MM/dd/yyyy}","encoded":true},{"title":"First Run","headerAttributes":{"data-field":"FirstRun","data-title":"First Run"},"width":"110px","template":"<input id='FirstRun' name='FirstRun' class='chkbx'  type='checkbox'  #= FirstRun ? checked='checked' : '' #/>","field":"FirstRun","encoded":true,"editor":"<input class=\"check-box\" data-val=\"true\" data-val-required=\"The FirstRun field is required.\" id=\"FirstRun\" name=\"FirstRun\" type=\"checkbox\" value=\"true\" /><input name=\"FirstRun\" type=\"hidden\" value=\"false\" /><span class=\"field-validation-valid\" data-valmsg-for=\"FirstRun\" data-valmsg-replace=\"true\"></span>"},{"title":"Second Run","headerAttributes":{"data-field":"SecondRun","data-title":"Second Run"},"width":"110px","template":"<input id='SecondRun' name='SecondRun' type='checkbox' #= SecondRun ? checked='checked' : '' # class='chkbx'/>","field":"SecondRun","encoded":true,"editor":"<input class=\"check-box\" data-val=\"true\" data-val-required=\"The SecondRun field is required.\" id=\"SecondRun\" name=\"SecondRun\" type=\"checkbox\" value=\"true\" /><input name=\"SecondRun\" type=\"hidden\" value=\"false\" /><span class=\"field-validation-valid\" data-valmsg-for=\"SecondRun\" data-valmsg-replace=\"true\"></span>"}],"sortable":true,"scrollable":{"height":"200px"},"editable":{"confirmation":"Are you sure you want to delete this record?","confirmDelete":"Delete","cancelDelete":"Cancel","mode":"incell","template":null,"create":true,"update":true,"destroy":true},"toolbar":{"command":[{"name":null,"buttonType":"ImageAndText","text":"Add Page"},{"name":null,"buttonType":"ImageAndText"}]},"messages":{"noRecords":"No records available."},"dataSource":{"type":(function(){if(kendo.data.transports['aspnetmvc-ajax']){return 'aspnetmvc-ajax';} else{throw new Error('The kendo.aspnetmvc.min.js script is not included.');}})(),"transport":{"read":{"url":"/Document/SectionPage?sectionID=14"},"prefix":"","update":{"url":"/Document/SectionPage_Update"},"create":{"url":"/Document/SectionPage_Create"},"destroy":{"url":"/Document/SectionPage_Delete"}},"error":detailGridDS_onError,"schema":{"data":"Data","total":"Total","errors":"Errors","model":{"id":"SectionPageID","fields":{"SectionPageID":{"type":"number","defaultValue":null},"SectionID":{"type":"number","defaultValue":null},"PageID":{"type":"number","defaultValue":null},"PageCD":{"type":"string"},"PageTitle":{"editable":false,"type":"string"},"PageTitleOverride":{"type":"string"},"AccountID":{"type":"number","defaultValue":null},"AccountCD":{"type":"string"},"EffectiveDate":{"type":"date","defaultValue":null},"EndDate":{"type":"date","defaultValue":null},"SPSortOrder":{"type":"number","defaultValue":null},"AddedBy":{"editable":false,"type":"string"},"AddedOn":{"editable":false,"type":"date","defaultValue":null},"UpdatedBy":{"editable":false,"type":"string"},"UpdatedOn":{"editable":false,"type":"date","defaultValue":null},"FirstRun":{"type":"boolean"},"SecondRun":{"type":"boolean"}}}}}});});
    </script>
    </td>
</tr>
</tbody>
不要投票

您可以尝试以下选择器之一：

// Adding input 'name' attribute
$("#sectionGrid .k-grid-content").on("change", 'input.chkbx[name="TOC_ckbx"]', function (e) {

要么 ...

// Filtering by only those inputs under 'td' and 'tr.k-master-row'
$("#sectionGrid .k-grid-content").on("change", 'tr.k-master-row > td > input.chkbx', function (e) {

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何在Kendo UI网格中获取复选框的值？

如何在AngularJS中获取多个复选框的值？

如何在Xamarin表单中获取复选框值

如何在React JS中获取复选框的值

如何在angularjs中获取复选框值？

如何在JavaScript中获取复选框的标签值

如何在FormData中获取多个复选框值？

如何在javascript中获取复选框值

如何在Codeigniter中获取复选框值

如何在JavaScript中获取复选框值

如何在PHP中获取复选框的值

如何在单列中获取多个复选框的值

问：如何使用复选框过滤剑道网格数据？

如何在左侧放置剑道复选框标签

如何获取多个复选框的值并使用复选框中的值执行增量

如何在剑道中的复选框中删除这些蓝色条/边框

如何在angular.js中同时获取复选框值和单选按钮值

如何在AngularJS中同时获取复选框值和单选值

如果选中复选框，如何从复选框中获取属性值？

如何获取复选框组中复选框的显示值？

如何从javascript中的表中获取复选框值？

如何在ngFor中获取复选框值？在Angular 2+中？

如何从C＃中的复选框获取选定的值

如何使用jquery在警报中获取复选框值？

如何获取Nativescript中复选框的值？

如何从Django中的复选框获取多个值

如何从Delphi中的TGroupBox获取复选框值？

如何获取Javascript中仅选中的复选框的值？

如何使用jQuery从复选框中获取多个值

TOP 榜单

  1. 1

    UITableView的项目向下滚动后更改颜色，然后快速备份

  2. 2

    Linux的官方Adobe Flash存储库是否已过时？

  3. 3

    用日期数据透视表和日期顺序查询

  4. 4

    应用发明者仅从列表中选择一个随机项一次

  5. 5

    Mac OS X更新后的GRUB 2问题

  6. 6

    验证REST API参数

  7. 7

    Java Eclipse中的错误13，如何解决？

  8. 8

    带有错误“ where”条件的查询如何返回结果？

  9. 9

    ggplot：对齐多个分面图-所有大小不同的分面

  10. 10

    尝试反复更改屏幕上按钮的位置 - kotlin android studio

  11. 11

    如何从视图一次更新多行（ASP.NET - Core）

  12. 12

    计算数据帧中每行的NA

  13. 13

    蓝屏死机没有修复解决方案

  14. 14

    在 Python 2.7 中。如何从文件中读取特定文本并分配给变量

  15. 15

    离子动态工具栏背景色

  16. 16

    VB.net将2条特定行导出到DataGridView

  17. 17

    通过 Git 在运行 Jenkins 作业时获取 ClassNotFoundException

  18. 18

    在Windows 7中无法删除文件（2）

  19. 19

    python中的boto3文件上传

  20. 20

    当我尝试下载 StanfordNLP en 模型时，出现错误

  21. 21

    Node.js中未捕获的异常错误，发生调用

热门标签

归档