Как я могу включить два jqgrid на одной странице?

0

как вопрос выше, могу ли я это сделать??

Это моя страница jspx:

<script>
    $(function() {
        $('#accordion').accordion({collapsible: true});
        $('#tabs').tabs();
    });
</script>

<form:show id="fs_abstractPressione" path="/pressione" object="${abstractPressione}" create="false" list="false">
    <h2>Insieme a Pressione</h2>
    <div id="tabs">
        <ul>
            <li><a href="#tabs-1">A</a></li>
            <li><a href="#tabs-2">B</a></li>
            <li><a href="#tabs-3">C</a></li>
            <li><a href="#tabs-4">D</a></li>
        </ul>
        <div id="tabs-1">
            <div id="accordion">
                <h3>A</h3>
                <div>
                    <jsp:include page="../../pressione/show.jspx" />
                </div>
            </div>
        </div>
        <div id="tabs-2">
        b
        </div>
        <div id="tabs-3">
        c
        </div>
        <div id="tabs-4">
            <jsp:include page="../elencoIncarichiPressione.jspx" />
        </div>
  </div>

и я хочу вставить tabs-2 и tabs-3 одному jqgrid на каждой вкладке.

EDIT Для этого я включаю страницы с jQgrid на моей главной странице, таким образом:

<jsp:include page="../a/1.jspx"/>     <jsp:include page="../b/2.jspx"/>

ОТДЕЛКА

Это мой jQrdid: для tabs-1:

        $("#list").jqGrid({
        url:'${urlDatiTecnici}listgrid',
        datatype: 'json',
        mtype: 'GET',
        autowidth: true,
        colNames:['${labelTipologia}','${labelPressione}', '${labelTemperaturaMin}', '${labelTemperaturaMax}', '${label_naturaFluido}', '${label_gruppoFluido}', '${label_statoFluido}', '${label_volume}', '${label_dn}', ''],
        colModel :[{name:'camera', index:'camera', width:100, editable:true },
                     {name:'ps', index:'ps', width:60, editable:true }, 
                     {name:'temperaturaMin', index:'temperaturaMin', width:60, editable:true }, 
                     {name:'temperaturaMax', index:'temperaturaMax', width:60, editable:true }, 
                     {name:'naturaFluido', index:'naturaFluido', width:55, editable:true }, 
                     {name:'gruppo', index:'gruppo', width:65, editable:true },
                     {name:'stato', index:'stato', width:80, editable:true, edittype: 'select', editoptions: {value:"Solido:Solido;Liquido:Liquido;Gassoso:Gassoso"}}, 
                     {name:'volume', index:'volume', width:60, editable:true }, 
                     {name:'dn', index:'dn', width:40, editable:true }, 
                     {name : 'Elimina', index: 'elimina', width:35, formatter:'actions',
                 formatoptions: {
                     keys: true,
                     editbutton: false,
                     align: 'left',
                    delOptions: { url:'${urlDelete}', dataType: "json" }}}],
        jsonReader : {
            root:"entryData",
            page: "currentPage",
            total: "totalPages",
            records: "totalRecords",
            repeatitems: false,
            id: "id"
        },      
        pager: '#pager',
        rowNum:10,
        sortname: 'id',
        sortorder: 'asc',
        viewrecords: true,
        height: 'auto',
        editurl: '${urlAddDatiTecnici}',
        caption: '${labelDatiTecnici}',
        onSelectRow: function(id){
            lastsel=id;
        },
    });   

       $("#list").jqGrid('navGrid','#pager', {edit:false, add:true, del:false, search:false, refresh:false});
       $("#list").jqGrid('setGridParam', {}).trigger("reloadGrid");

        $("#saverow").click( function() {
            $("#list").jqGrid('saveRow',cursel);
            $(this).attr("disabled",true); 
            $("#editrow").attr("disabled",false); 
            $("#addrow").attr("disabled",false); 
        });

        $("#cancel").click( function() {
            $("#list").jqGrid('restoreRow',cursel);
            $(this).attr("disabled",true); 
            $("#editrow").attr("disabled",false);
            $("#addrow").attr("disabled",false); 
        });

    });  

для tabs-2:

        $("#list").jqGrid({
        url:'${urlComponenteInsieme}listgrid',
        datatype: 'json',
        mtype: 'GET',
        autowidth: true,
        colNames:['${labelTipologiaAttrezzatura}','${labelNumeroFabbrica}', '${labelMarcaturaCE}', '${labelAttrezzaturaISPESL}', '${labelAccessoriSicurezza}', ''],
        colModel :[{name:'tipologiaAttrezzatura', index:'tipologiaAttrezzatura', width:50, editable:true },
                     {name:'numeroFabbrica', index:'numeroFabbrica', width:30, editable:true }, 
                     {name:'marcaturaCE', index:'marcaturaCE', width:30, editable:true }, 
                     {name:'attrezzaturaISPESL', index:'attrezzaturaISPESL', width:30, editable:true }, 
                     {name:'accessoriSicurezza', index:'accessoriSicurezza', width:30, editable:true, edittype:'checkbox', editoptions: { value:"true;false" }}, 
                 {name : 'Elimina', index: 'elimina', width:10, formatter:'actions',
                 formatoptions: {
                     keys: true,
                     editbutton: false,
                     align: 'center',
                 delOptions: { url:'${urlDelete}', dataType: "json" }}}],
        jsonReader : {
            root:"entryData",
            page: "currentPage",
            total: "totalPages",
            records: "totalRecords",
            repeatitems: false,
            id: "id"
        },      
        pager: '#pager',
        rowNum:10,
        sortname: 'camera',
        sortorder: 'asc',
        viewrecords: true,
        height: 'auto',
        editurl: '${urlAddComponenteInsieme}',
        caption: '${labelComponenteInsieme}',
        onSelectRow: function(id){
        },
    });   

       $("#list").jqGrid('navGrid','#pager', {edit:false, add:true, del:false, search:false, refresh:true});
       $("#list").jqGrid('setGridParam', {}).trigger("reloadGrid");

        $("#saverow").click( function() {
            $("#list").jqGrid('saveRow',cursel);
            $(this).attr("disabled",true); 
            $("#editrow").attr("disabled",false); 
            $("#addrow").attr("disabled",false); 
        });

        $("#cancel").click( function() {
            $("#list").jqGrid('restoreRow',cursel);
            $(this).attr("disabled",true); 
            $("#editrow").attr("disabled",false);
            $("#addrow").attr("disabled",false); 
        });

    });  

Как мне это сделать??

заранее спасибо

  • 0
    Вы действительно хотели прикрепить обе таблицы к #list тому же #list ?
  • 0
    У меня есть две разные страницы, где я прикрепляю jqrdi к списку, и затем я включаю его в ту же страницу ..
Показать ещё 3 комментария
Теги:
spring-mvc
jqgrid
jspx

1 ответ

3
Лучший ответ

Вы можете иметь несколько сеток, если вы прикрепляете их к разным таблицам и идентификаторам пейджера.

$("#table1").jqGrid( { options });
$("#table2").jqGrid( { options });

HTML:

<table id="table1"></table>
<div id="pager1"><div>
<table id="table2"></table>
<div id="pager2"><div>
  • 0
    Это работа ... Большое спасибо!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню