Javascript Dojo dGrid标头复选框以选择“全部”不起作用

Javascript Dojo dGrid标头复选框以选择“全部”不起作用,javascript,html,dojo,dojox.grid,dgrid,Javascript,Html,Dojo,Dojox.grid,Dgrid,我创建了一个dojo dgrid,但是我使用了表单向导来分离表单上的字段,但是在当前结构中,我在网格上的“全选”功能方面遇到了问题 但是,如果我将div Page2及其内容从其工作的表单中删除,则无法选择全部 在firebug中,我还检查了DOM,当我选中全选框时,我看到了“aria checked=mixed”,而它应该是“aria checked=true” 当选中标题复选框并且网格处于向导形式时,如何获取标题复选框以允许选中所有记录 下面是一些屏幕截图和代码: jsp <div d

我创建了一个dojo dgrid,但是我使用了表单向导来分离表单上的字段,但是在当前结构中,我在网格上的“全选”功能方面遇到了问题

但是,如果我将div Page2及其内容从其工作的表单中删除,则无法选择全部

在firebug中,我还检查了DOM,当我选中全选框时,我看到了“aria checked=mixed”,而它应该是“aria checked=true”

当选中标题复选框并且网格处于向导形式时,如何获取标题复选框以允许选中所有记录

下面是一些屏幕截图和代码:

jsp

 <div data-dojo-type="dojox.widget.Wizard" hideDisabled="true"
            data-dojo-props="style:'height:300px; width:600px'">        



    <div dojoType="dojox.widget.WizardPane" id="Page2">
        <div data-dojo-type="dojox.layout.TableContainer"
                    data-dojo-props="cols:1,customClass:'employee_labels', labelWidth:180"
                    id="EmployeeBirthNameContainer">
                    <label>2. Is you name on your Birth Certificate is 
                        different from (1) above ?(e.g. Changed by Deed Poll / Marriage)</label>

                    <s:textfield type="text" required="true" name="birth_surname"
                        id="birth_surname" placeholder="Your SurName"
                        data-dojo-type="dijit/form/ValidationTextBox"
                        missingMessage="Please Enter Your Surname On Your Birth Certificate!"
                        title="(a). Surname :"
                        style="width: 25em;" />

                    <s:textfield type="text" required="true" name="birth_firstname"
                        id="birth_firstname" placeholder="Your FirstName"
                        data-dojo-type="dijit/form/ValidationTextBox"
                        missingMessage="Please Enter Your FirstName On Your Birth Certificate!"
                        title="(b). FirstName :" 
                        style="width: 25em;"/>

                    <s:textfield type="text" required="false" name="birth_other_names"
                        id="birth_other_names" placeholder="Other Names"
                        data-dojo-type="dijit/form/ValidationTextBox"
                        title="(c). Other Names :"
                        style="width: 25em;" />                     

        </div>
    </div>  


    <div dojoType="dojox.widget.WizardPane" id= "Page3">
         <div data-dojo-type="dojox.layout.TableContainer"
            data-dojo-props="cols:2,customClass:'employee_labels', labelWidth:250"
            id="EmployeeIdentificationContainer">

            <label>3. Please Enter At Least Two Forms Of Identification</label> 

            <s:select data-dojo-type="dijit/form/FilteringSelect" id="id"
                        name="id" title= "Identification Type"
                        list="#{'':'Select Your I.D Type','1':'Passport','2':'Drivers Permit','3':'Electoral Identification'}"/>

            <s:textfield type="text" required="true" name="idNumber"
                        id="idNumber" placeholder="Your Identification Number"
                        data-dojo-type="dijit/form/ValidationTextBox"
                        missingMessage="Please Enter Your Identification Number"
                        title="(a). Identification Number :"
                        style="width: 25em;" />  

        </div>
            <div id="grid"></div>   
    </div>  

</div>

您不应该将
选择器
编辑器
混合到构造函数中-它们不是设计用来这样使用的。它们被设计为包装列定义对象(您已经在为
selector
column执行此操作,不过我要注意,
selectorType:“checkbox”
是不必要的,因为这已经是默认设置)

另外,不相关的,
selectionMode
以小写s开头


不确定这是否能解决您的问题,但它肯定能防止一些奇怪的行为。

@Zachsauier我更新了问题我的道歉您包含的代码似乎没有说明您实际如何设置网格。没有这个很难猜测。不过,我敢打赌,作为第一个猜测,DijitRegistry中没有混合。@KenFranqueiro我更新了问题并添加了网格的创建方式请检查这个解决方案,实际上我需要在grid.renderArray(数据)之后执行grid.refresh(),现在它可以正常工作了。您正在向网格传递一个存储,所以实际上,你为什么还要手动调用
renderArray
?网格应该已经呈现了它…至少,如果它被正确启动的话。您还应该在任何以编程方式创建的小部件上调用.startup()。如果dgrid发现它的
domNode
已经在文档流中,它实际上会为您调用
startup
。但是,手动再次调用它应该不会有什么坏处。应该注意的是,从dgrid 0.4开始,您应该将它们混合到构造函数中,而不是包装列定义对象。
require([  

  "dijit/form/CheckBox",
  "dijit/dijit",
    "dijit/form/Textarea",
    "dijit/form/FilteringSelect",
    "dijit/form/TextBox",
    "dijit/form/ValidationTextBox",
    "dijit/form/DateTextBox",
    "dijit/form/TimeTextBox",
    "dijit/form/Button",
    "dijit/form/RadioButton",
    "dijit/form/Form", 




]);

require([  
       "dojox/validate/us",
       "dojox/validate/web", 
       "dojox/layout/TableContainer",
       "dojox/layout/GridContainer",
       "dojox/widget/Wizard",
      "dojox/widget/Portlet",
       "dojox/widget/WizardPane",
       "dojox/grid/_CheckBoxSelector"




       ]);

require([  
  "dojo/parser",  
  "dojo/_base/declare",
  "dojo/store/Memory",




  "dgrid/OnDemandGrid",
  "dgrid/ColumnSet",
  "dgrid/Selection",
  "dgrid/selector",
  "dgrid/Keyboard",  
  "dgrid/extensions/DijitRegistry",
  "dgrid/editor",
  "dgrid/extensions/ColumnHider",


  "dojo/domReady!" 

], function(parser, declare, MemoryStore, OnDemandGrid, ColumnSet, Selection, 
            selector,Keyboard, DijitRegistry,editor,ColumnHider){
      parser.parse();


      var data = [
            { id:"1", idType: "Passport", idNumber: "12121545WWW" },
            { id:"2",idType: "Drivers Permit", idNumber: "11212154515 FF"},
            { id:"3",idType: "Electoral Identification", idNumber: "425123123121"}
        ];
    var store = new MemoryStore({

        data: data

    });
      var columns =     [
                         [[
                           {label:"Id", field:"Id"},
                           editor({label: "", field: "select", sortable: false, autoSave:true},"checkbox"),
                           { field: "idType", label: "Identification Type" },
                           { field: "idNumber", label: "Identification Number" }]]
                        ];           

      var CustomGrid = declare([OnDemandGrid, selector,Selection, Keyboard, editor,DijitRegistry,ColumnHider]);




      var grid = new CustomGrid ({
          store: store,
            columns: {
                col1:{
                    label:"Id",
                    field:"Id",
                    hidden:true
                },

                selector: selector( {selectorType: "checkbox"}),

                col3:{
                    label:"ID Type",
                    field:"idType"
                },

                col4:{
                    label:"ID Number",
                    field:"idNumber"
                }

            } ,
            SelectionMode:"none",
            class:'grid',
          allowSelectAll: true
        }, "grid");


     grid.renderArray(data);   
});