Author Topic: Get the selected coulmns list on button click event without the column selector  (Read 2474 times)

fuljoyment

  • Pro Ultimate
  • Newbie
  • *
  • Posts: 14
    • View Profile
Hello Admin,

I have created a pivot grid with 50 columns. After initial loading I have selected some specific columns with menuIcon.

Here I need to know,
  • How to get the selected/customized coulmns list on button click event from selecting the columns from menuIcon? (These are the columns after selecting from menuUI - Icon)
  • How to store the entire pivoted grid information(like: colModel, groupModel, dataModel...etc) after customizing the columns data and recreate/reload the existing grid with this stored grid information?

Please provide a demo or guide me how to achieve this because this is an urgent requirement for us.

PS:-I am using ParamQuery Pro v6.2.4 in my ASP.net MVC project.

Thanks in advance,

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
1. Selected columns in header menu are visible columns.

So they can be obtained as an array collection.

Code: [Select]
var visibleColumns = grid.getColModel().filter(function(col){
  return !col.hidden
})

2. Entire grid state is saved by grid.saveState() and restored by grid.loadState() methods:

Example: https://paramquery.com/pro/demos/grid_state

fuljoyment

  • Pro Ultimate
  • Newbie
  • *
  • Posts: 14
    • View Profile
Hi,

Thank you for the quick response.  Now I am able to get the selected columns from the menuUI-Icon.

But as you suggested when I used grid.saveState() it will not stores the customized columns data instead it stores the grid information which was loaded initially.

Here after selecting specific columns (let us say 5 columns) from the menuUI - Icon, I want to store that grid information instead of its initial state which is having 30 columns data. 

Please suggest me is there any event/method to get that customized grid data. 

Our requirement is to store that customized pivoted grid information as a string in Database and re-create/update the grid with the remote data.

Thank you,

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Quote
Please suggest me is there any event/method to get that customized grid data.

Current grid state is returned by grid.saveState({save: false})

https://paramquery.com/pro/api#method-saveState

How much Information is stored in state can be further fine tuned by 2 options: stateKeys and stateColKeys

https://paramquery.com/pro/api#option-stateKeys

----------------

The hidden columns are also stored in the state by design. It doesn't cause any issue because that's used by loadState to restore the visible columns as visible and hidden columns as hidden again.

Following is the state for the pivot example: https://paramquery.com/pro/demos/pivot after hiding all the grouped columns in the pivot view.

Code: [Select]
{
type: 'button',
                        label: "Get state",                       
                        listener: function (evt) {         
debugger
var state = JSON.parse( this.saveState({save: false}) );
                        }
}

Code: [Select]
{
  "colModel": [
    {
      "dataIndx": "grp",
      "width": 167,
      "filter": {}
    },
    {
      "dataIndx": "country",
      "width": 120,
      "filter": {},
      "hidden": true
    },
    {
      "dataIndx": "sport",
      "width": 110,
      "filter": {},
      "hidden": true
    },
    {
      "dataIndx": "2000_gold",
      "width": 78,
      "hidden": true
    },
    {
      "dataIndx": "2000_silver",
      "width": 85,
      "hidden": true
    },
    {
      "dataIndx": "2000_bronze",
      "width": 94,
      "hidden": true
    },
    {
      "dataIndx": "2000_total",
      "width": 79,
      "hidden": true
    },
    {
      "dataIndx": "2002_gold",
      "width": 78,
      "hidden": true
    },
    {
      "dataIndx": "2002_silver",
      "width": 85,
      "hidden": true
    },
    {
      "dataIndx": "2002_bronze",
      "width": 94,
      "hidden": true
    },
    {
      "dataIndx": "2002_total",
      "width": 79,
      "hidden": true
    },
    {
      "dataIndx": "2004_gold",
      "width": 78,
      "hidden": true
    },
    {
      "dataIndx": "2004_silver",
      "width": 85,
      "hidden": true
    },
    {
      "dataIndx": "2004_bronze",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2004_total",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2006_gold",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2006_silver",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2006_bronze",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2006_total",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2008_gold",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2008_silver",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2008_bronze",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2008_total",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2010_gold",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2010_silver",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2010_bronze",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2010_total",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2012_gold",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2012_silver",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2012_bronze",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "2012_total",
      "width": 100,
      "hidden": true
    },
    {
      "dataIndx": "aggr_gold",
      "width": 100
    },
    {
      "dataIndx": "aggr_silver",
      "width": 100
    },
    {
      "dataIndx": "aggr_bronze",
      "width": 100
    },
    {
      "dataIndx": "aggr_total",
      "width": 100
    }
  ],
  "datestamp": 1581526594000,
  "height": 500,
  "width": "auto",
  "freezeRows": 0,
  "freezeCols": 1,
  "groupModel": {
    "dataIndx": [
      "country",
      "sport"
    ],
    "collapsed": [
      true,
      true
    ],
    "grandSummary": true
  },
  "pageModel": {
    "curPage": 1,
    "rPP": 10
  },
  "sortModel": {
    "sorter": []
  }
}
« Last Edit: February 13, 2020, 12:35:11 pm by paramvir »