easyui 的 datagrid 在选项卡 tabs 中不显示数据
 </head>
<body>
    <div class="body">
        <div class="left">
            <div id="ak47" class="li">
                添加选项卡
            </div>
        </div>
        <div class="right">
            <div id="tt" class="easyui-tabs" style="width:500px;height:250px;">   

            </div> 
        </div>
    </div>
</body>
<script type="text/javascript" src="${basePath }/js/jquery-1.12.2.min.js"></script>
<script type="text/javascript" src="${basePath }/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript">
    $(function(){
        var flog=0;
        $('#tt').tabs({    
            border:false,    
            onSelect:function(title){    
                alert(title+' is selected');    
            }    
        }); 
        // add a new tab panel    
        $('#tt').tabs('add',{    
            title:'New Tab',    
            content:'Tab Body',    
            closable:true,    
            tools:[{    
                iconCls:'icon-mini-refresh',    
                handler:function(){    
                    alert('refresh');    
                }    
            }]    
        }); 

        $("#ak47").on("click",function(){
            if(flog==0)
            {
                flog+=1;
                // 添加一个新的选项卡    
                $('#tt').tabs('add',{    
                    id:"ad",
                    title:'New Tab',    
                    content:'<table id="dg"></table>',    
                    closable:true,    
                    tools:[{    
                        iconCls:'icon-mini-refresh',    
                        handler:function(){    
                            alert('refresh');    
                        }    
                    }]  
                });
                $('#dg').datagrid({    
                    url:'${basePath}/dba/listUser',    
                    columns:[[    
                        {field:'id',title:'ID',width:100},    
                        {field:'loginId',title:'用户名',width:100},    
                        {field:'password',title:'密码',width:100,align:'right'}    
                    ]]    
                });
            }
        });
        $('#tt').tabs({
            onClose:function(){
                flog=0;
            }
        });
    });

点击的时候生成一个tabs并且在tabs中插入一个datagrid。现在的结果是数据可以过来,但是datagrid被挤成一条竖线,数据有,但是被隐藏了
图片说明
下面是获得的数据,但是无法显示
图片说明

4个回答

设置width,height


  $('#dg').datagrid({height:'100%',width:'100%',////////
                    url: '${basePath}/dba/listUser',
                            //////////............
yaqiukasi
yaqiukasi 十分感谢你的回答,问题已解决
大约 2 年之前 回复

弹框能弹出吗?easyUI框架有很多限制,有事回事冲突引起的

yaqiukasi
yaqiukasi 不是冲突,设置上width和height就能正常显示了
大约 2 年之前 回复

检查下从后台返回的数据

F12看看console中报什么错

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问