EasyUI Forum
May 21, 2024, 02:32:23 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: fit property of datagrid doesn't work  (Read 26060 times)
balri771
Newbie
*
Posts: 9


View Profile
« on: July 30, 2013, 11:58:07 PM »

Hi ,
   The fit property of datagrid doesn't work when I with layout.the west of layout put a tree ,the center put a datagrid ,then the fit property in vain!
   Any help or direction would be appreciated.
   thanks!
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: August 03, 2013, 08:03:19 AM »

Here is the example shows how to put datagrid(with fit propety set to true) on layout center region.
http://www.jeasyui.com/demo/main/index.php?plugin=Layout&theme=default&dir=ltr&pitem=Basic
Logged
balri771
Newbie
*
Posts: 9


View Profile
« Reply #2 on: August 04, 2013, 10:39:24 PM »

hello,

   I know how to use the fit ,but it doesn't work. Below is my code.
   <div data-options="region:'west',title:'权限组信息',split:true" style="width:150px;">
      <div>
       <ul id="treeqm" width="98%" class="easyui-tree" data-options="
       url: '@Url.Content("~/Permission/ListPermTree")',
       onClick: function (node) {
            $('#dg').datagrid({
                url:'@Url.Content("/Permission/List")?qxzid='+node.id,
                pagination:true,
                singleSelect:true,
                rownumbers:true,
                pageList:[15,20,30],
                columns:[[
                    {field:'XM',title:'@resBaseinfo.name',width:150},
                    {field:'RYBH',title:'@resBaseinfo.card_rybh',width:120},
                    {field:'KXLH',title:'@resBaseinfo.card_kh',width:100},
                    {field:'BMMC',title:'部门',width:100},
                    {field:'KMBH',title:'@resBaseinfo.card_kmbh',width:100},
                    {field:'KZT',formatter:formatKZT,title:'@resBaseinfo.card_kzt',width:100}
                   
                      ]]
            });
        }
       "></ul>
      </div>
   </div>

<div id="w_list_print" >
       <table id="dg" width="80%" class="easyui-datagrid" data-options="url:'@Url.Content("~/Permission/List")',
                pagination:true,
                singleSelect:true,
                rownumbers:true,
                pageList:[15,20,30],
                fit:true,
                columns:[[
                    {field:'XM',title:'@resBaseinfo.name',width:150},
                    {field:'RYBH',title:'@resBaseinfo.card_rybh',width:120},
                    {field:'KXLH',title:'@resBaseinfo.card_kh',width:100},
                    {field:'SSBMJG',title:'部门',width:100},
                    {field:'KMBH',title:'@resBaseinfo.card_kmbh',width:100},
                    {field:'KZT',formatter:formatKZT,title:'@resBaseinfo.card_kzt',width:100}
                     ]]">
       </table>
     </div>

 I click on the left side of the tree,data loading to the right,but I add the fit property,the data cann't loaded and the pagination don't show !
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #3 on: August 05, 2013, 12:24:54 AM »

You need to define a center panel for the layout. Try this:
Code:
<div data-options="region:'west',split:true" style="width:150px;">
...
</div>
<div id="w_list_print" data-options="region:'center'">
<table class="easyui-datagrid" ...></table>
</div>
Logged
balri771
Newbie
*
Posts: 9


View Profile
« Reply #4 on: August 05, 2013, 01:11:52 AM »

Hello,

  I'm sorry for I I didn't completely copy the code。
    <div data-options="region:'center'" style="overflow:hidden;">
     <div id="toolbar" class="toolbar">
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true" onclick=" "> </a>
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true" onclick=" "> </a>
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true" onclick=" "> </a>
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true" onclick=" "> </a>
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-setpos',plain:true" onclick=" "> </a>
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-setpos',plain:true" onclick=" "> </a>
         
     </div>
     <div id="w_list_print" >
       <table id="dg" width="80%" class="easyui-datagrid" data-options="url:'@Url.Content("~/ /List")',
                pagination:true,
                singleSelect:true,
                rownumbers:true,
                pageList:[15,20,30],
                columns:[[
                    {field:'XM',title:'@resBaseinfo.name',width:150},
                    {field:'RYBH',title:'@resBaseinfo.card_rybh',width:120},
                    {field:'KXLH',title:'@resBaseinfo.card_kh',width:100},
                    {field:'SSBMJG',title:'部门',width:100},
                    {field:'KMBH',title:'@resBaseinfo.card_kmbh',width:100},
                    {field:'KZT',formatter:formatKZT,title:'@resBaseinfo.card_kzt',width:100}
                     ]]">
       </table>
     </div>
   </div>

   then add the fit property ,the data still can't load and the pagination don't show!I don't know what's wrong
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #5 on: August 05, 2013, 02:08:44 AM »

Please try this:
Code:
<div data-options="region:'center'" style="overflow:hidden;">
<div id="toolbar" class="toolbar">
...
</div>
<table id="dg" class="easyui-datagrid" data-options="
toolbar:'#toolbar',
fit:true,
...
">
</table>
</div>
Logged
balri771
Newbie
*
Posts: 9


View Profile
« Reply #6 on: August 05, 2013, 06:10:04 PM »

 hi,
  I'm try,The same results.Thank you all the same!
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #7 on: August 06, 2013, 11:37:20 PM »

Here is the layout example, it works well.
http://jsfiddle.net/t5yuJ/
Logged
balri771
Newbie
*
Posts: 9


View Profile
« Reply #8 on: August 07, 2013, 01:17:57 AM »

Hi,
  thank you very much!The solution is to remove the table div layer about the question. It's really effective,but there is still a problem! The footer of datagrid isn't display! I debugging by FireBug,find that the footer's style ="display:none",so the  pagination property doesn't work!
 
 Thank you again for your answers!
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!