How to detect LoadComplete from an other element?

Question

I would like to call a function thanks to a jquery event handler. My trigger is the search the user make on my datagrid (navgrid). I think the best option is to use someting.on("click", function(){}) were "something" represent the search button. My probleme is that I can't figure out how to call this search button. Then, can we add a balise to this button or is there an other option?

PS: LoadComplete does't work here because I can't acces the functions I want to trigger from my grid.

Sorry, but your question isn't clear enough. To display Searching Dialog you can call `$("#gridid").jqGrid("searchGrid");` or `$("#gridid").jqGrid("searchGrid", {searchOnEnter: true, closeOnEscape: true, closeAfterSearch: true, closeAfterReset: true, multipleGroup: true, multipleSearch: true});` - it's just an example of some options. You can specify any callbacks of the searching dialog in the same way like the options. — Oleg, Apr 21 '16 at 14:31

score 0 · Answer 1 · answered Apr 21 '16 at 14:23

0

in html you must have thometing like this

<button class="btn" type="submit">Click me</button>

and in JS (if you are using jQuery)

$('.btn').on("click", function() {
    alert('do something here');
});

answered Apr 21 '16 at 14:23

Andrew Evt

3,613
1
19
35

score 0 · Answer 2 · answered Apr 21 '16 at 16:15

0

I'm not sure that I correctly understand your question. To display Searching Dialog you can call

$("#grid").jqGrid("searchGrid");

or

$("#grid").jqGrid("searchGrid", {
    searchOnEnter: true,
    closeOnEscape: true,
    closeAfterSearch: true,
    closeAfterReset: true,
    multipleGroup: true,
    multipleSearch: true
});

it's just an example of some options. You can specify any callbacks of the searching dialog in the same way like the options.

If you really need just click on the Search button of the navigator bar, than you need to know that the id of the button have "search_" follow the grid id. If you have, for example, grid with id="grid" then you can use:

$("#search_grid").click();

answered Apr 21 '16 at 16:15

Oleg

220,925
34
403
798

My question was actually just about the search button. The id "search_" works well but doesn't match with my exprctiation because happens before the search. Does the same ID exists for the button "find" and "reset"? – Pierre GUILLAUME Apr 25 '16 at 07:48
@PierreGUILLAUME: I'm not sure what you want to implement. The buttons Find and Reset exist *only after you opens the Search Dialog*. When you want to click there? The user should set the filter first before clicking on the Find button. One can just set/delete manually `postData.filters` and trigger reloadGrid to Find or for Reset. No dialog is required. – Oleg Apr 25 '16 at 07:55
I create interactions between a grid and some charts. My aim is to update charts when I set up a filter in my grid. But I don't want to reload all the charts because I'm using js transition. That's why I want to detect the end of search and the id of the search button. The search button is not created at the beginning of the programm but the click event supports a such action. (when you give him the name of the futur id) – Pierre GUILLAUME Apr 25 '16 at 08:10
@PierreGUILLAUME: I still not sure what you do. Who is choosing the filter? The user? What you mean under "I set up a filter in my grid."? Do you set manually `filters` property of the `postData` option of jqGrid? I don't wrote about reloading of "all the charts". I wrote about reloading of *the grid*. You asked about the button "find" and "reset". Clicking on the buttons changes `postData.filters` and trigger reloadGrid. You can use `loadComplete` callback to detect that the grid is reloaded. – Oleg Apr 25 '16 at 08:21
I used "I" but I mean "the user", I don't want to change the filters programmatically...sorry. How can I use load complete? this doesn't work : $("#jqGrid").jqGrid({ loadComplete: function() { alert ("hello"); } }); – Pierre GUILLAUME Apr 25 '16 at 08:40
@PierreGUILLAUME: First of all you should post **the code which you use to create the grid**. You can just include `loadComplete` in the list of options *during creating the grid*. There are other possibilities. It's important to know which version of jqGrid you use and from which fork of jqGrid. – Oleg Apr 25 '16 at 08:42
I've already typed this loadComplete method but I won't be able to detect a change from other function, will I? – Pierre GUILLAUME Apr 25 '16 at 10:04
@PierreGUILLAUME: Then you "typed" it on the wrong place or you made some other error. I repeat that you should post the JavaScript, which you use to create the grid. – Oleg Apr 25 '16 at 10:10
What is in "loadComplete" works but I can't detect the change from other functions... – Pierre GUILLAUME Apr 25 '16 at 10:16
@PierreGUILLAUME: Sorry, but what exactly you can't detect and from which other functions. By the way, I recommend you to replace the current code from `loadComplete` to `rowattr`. It will work much more quickly. See [the answer](http://stackoverflow.com/a/10531680/315935) for the code example. – Oleg Apr 25 '16 at 12:39
I have one fonction per chart and until there, I used in each function : $("#chart1").on("click", funtion.....) I wanted to do the same for an other element : my grid $("#grid").on("click", funtion.....) The difference is that actions occured on click event for my charts and on search event for the grid. (Then I wanted a clicked event on the button "find") – Pierre GUILLAUME Apr 25 '16 at 14:35
@PierreGUILLAUME: I asked you **multiple time** to post JavaScript code and you *explain about the code* instead. One can't debug the code in the way. You post only parts which *you* find important, but you don't enough understand how all works (sorry) and thus you skip some parts which are really important and repeat multiple time not important or wrong (or at least bad) parts of your code. It's not good to register more and more event handles. jqGrid registers automatically `click` handler. It makes some additional tests, do something and calls `beforeSelectRow` and then `onCellSelect`. – Oleg Apr 25 '16 at 15:02
@PierreGUILLAUME: You write about charts which have no relation with jqGrid. It's important only to know whether you need to refresh (to change) some charts if jqGrid content is changed or some other events take place in jqGrid. For all the case there are different callbacks in jqGrid. So it's important to understand **when** (on what events) you need to do something. As the result you will need to use the corresponding callbacks of jqGrid. Some clicks like click on Reset button then jqGrid calls `onReset` callback first of all then clear the filter and reload the grid. `loadComplete` is final – Oleg Apr 25 '16 at 15:13
@PierreGUILLAUME: There are a lot of other callbacks. The main goal of `onReset` is to do somethething, have to be done *before* starting reloading. Additionally `onReset` can *stop* reseting/reloading by returning `false`. If I correctly understand what you want to implement, then you don't need to stop Rest and what you need to do must be not *before* reloading. Thus I suggestion you to use `loadComplete`. I suppose that you should update Chart every time in the content of the grid is changed. `loadComplete` is the good place for it. – Oleg Apr 25 '16 at 15:17
I thought that you wanted just the code of my grid...sorry. Then I created a programm that reproduce my problem : https://jsfiddle.net/np1gh5pm/ – Pierre GUILLAUME Apr 26 '16 at 08:39
It's not so conventionnal, I put the database in the HTML block because I didn't find how to add an external json file. I hope it will make my problem clearer. My aim is to detect in the function "display" when the user add a new filter thanks to the navgrid, to appy a transition – Pierre GUILLAUME Apr 26 '16 at 08:42
1

@PierreGUILLAUME: Probably http://jsfiddle.net/OlegKi/np1gh5pm/6/ is more close to what you want to demonstrate. What is your question? What you want to do in the code in which situation. Can you describe step by step scenario? – Oleg Apr 26 '16 at 09:41
Now: when the user click on the treemap, the treemap zooms and the grid adapt itself : the grid and the treemap show the same elements. When the user enter a filter, the grid adapt (perfect) but the treemap doesn't move. Expectation: I want to find a solution to trigger the treemap transition after the user search, to reperesent the same data in the grid and in the treemap. – Pierre GUILLAUME Apr 26 '16 at 09:54
@PierreGUILLAUME: I don't work with d3 myself, but what you probably try to implement is some call which refresh the treemap inside of `loadComplete`, like in http://jsfiddle.net/OlegKi/np1gh5pm/8/ – Oleg Apr 26 '16 at 10:17
Is there any way to recognize that the load is completed from the display function? – Pierre GUILLAUME Apr 26 '16 at 10:24
I'll see if I can do everything from loadComplete but I have a lot of charts, that's why I'd prefer an other solution... but thanks a lot for trying and for your help – Pierre GUILLAUME Apr 26 '16 at 10:26
@PierreGUILLAUME: You are welcome! I don't understand what you mean with "I have a lot of charts". If you want that some *specific* chart will be updated on changing of *specific* grid then you can do this. You should just more exactly formulate *when* (in which situation) you need to do the update and in which not. For example you could need not updating the chart on paging, but updating of filtering. It was my original question: you have to formulate the exact criteria what should be made in outside of the grid on some specific events inside of the grid. – Oleg Apr 26 '16 at 10:41
On the fiddle is just one treemap, on my code there are other charts, that make the code more complex. And to answer your question, I need to update my charts on filtering and on refresh (but for refresh I used $("refresh_grid").on("click", function..... ) – Pierre GUILLAUME Apr 26 '16 at 10:54
@PierreGUILLAUME: You should forget `$("refresh_grid").on("click,,,)`. Do you need to update some charts *before* refreshing or *after* refreshing? Refresh is the button added by `navGrid`. It have for example `beforeRefresh` and `afterRefresh` callbacks which you can specify on the same place where you specify `refresh: true`: `refresh: true, beforeRefresh: function () { alert("in beforeRefresh");}, afterRefresh: function () { alert("in afterRefresh");} ` – Oleg Apr 26 '16 at 10:59

score 0 · Accepted Answer · answered Apr 26 '16 at 13:34

Problem :http://jsfiddle.net/OlegKi/np1gh5pm/6/ Click on the treemap actualize the grid but filtering the grid doesn't affect the treemap

Solution :

Finally I used a div with display none and print on it the Filter on LoadComplete thanks to :

document.getElementById("change").innerHTML=$("#jqGrid").getGridParam("postData").filters;

then, I observe the change of the balise thanks to :

$('#change').bind("DOMSubtreeModified",function(){
    //block code
});

Then I don't observe directly the end of reload of my grid but an event created by the grid...quite the same!

How to detect LoadComplete from an other element?

3 Answers3