Messages

1

Help for ParamQuery Grid (free version) / Re: I am trying to use both column show/hide and grouping in a page.

« on: February 20, 2014, 03:54:21 pm »

@paramquery
hi Admin,
              i am using  data from a dynamic table hide/show of column working for me, i also want use grouping of data with that please help me out from this.

Thanks.

my code Sample is Here: I used  groupModel: { dataIndx:[0],sorting: "local", location: "local" } for this but its not working for me.


var obj = j$.paramquery.tableToArray(tbl);
    var newObj = { width: 1048, height: 350, numberCell: true, title: false, sortable: true,
                    freezeCols: 3, resizable: true, selectionModel: { type: 'cell', mode: 'block' },
                    editModel: {clicksToEdit:2},
                     flexHeight: true,
        flexWidth: true
        };
   obj.colModel = [{title: "Resources", width: 100, dataType: "String"},
                      { title: "Supplier", width: 100, dataType: "string"},
                      { title: "Cost Type", width: 100, dataType: "string"},
                      { title: "Project", width: 90, dataType: "String" },
                      { title: "Item", width: 80, dataType: "String" },
                      { title: "Unit", width: 70, dataType: "String" },
                      { title: "Mon", width: 20, dataType: "Integer" },
                      { title: "Tue", width: 20, dataType: "Integer" },
                      { title: "Wed", width: 20, dataType: "Integer" },
                      { title: "Thus", width: 20, dataType: "Integer" },
                      { title: "Fri", width: 20, dataType: "Integer" },
                      { title: "Sat", width: 20, dataType: "Integer" },
                      { title: "Sun", width: 20, dataType: "Integer" },
                      { title: "Total", width: 20, dataType: "Integer" },
                      { title: "Costs", width: 20, dataType: "Integer" }       
                  ];
                 
    newObj.dataModel = { data: obj.data, sortIndx: 0,sorting: "local", location: "local" ,groupModel: {
                                                                                             dataIndx:[0],sorting: "local", location: "local" }};
    newObj.colModel = obj.colModel;
    dataMobile =  newObj.dataModel;
    var j$grid = j$("#grid_showhide_columns").pqGrid(newObj);
 
    //menu with checkbox images.
    j$.each(newObj.colModel, function (i, col) {
        //var src = '/Content/images/checkbox-checked.png';                       
        var cls = 'pq-sh-checkbox pq-sh-checkbox-checked';
        if (col.hidden) {
            cls = 'pq-sh-checkbox';
        }
        if((col.title != "Resources") && (col.title != "Mon") &&  (col.title != "Tue") &&  (col.title != "Wed") &&  (col.title != "Thus") &&  (col.title != "Fri") &&  (col.title != "Sat") &&  (col.title != "Sun"))
         j$(".menu_cols").append("<li><input type='checkBox' style='float:left;' checked/><a href='#'><span class='" + cls + "'></span> " + col.title + "</a></li>");
         else
         j$(".menu_cols").append("<li style='display:none;'><input type='checkBox' style='float:left;display:none;' checked/><a href='#'><span class='" + cls + "'></span> " + col.title + "</a></li>");
     
    });
 
    j$(".menu_cols").menu({ select: function (evt, ui) {
        var indx = j$(ui.item).index();
 
        var colM =j$grid.pqGrid("option", "colModel");
        if (colM[indx].hidden == true) {
            colM[indx].hidden = false;
            console.log(ui.item);
            j$(ui.item).find("span").addClass("pq-sh-checkbox-checked");
             j$(ui.item).find("input").attr("checked","checked");
        }
        else {
            colM[indx].hidden = true;
            j$(ui.item).find("span").removeClass("pq-sh-checkbox-checked");
            j$(ui.item).find("input").removeAttr("checked","checked");
        }
       j$grid.pqGrid("option", "colModel", colM);
       evt.preventDefault();
       return false;
    }
    });

2

Help for ParamQuery Grid (free version) / I am trying to use both column show/hide and grouping in a page.

« on: February 20, 2014, 01:34:31 pm »

I am trying to use both column show/hide and grouping in a page. but its not wokring. Any idea how can I get it done.