[jqwidgetsdevParticipant]

Hello Peter.

Yeah, it looks like I made a typo above.

We are using a single page application and have a need for both jqxGrid.js and jqxTreeGrid.js.
Now, using jqxGrid.js and jqxTreeGrid.js (which depends on jqxDataTable) in concert causes the reported problem.

Best regards.

[jqwidgetsdevParticipant]

Hello Peter.

We are using a single page application and have a need for both jqxgrid.js and jqxdatatable.js.

Please keep me posted on when this issue is resolved.

Thanks for your support.

Season’s Greeting.

[jqwidgetsdevParticipant]

Hello Peter.

Adding jqxdatatable.js causes the reported problem.

What can be done to resolve the problem?

Best regards.

[jqwidgetsdevParticipant]

For the benefit of others the issue was resolved through the help of the following post.

Please note the use of VIRTUAL MODE.

http://www.jqwidgets.com/community/topic/using-virtualmode-with-loadserverdata/

Best regards.

[jqwidgetsdevParticipant]

Anyone please?

Many thanks.

[jqwidgetsdevParticipant]

Hello Dimitar.

Thank you very much for taking the time to provide the example for me. This works like a charm.

Best regards.

[jqwidgetsdevParticipant]

Hello hemant.kalal.

According to the road map the upcoming release of jQWidgets, would introduce a new widget called Tree Grid. I assume this is what you are looking for.

http://www.jqwidgets.com/jquery-widgets-documentation/documentation/roadmap/roadmap.htm

I hope this helps.

Best regards.

[jqwidgetsdevParticipant]

Dear jQWidgets team.

I hit a road bock here. Sorry to ask again but, can you please assist me to resolve the issue I am facing?
Can you please guide me?

Many thanks.

[jqwidgetsdevParticipant]

Hello Peter.

I am still not able to get this to work. Callback loadServerData is just never called.

Does this code make sense?

var source = {
datatype: ‘json’,
datafields: [
{ name: “f1”, type: “string” }
],
localdata: data
};

var dataAdapter = new $.jqx.dataAdapter(source, {
loadComplete: function (data) {
console.log(“loadComplete: “+data);
},

loadServerData: function (serverdata, sourceDeploymentLog, callback) {
console.log(“loadServerData”);

// make AJAX call and update the grid’s data in the Ajax function’s success callback.
}
});

var refreshInterval = setInterval(function () {
$(“#jqxGrid”).jqxGrid(“updatebounddata”);
console.log(“updatebounddata called”);
}, 5000);

Any help is appreciated.

Best regards.

[jqwidgetsdevParticipant]

Hello Peter.

I am trying to understand this better. Thanks for your help. Still some of this is somewhat of a mystery to me. Small steps, please bear with me.

I am trying option 1.

Problem: jqxDataAdapter loadServerData is not getting called.

What calls the jqxDataAdapter loadServerData callback function? Is this perhaps raised by jqxGrid updatebounddata? If not, I miss something in the middle and I do not know what this is.

I do see jqxDataAdapter loadComplete is being called.

var dataAdapter = new $.jqx.dataAdapter(source, {
loadComplete: function (data) {
console.log(“loadComplete: “+data);
},
loadServerData: function (serverdata, source, callback) {
console.log(“loadServerData”);

…….
…….

outputs:

loadComplete: [object Object],[object Object],[object Object]

Is this expected?

Further I have

var refreshInterval = setInterval(function () {
$(“#jqxGrid”).jqxGrid(“updatebounddata”);
console.log(“updatebounddata called”);
}, 5000);

The generated output comes every 5 seconds:

updatebounddata called

Are you please able to point me in the right direction?

Thanks & regards

[jqwidgetsdevParticipant]

Thanks Peter for your response.

Can you please elaborate on your last paragraph I am afraid I do not understand this yet.
As suggested, I have updated the code to call “updatebounddata” within Ajax function’s success callback.

var refreshInterval = setInterval(function () {

var url = ‘mypage’;

$.ajax({
type: ‘POST’,
url: url,
// data: { “data”: JSON.stringify({}) },
contentType: ‘application/json; charset=utf-8′,
// tell to expect JSON in the response, and parse it automatically
datatype: ‘json’,
error: function (request, status, error) {
console.log(‘error=’+error);
console.log(‘error status=’+status);
},
success: function (result) {
console.log(‘result=’+result);
$(“#jqxGrid”).jqxGrid(“updatebounddata”);
}
});
}, 5000);

Best regards.

[jqwidgetsdevParticipant]

Hello.

The issue I am facing is still not resolved. Perhaps if I share code some more code someone can point me in the right direction.

var refreshInterval = setInterval(function () {
// AJAX call will return
// var data = {……};

var url = ‘mypage’;

$.ajax({
type: ‘POST’,
url: url,
// data: { “data”: JSON.stringify({}) },
contentType: ‘application/json; charset=utf-8’,
// tell to expect JSON in the response, and parse it automatically
datatype: ‘json’,
error: function (request, status, error) {
console.log(‘error=’+error);
console.log(‘error status=’+status);
},
success: function (result) {
console.log(‘result=’+result);
}
});
//

var newSource = {
datatype: ‘json’,
datafields: [
{ name: “f1”, type: “string” }
],
localdata: data
};

var newDataAdapter = new $.jqx.dataAdapter(source, {
downloadComplete: function (data, status, xhr) { },
loadComplete: function (data) {
console.log(‘refresh’);

// perform data binding.
newDataAdapter.dataBind();
$(“#jqxGrid”).jqxGrid(“source”, newDataAdapter);
$(“#jqxGrid”).jqxGrid(“updatebounddata”);
},
loadError: function (xhr, status, error) { }
});
}, 60000);

Thanks.

[jqwidgetsdevParticipant]

Thanks Dimitar.

I am still struggling with this one. Can you please take another look?

My objective is to refresh the contents of the grid every minute. The JSON data that populates the list resides in the List variable. To get the updated data, I must re-execute the query and produce the JSON.

var refreshInterval = setInterval(function () {
console.log(‘refresh’);
var List = [(~webactionGetList.Execute~)]; // WebHub’s web action produces the JSON contents to be displayed in the grid.
dataAdapter.dataBind(); // required?
$(“#jqxGrid”).jqxGrid(“updatebounddata”);
}, 60000);

I also tried with explicit data binding, using dataBind(). However, I am not sure if this is required.

Any thoughts on how this can be resolved gracefully?

Thanks.

[jqwidgetsdevParticipant]

I was wondering where my post had gone. Sorry about that.

Best regards.

[jqwidgetsdevParticipant]

Thank Peter. Yes, I see what you mean now.

For the benefit of others, replacing

$(“#jqxWidget”).on(‘mousedown’, function (event) {

with

$(“#jqxListBox1”).on(‘mousedown’, function (event) {

resolves the issue.

Best regards.

[Author]

Posts