jQuery MiniUI

标题: table 中的 mini-datagrid [打印本页]

作者: heng 时间: 2013-9-24 16:16:04 标题: table 中的 mini-datagrid

我在table的td中放了个mini-datagrid，然后通过点击按钮动态添加mini-datagrid的行，mini-datagrid行中有下拉框，代码如下：
页面元素代码：
<tr>
                    <td style="width:70px;" align="right">岗位：</td>
                     <td style="width:350px;" align="left" colspan="3">
                        <div id="gangwei" class="mini-datagrid" style="width:350px;"
      allowCellEdit="true" allowCellSelect="true"
      showPager="false" virtualScroll="true" showColumns="false"
>
      <div property="columns">
<div field="tact_departIds" width="70" headerAlign="center">
                  <input property="editor" class="mini-treeselect" url="<%=path %>/web/sys/tree/treeData.jsp?ttr_type=3&ttr_enable=1" multiSelect="true"
         textField="name" valueField="id" parentField="pid" checkRecursive="true"
         showFolderCheckBox="true"  expandOnLoad="true" showClose="true"
         style="width:350px;" required="true" popupWidth="270" emptyText="请选择组织机构"
      />
            </div>
            <div field="tact_stationIds" width="70" headerAlign="center">
                  <input property="editor" class="mini-treeselect" url="<%=path %>/web/sys/tree/treeData.jsp?ttr_type=3&ttr_enable=1" multiSelect="true"
         textField="name" valueField="id" parentField="pid" checkRecursive="true"
         showFolderCheckBox="true"  expandOnLoad="true" showClose="true"
         style="width:350px;" required="true" popupWidth="270" emptyText="请选择工作岗位"
      />
            </div>
            <div field="remarks3" width="10" headerAlign="center">
      <a href="#">删除</a>
            </div>
      </div>
</div>
<a href="#">添加</a>
                     </td>

            </tr>

添加行js：
function addGangWeiRow(){
        var grid = mini.get("gangwei");
         var newRow = {};
         //alert("grid.getData().length:"+grid.getData().length);
         grid.addRow(newRow, grid.getData().length);
      }

最终展现效果如图：[attach]2937[/attach]
问题：1、默认下拉框显示不出来，只有点击一下下拉框所在的单元格才显示出来，单元格失去焦点后下拉框又被遮住
2、最后一列应该显示“删除”，但实际效果是没有显示出来
请问是什么原因呢，谢谢！！

作者: factory 时间: 2013-9-24 16:28:57

1.给列设置autoShowPopup="true"

2.参考:http://www.miniui.com/demo/#src=datagrid/staticedit.html
单元格内自定义添加html,用renderer来处理

作者: heng 时间: 2013-9-24 21:31:41

factory 发表于 2013-9-24 16:28
1.给列设置autoShowPopup="true"

2.参考:http://www.miniui.com/demo/#src=datagrid/staticedit.html

您好谢谢我按照您的方法试了，还是没有变化，是不是由于我的这个grid是在td中的原因呢，代码如下：
<td style="width:350px;" align="left" colspan="3">
<div id="gangwei" class="mini-datagrid" style="width:350px;" allowCellEdit="true"
      allowCellSelect="true" showPager="false" showColumns="false"
>
      <div property="columns">
</td>
<div field="tact_departIds" width="70" headerAlign="center" autoShowPopup="true" >
                  <input property="editor" class="mini-treeselect" url="<%=path %>/web/sys/tree/treeData.jsp?ttr_type=3&ttr_enable=1" multiSelect="false"
         textField="name" valueField="id" parentField="pid" checkRecursive="false"
         showFolderCheckBox="true"  expandOnLoad="true" showClose="true" oncloseclick="onCloseClick"
         style="width:350px;" required="true" popupWidth="270" emptyText="请选择组织机构"
      />
            </div>
            <div field="tact_stationIds" width="70" headerAlign="center" autoShowPopup="true">
                  <input property="editor" class="mini-treeselect" url="<%=path %>/web/sys/tree/treeData.jsp?ttr_type=3&ttr_enable=1" multiSelect="false"
         textField="name" valueField="id" parentField="pid" checkRecursive="false"
         showFolderCheckBox="true"  expandOnLoad="true" showClose="true" oncloseclick="onCloseClick"
         style="width:350px;" required="true" popupWidth="270" emptyText="请选择工作岗位"
      />
            </div>
            <div field="remarks3" width="10" headerAlign="center" autoShowPopup="true" renderer="onActionRenderer" cellStyle="padding:0;">#</div>
      </div>
</div>

作者: factory 时间: 2013-9-25 09:23:27

heng 发表于 2013-9-24 21:31
您好谢谢我按照您的方法试了，还是没有变化，是不是由于我的这个grid是在td中的原因呢，代码如下：

不会的,跟td没关系.
1.你仔细看下:http://www.miniui.com/demo/#src=datagrid/celledit.html
性别这一列和国家的区别,性别这列加上autoShowPopup="true"之后,就可以自动弹出下拉,而国家需要再点一下

2.单元格增加的时候,你参考:http://www.miniui.com/demo/#src=datagrid/staticedit.html
里面的#这一列即可,他也是自己在单元格内放了段HTML

欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)