Question

这是我的jqgrid的javascript部分。主要的想法是在我选择的下拉列表中的值之后进行分组。在我的情况下，有两个选项值（ -1 和＆＃34; cerinte ＆＃34;）。当值为-1时，我不想进行任何分组，但是当我选择cerinte时，我想在＆＃34; cerinte ＆＃34;之后进行搜索。问题是我必须按F5按钮（刷新页面）才能使其正常工作。当我刷新页面后，它完美地运行。我可以做什么来使这项工作没有刷新页面????谢谢我忘了提到我使用哈希链接：我的链接看起来像：？的 ..... / TIMP＃期间= 2014年6月11日＆安培; ddProject = -1＆安培; ddUser = 48＆安培; ddActivity = -1＆安培; txTask =安培; ddGrupare = -1＆安培;页= 1＆安培; sortname =日期和安培;排序顺序= ASC

window.onhashchange = function() {
        jQuery("#list2").trigger("reloadGrid");
    }
    var url = $.url(window.location.href.replace("#",""));
    var page = url.param("page");
    var sortname = url.param("sortname");
    var sortorder = url.param("sortorder");
    var group_check = url.param("ddGrupare");
    $("#ddGrupare > option").each(function() {  // se selecteaza option dupa care s-a facut gruparea, valorea fiind selectata va fi atribuita la parametrul URL
        if(group_check == this.value){
            $(this).attr("selected","selected");
        }
    }); 
    if (group_check == "cerinte" ){
        group_check = true;
    }else{
        group_check = false;
    }

    jQuery("#list2").jqGrid({
        url:'/timp/json/',      
        datatype: "json",
        colNames:['Data si ora','Durata','Utilizator','Proiect: task', 'Descriere lucru','',''],
        colModel:[
            {name:'Data',index:'date',width:'11%'},
            {name:'Durata',index:'duration',width:'4%'},
            {name:'Responsabil',index:'username',width:'8%'},           
            {name:'Proiect',index:'projectname',width:'22%'},
            {name:'Descriere',index:'description',width:'40%'},
            {name:' ',index:'remove', sortable:false, width:'3%'},
            {name:'cerinte',index:'cerinte', hidden: true, sortable:false, width:'3%'}
        ],
        rowNum:15,      
        sortname: 'date',
        viewrecords: true,
        sortorder: "asc",
        caption:"",
        autowidth: true,
        shrinkToFit: true,
        width: '100%',
        height: '100%',
        altRows: true,
        altClass: '',
        loadComplete:function(request){

            //alert("Load complete");
            showRecorder();
            $("#paging").html(request.userdata.pager);
            $("#total").html(request.userdata.suma);
            $(".numb").click(function() { 
                $("#list2").trigger("reloadGrid", [{page:$(this).text()}]);
            });
            registerOverlay();
            doPagination();
            showConfirm();
            formatUrl();
            setBackUrl();
            $("#empty").hide(); 
            if(request.total == 0)
                $("#empty").show();

            $("tr td b").each(function(){
                if ($(this).text() == "null"){
                    $(this).text("Taskuri neasociate cu cerinte")
                }
            });
        }, 

        beforeRequest:function() {

            jQuery("#list2").jqGrid('hideCol', ["cerinte"]);
            //parseUrl();
            var taskname = jQuery("#txTask").val();     
            var projectid = jQuery("#ddProject").val();
            var userid = jQuery("#ddUser").val();
            var type = jQuery("#ddActivity").val();
            var period = $("#period").val().split(" - ");
            var startdate = period.length > 0 ? period[0] : '';
            var enddate = period.length > 1 ? period[1] : '';
            jQuery("#list2").jqGrid('setGridParam',{url:"/timp/json/?projectid="+projectid+"&userid="+userid+"&type="+type+"&taskname="+taskname+"&startdate="+startdate+"&enddate="+enddate});
        },
        forceFit : true,        
        grouping:group_check,   // se seteaza dc enable/disable grupare
        groupingView : {
            groupField : ['cerinte'],
            groupSummary : [true],
            groupColumnShow : [true],
            groupText : ['<b>{0}</b>'],
            groupCollapse : false,
            groupOrder: ['asc'],
            groupHeader: [true],
        }
    });
        /*================================================================================*/
        /*                                Grupare                                         */
        /*================================================================================*/

        $("#ddGrupare").change(function () {
            var groupingName = $(this).val();
            url = $("#list2").jqGrid('getGridParam','url');
            url = url+"&ddGrupare="+groupingName;
            jQuery("#list2").jqGrid('setGridParam',{url:url});
            if (groupingName != '-1') {
                $("#list2").jqGrid('groupingGroupBy', groupingName);
                $("thead").first().hide();

            }else{
                $('#list2').jqGrid('groupingRemove');
                $("thead").first().show();
            } 
            jQuery("#list2").trigger("reloadGrid"); 
        });

Answer 1

最后我得到了解决方案：

window.onhashchange = function() {
    jQuery("#list2").trigger("reloadGrid");
}
var url = $.url(window.location.href.replace("#",""));
var page = url.param("page");
var sortname = url.param("sortname");
var sortorder = url.param("sortorder");
var group_checkk = url.param("ddGrupare");
$("#ddGrupare > option").each(function() {  // se selecteaza option dupa care s-a facut gruparea, valorea fiind selectata va fi atribuita la parametrul URL
    if(group_checkk == this.value){
        $(this).attr("selected","selected");
    }
}); 

jQuery("#list2").jqGrid({
    url:'/timp/json/',      
    datatype: "json",
    colNames:['Data si ora','Durata','Utilizator','Proiect: task', 'Descriere lucru','',''],
    colModel:[
        {name:'Data',index:'date',width:'11%'},
        {name:'Durata',index:'duration',width:'4%'},
        {name:'Responsabil',index:'username',width:'8%'},           
        {name:'Proiect',index:'projectname',width:'22%'},
        {name:'Descriere',index:'description',width:'40%'},
        {name:' ',index:'remove', sortable:false, width:'3%'},
        {name:'cerinte',index:'cerinte', hidden: true, sortable:false, width:'3%'}
    ],
    rowNum:15,      
    sortname: 'date',
    viewrecords: true,
    sortorder: "asc",
    caption:"",
    autowidth: true,
    shrinkToFit: true,
    width: '100%',
    height: '100%',
    altRows: true,
    altClass: '',
    loadComplete:function(request){


        showRecorder();
        $("#paging").html(request.userdata.pager);
        $("#total").html(request.userdata.suma);
        $(".numb").click(function() { 
            $("#list2").trigger("reloadGrid", [{page:$(this).text()}]);
        });
        registerOverlay();
        doPagination();
        showConfirm();

        setBackUrl();
        $("#empty").hide(); 
        if(request.total == 0)
            $("#empty").show();

        $("tr td b").each(function(){
            if ($(this).text() == "null"){
                $(this).text("Taskuri neasociate cu cerinte")
            }
        });
        var url = $.url(window.location.href.replace("#",""));

        $("#list2").jqGrid('groupingGroupBy', 'cerinte');
    }, 

    beforeRequest:function() {

        jQuery("#list2").jqGrid('hideCol', ["cerinte"]);
        //parseUrl();

        formatUrl();
        var taskname = jQuery("#txTask").val();     
        var projectid = jQuery("#ddProject").val();
        var userid = jQuery("#ddUser").val();
        var type = jQuery("#ddActivity").val();
        var period = $("#period").val().split(" - ");
        var startdate = period.length > 0 ? period[0] : '';
        var enddate = period.length > 1 ? period[1] : '';
        jQuery("#list2").jqGrid('setGridParam',{url:"/timp/json/?projectid="+projectid+"&userid="+userid+"&type="+type+"&taskname="+taskname+"&startdate="+startdate+"&enddate="+enddate});
    },      
    grouping:true
});
    /*================================================================================*/
    /*                                Grupare                                         */
    /*================================================================================*/

    $("#ddGrupare").change(function () {
        var groupingName = $(this).val();
        url = $("#list2").jqGrid('getGridParam','url');
        url = url+"&ddGrupare="+groupingName;
        jQuery("#list2").jqGrid('setGridParam',{url:url});
         if (groupingName != '-1') {
            $("#list2").jqGrid('groupingGroupBy', groupingName);
            $("thead").first().hide();

         }else{
            $('#list2').jqGrid('groupingRemove');
            $("thead").first().show();
        } 
         jQuery("#list2").trigger("reloadGrid");    
    });

如何在jQgrid中分组后刷新网格？

1 个答案: