微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

JQUERY中用于加载JQGRID的选项卡

我正在使用jqgrid制作网格

我想在我的应用程序中创建选项卡
单击选项卡应打开网格,选项卡的名称显示页面顶部
当我点击另一个标签时,它应该加载另一个网格..
网格应该加载在同一页面上,标签也应该一直出现在页面
我已经创建了网格,只是想将它们与标签集成…
plzz帮助我
提前致谢…..

最佳答案
好的以下将是您的代码.我正在为(emp,manager)使用相同的数据,您可以在以后更改它.

HTML

 

JavaScript的

$(function () {
            'use strict';
            var $tabs=$('#tabs').tabs();

            var selected = $tabs.tabs('option','selected');

            if(selected==0){

               var mydata = [
                    {id: "1",invdate: "2007-10-01",name: "test",note: "note",amount: "200.00",tax: "10.00",closed: true,ship_via: "TN",total: "210.00"}

                ],$grid = $("#list"),$pager = $("#pager");
                callMe($grid,mydata,$pager);


          }
          $('#tabs').bind('tabsselect',function(event,ui) {

    selected=ui.index;

    if(selected==0)
    {
     var mydata = [
                    {id: "1",$pager);
    }

    if(selected==1)
    {
     var mydata = [
                    {id: "1",$grid = $("#list1"),$pager = $("#pager1");
                callMe($grid,$pager);
    }

        });
            function callMe(grid,pager){
            grid.jqgrid({
                datatype: 'local',data: mydata,colNames: ['Date','Client','Amount','Tax','Total','Closed','Shipped via','Notes'],colModel: [
                    {name: 'invdate',index: 'invdate',width: 90,align: 'center',sorttype: 'date',formatter: 'date',formatoptions: {newformat: 'd-M-Y'},datefmt: 'd-M-Y'},{name: 'name',index: 'name',width: 100},{name: 'amount',index: 'amount',width: 105,formatter: 'number',sorttype: 'number',align: 'right'},{name: 'tax',index: 'tax',width: 95,align: 'right',hidden: true},{name: 'total',index: 'total',{name: 'closed',index: 'closed',formatter: 'checkBox',edittype: 'checkBox',editoptions: {value: 'Yes:No',defaultValue: 'Yes'}},{name: 'ship_via',index: 'ship_via',width: 130,formatter: 'select',edittype: 'select',editoptions: {value: 'FE:FedEx;TN:TNT;IN:Intim',defaultValue: 'Intime'}},{name: 'note',index: 'note',width: 90}
                ],rowNum: 10,rowList: [5,10,20],pager: pager,gridview: true,rownumbers: true,sortname: 'invdate',viewrecords: true,sortorder: 'desc',caption: 'Buttons in the column headers',height: '100%'
            });
           } 
        });

所以,这里我的认选择选项卡将是emp,其索引将为0,所以我最初检查它然后在tabselect事件上,我正在检查索引.对于emp索引为0且管理器索引为1.基于我正在更改网格和寻呼机值,您可以在此处更改数据.这对你有用.我不太了解ui标签我将进一步研究它.但是现在这对你有用.

原文地址:https://www.jb51.cc/jquery/428626.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐