ParamQuery grid support forum

General Category => Help for ParamQuery Pro => Topic started by: queensgambit9 on February 14, 2020, 03:47:13 pm

Title: Reload tab
Post by: queensgambit9 on February 14, 2020, 03:47:13 pm

Trying to reload active tab when clicking on title in grid...use onclick in title definition or is there a better way?

Title: Re: Reload tab
Post by: paramvir on February 14, 2020, 09:34:31 pm

Please help me understand your requirement.

May I know what's the content of tab and what do you mean by "reload tab" and how do you do it?

Title: Re: Reload tab
Post by: queensgambit9 on February 25, 2020, 03:21:01 pm

Using jQuery tabs and on each tab the title is clickable. When the user clicks the title I would like to reload grid in that tab (stay in the tab but grid is reloaded).

Title: Re: Reload tab
Post by: paramvir on February 25, 2020, 03:56:59 pm

Click on a tab's title activates the corresponding panel and fires activate event.

Hence tab's activate event can be used to reload the grid in corresponding panel.

Code: [Select]

        $("#tabs").tabs({
            activate: function (evt, ui) {
                ui.newPanel.find(".pq-grid").pqGrid('refreshDataAndView');
            }
        });


Title: Re: Reload tab
Post by: queensgambit9 on February 25, 2020, 06:35:42 pm

It is the grid title and not the tab title. Sorry for being unclear.

Title: Re: Reload tab
Post by: queensgambit9 on February 26, 2020, 03:30:52 pm

Ex:

Code: [Select]

title: "<a href='index.php#tab1'>test</a>"
But that doesn't seem to work...

Title: Re: Reload tab
Post by: paramvir on February 26, 2020, 03:56:21 pm

It it's grid title, then it's nothing to do with tabs.

Please use this to reload grid when its title is clicked.

Code: [Select]

$( selector ).find(".pq-grid-title").click(function(){
$(this).closest(".pq-grid").pqGrid('refreshDataAndView');
})


Title: Re: Reload tab
Post by: queensgambit9 on February 26, 2020, 05:34:31 pm

Thanks, using:

Code: [Select]

create: function() {
 
    $( '#grid1' ).find(".pq-grid-title").click(function(){
$(this).closest(".pq-grid").pqGrid('refreshDataAndView');
})...

Do not work as I would like it to...grid in current tab should reloaded to its initial state...with above code columns are not restored, filters not removed etc.
Is it correct to use it in create event?

Title: Re: Reload tab
Post by: paramvir on February 27, 2020, 10:26:10 am

Please share your complete requirements along with jsfiddle.

Title: Re: Reload tab
Post by: queensgambit9 on February 27, 2020, 03:28:25 pm

https://jsfiddle.net/queensgambit9/g4h0mory/12/

When I click grid title 'test' in Tab 1 I would like to load a state called 'test'.

Title: Re: Reload tab
Post by: paramvir on February 27, 2020, 08:43:55 pm

your create event would be

Code: [Select]

create: function() {
      var grid = this;
      $('#grid1').find(".pq-grid-title").click(function() {
        var state = localStorage.getItem(prefix(grid) + 'test');
        grid.loadState({
          state: state
        })                   
      })
      refreshToolbar(grid)
    }

https://jsfiddle.net/81Ltrg25/

Title: Re: Reload tab
Post by: queensgambit9 on February 28, 2020, 01:52:53 pm

Thank you, works fine.