0

I have a javascript function in which i receive a value of drop down. function is below:

function SetTemplateId(id) // this method is called on drop down change event
{
      templateId=id;  // template id is global variable

      showjqgrid();  //this method show the Jqgrid
}

ShowJqgrid method is below

function showjqgrid()
{

$("#grid").jqGrid({
    datatype: 'json',
    url: '/Home/DynamicGridData?id='+templateId,

........
}

jqgrid is works fine but the problem is when "setTemplateid" function is called first time it works fine and data is show correctly and after first time when i change drop down value the "setTemplateId" function is called(i checked by alert()) and showgrid is also called but the URL is not invoked. If i destroy jqgrid in "setTemplateId" function then jqgrid is not shownn. If i reload jqgrid then also the data show only first time. I debuged it. Only first time action method is called. After that its not called. What is the problem?

Hiba
  • 231
  • 1
  • 7
  • 23

1 Answers1

1

The reason is very easy. The function showjqgrid convert empty table <table id="grid"></table> in relatively complex structure of divs and tables. After that jqGrid makes request to the url.

So you have two main options (alternatives) to fix the problem:

  • include call of GridUnload method as the first line of showjqgrid. It will destroy the complex structure of divs and tables created previously and reduce there to one empty <table>.
  • you can create grid once. On the next time you should update url parameter using setGridParam and then trigger reloadGrid which will update the content of the grid holding the outer part unchanged.

Additionally I would recommend you to read the old answer which shown how to use postData parameter of jqGrid where the properties are defined as functions. I suppose that templateId which you use as the value of id parameter of url will be evaluated in some way inside of dropdown change event. So you can consider to do this inside of the function defined inside of postData.id. In the case you could use url: '/Home/DynamicGridData and the part ?id='+templateId will be appended by jqGrid.

Community
  • 1
  • 1
Oleg
  • 220,925
  • 34
  • 403
  • 798
  • Kindly give example of setGridParam. I will try this all later because due to some reason my visual studio is crashed. – Hiba Sep 10 '15 at 18:38
  • @Hiba: `$("#grid").jqGrid("setGridParam", {url: newUrl});`. Alternatively you can get **reference** to all jqGrid parameters by usage of `var p = $("#grid").jqGrid("getGridParam");` After that you can change the `url` using the code like `p.url = newUrl;`. No call of `setGridParam` will be required. – Oleg Sep 10 '15 at 18:44
  • It works . But if loadonce is false. Thanks again Oleg. You always help in jqgrid questions. Thank you very much. – Hiba Sep 11 '15 at 16:35
  • @Hiba: If you use `loadonce: true` and you want to reload the data from the *server* then you need just reset `datatype` to `"json"` **before** reloading the grid (`$("#grid").jqGrid("setGridParam", {url: newUrl, dytatype: "json"}).trigger("reloadGrid");` or `var p = $("#grid").jqGrid("getGridParam"); p.url = newUrl; p.dytatype = "json"; $("#grid").trigger("reloadGrid");`). So all works in the same way. You need just know that jqGrid changes `datatype` to `"local"` after the first loading from the server. – Oleg Sep 11 '15 at 18:02