1
Help for ParamQuery Pro / Re: Data Loading taking long time
« on: November 01, 2017, 07:05:12 pm »
Most of the data is read only - can you suggest how to do chunks of data?
ParamQuery Grid
Show Posts
This section allows you to view all posts made by this member. Note that you can only see posts made in areas you currently have access to.
2
Help for ParamQuery Pro / Re: Data Loading taking long time
« on: October 30, 2017, 11:38:05 pm »
This is my obj and i do have Virtual mode on
var obj = {
dataModel: dataModel,
width: "100%",
height: 425,
copy: false,
virtualX: true,
virtualY: true,
fillHandle: 'vertical',
filterModel: { type: 'local', header: true },
pageModel: { type: 'local', rPP: 800, rPPOptions: [800, 1600] },
scrollModel: { lastColumn: null },
colModel: columns,
editModel: {
clicksToEdit: 1
},
selectionModel: { column: true },
numberCell: false,
freezeCols: 1,
resizable: true,
// For Auto Save Functionality //
change: function (evt, ui)
{
if (ui.source == 'commit' || ui.source == 'rollback') {
return;
}
var rowList = ui.rowList,
addList = [],
// recIndx = grid.option('dataModel').recIndx,
deleteList = [],
updateList = [];
for (var i = 0; i < rowList.length; i++) {
var obj = rowList,
rowIndx = obj.rowIndx,
newRow = obj.newRow,
type = obj.type,
rowData = obj.rowData;
if (type == 'update') {
var valid = grid.isValid({ rowData: rowData, allowInvalid: true }).valid;
if (valid) {
var jsonstring = { ..... };
updateList.push(jsonstring);
}
}
}
if (updateList.length)
{
var allvalues = { items: updateList }
$.ajax({
url: url,
//data: JSON.stringify(allvalues),
data: JSON.stringify({ allvalues: allvalues, }),
dataType: "json",
type: "POST",
contentType: 'application/json; charset=utf-8',
async: true,
beforeSend: function (jqXHR, settings) {
$(".saving", grid).show();
},
success: function (changes) {
var state = grid.saveState({ save: false });
saveState(state);
//commit the changes.
//grid.commit({ type: 'update', rows: changes.updateList });
},
complete: function () {
$(".saving", grid).hide();
}
});
}
},
create: function (evt, ui) {
loadState(this);
},
toolbar: {
items: [
{
type: 'select',
cls: 'columnSelector',
attr: "multiple='multiple'", style: "height:60px;",
options: function (ui) {
var CM = this.getColModel(),
opts = [];
for (var i = 0; i < CM.length; i++) {
var obj = {},
column = CM;
//if (column.cls != "default") {
obj[column.dataIndx] = column.title;
//}
opts.push(obj);
}
return opts;
},
listener: function (evt) {
var selectedarray = [];
var newCM = [];
//get array of sel ected options in select list.
var arr = $(evt.target).find("option:selected").map(function () {
return this.value;
}).get(),
CM = this.getColModel();
//newCM.push(ColSelectorVals);
for (var i = 0; i < CM.length; i++) {
var column = CM;
// if (column.cls != "default") {
column.hidden = ($.inArray(dataIndx, arr) === -1);
// }
if (!($.inArray(CM.dataIndx, ColSelectorVals) === -1)) {
newCM.push(column);
}
}
for (var i = 0; i < CM.length; i++) {
var column = CM,
dataIndx = column.dataIndx;
// if (column.cls != "default") {
//hide the column if not a selected option.
column.hidden = ($.inArray(dataIndx, arr) === -1);
// }
if ($.inArray(CM.dataIndx, ColSelectorVals) === -1) {
newCM.push(column);
}
}
this.option("colModel", newCM); // Changing the colmodel to refelect new colmodel i.e., to add columsn at the end not how they are defined.
var CM = this.getColModel(),
selopts = [];
for (var i = 0; i < CM.length; i++) {
var column = CM;
if (column.hidden !== true) {
selopts.push(column.dataIndx);
}
}
ColSelectorVals = selopts.slice(0);// Making the newly selected columns to stay where they are i.e., any new columns will be added at the end not.
this.option("colModel", this.option("colModel")); //refresh the colModel.
this.refresh();
var state = this.saveState({ save: false });
saveState(state);
}
}]
},
columnOrder: function (event, ui) {
var state = this.saveState({ save: false });
saveState(state);
}
var obj = {
dataModel: dataModel,
width: "100%",
height: 425,
copy: false,
virtualX: true,
virtualY: true,
fillHandle: 'vertical',
filterModel: { type: 'local', header: true },
pageModel: { type: 'local', rPP: 800, rPPOptions: [800, 1600] },
scrollModel: { lastColumn: null },
colModel: columns,
editModel: {
clicksToEdit: 1
},
selectionModel: { column: true },
numberCell: false,
freezeCols: 1,
resizable: true,
// For Auto Save Functionality //
change: function (evt, ui)
{
if (ui.source == 'commit' || ui.source == 'rollback') {
return;
}
var rowList = ui.rowList,
addList = [],
// recIndx = grid.option('dataModel').recIndx,
deleteList = [],
updateList = [];
for (var i = 0; i < rowList.length; i++) {
var obj = rowList,
rowIndx = obj.rowIndx,
newRow = obj.newRow,
type = obj.type,
rowData = obj.rowData;
if (type == 'update') {
var valid = grid.isValid({ rowData: rowData, allowInvalid: true }).valid;
if (valid) {
var jsonstring = { ..... };
updateList.push(jsonstring);
}
}
}
if (updateList.length)
{
var allvalues = { items: updateList }
$.ajax({
url: url,
//data: JSON.stringify(allvalues),
data: JSON.stringify({ allvalues: allvalues, }),
dataType: "json",
type: "POST",
contentType: 'application/json; charset=utf-8',
async: true,
beforeSend: function (jqXHR, settings) {
$(".saving", grid).show();
},
success: function (changes) {
var state = grid.saveState({ save: false });
saveState(state);
//commit the changes.
//grid.commit({ type: 'update', rows: changes.updateList });
},
complete: function () {
$(".saving", grid).hide();
}
});
}
},
create: function (evt, ui) {
loadState(this);
},
toolbar: {
items: [
{
type: 'select',
cls: 'columnSelector',
attr: "multiple='multiple'", style: "height:60px;",
options: function (ui) {
var CM = this.getColModel(),
opts = [];
for (var i = 0; i < CM.length; i++) {
var obj = {},
column = CM;
//if (column.cls != "default") {
obj[column.dataIndx] = column.title;
//}
opts.push(obj);
}
return opts;
},
listener: function (evt) {
var selectedarray = [];
var newCM = [];
//get array of sel ected options in select list.
var arr = $(evt.target).find("option:selected").map(function () {
return this.value;
}).get(),
CM = this.getColModel();
//newCM.push(ColSelectorVals);
for (var i = 0; i < CM.length; i++) {
var column = CM;
// if (column.cls != "default") {
column.hidden = ($.inArray(dataIndx, arr) === -1);
// }
if (!($.inArray(CM.dataIndx, ColSelectorVals) === -1)) {
newCM.push(column);
}
}
for (var i = 0; i < CM.length; i++) {
var column = CM,
dataIndx = column.dataIndx;
// if (column.cls != "default") {
//hide the column if not a selected option.
column.hidden = ($.inArray(dataIndx, arr) === -1);
// }
if ($.inArray(CM.dataIndx, ColSelectorVals) === -1) {
newCM.push(column);
}
}
this.option("colModel", newCM); // Changing the colmodel to refelect new colmodel i.e., to add columsn at the end not how they are defined.
var CM = this.getColModel(),
selopts = [];
for (var i = 0; i < CM.length; i++) {
var column = CM;
if (column.hidden !== true) {
selopts.push(column.dataIndx);
}
}
ColSelectorVals = selopts.slice(0);// Making the newly selected columns to stay where they are i.e., any new columns will be added at the end not.
this.option("colModel", this.option("colModel")); //refresh the colModel.
this.refresh();
var state = this.saveState({ save: false });
saveState(state);
}
}]
},
columnOrder: function (event, ui) {
var state = this.saveState({ save: false });
saveState(state);
}
3
Help for ParamQuery Pro / Data Loading taking long time
« on: October 30, 2017, 10:49:45 pm »
Hi,
Have 1000 rows and 129 columns. if i load 350 rows it it taking 3 sec but more than that it is taking long time.(20-30 sec)
SQL - 500 ms - so no issue there. I think the problem is - long json taking time in datamodel.
Any thoughts?
How do we load chunks of data and append later?
Have 1000 rows and 129 columns. if i load 350 rows it it taking 3 sec but more than that it is taking long time.(20-30 sec)
SQL - 500 ms - so no issue there. I think the problem is - long json taking time in datamodel.
Any thoughts?
How do we load chunks of data and append later?
4
Bug Report / Re: Do not show selected options but show default
« on: October 12, 2017, 07:53:21 am »
Well, This didn't quite fix the problem
because when we refresh the page - i can still check the boxes
fixed it
because when we refresh the page - i can still check the boxes
fixed it
5
Help for ParamQuery Pro / AutoSave State?
« on: October 12, 2017, 07:35:41 am »
Hi,
Is there a way to save the state automatically when columns are shown/hidden and/or when columns are dragged?
Is there a way to save the state automatically when columns are shown/hidden and/or when columns are dragged?
6
Help for ParamQuery Pro / Fill for select list
« on: October 11, 2017, 11:47:19 pm »
Hi ,
I have a select list with an Id mapped to different column similar to what you have in demo.
https://paramquery.com/pro/demos33/datamap
in this demo: select 1 from column A - column b,c,d populate
Now fill the 2nd row,3rd row with 1st row in column A - column A get populated for both rows but not b,c
Any solution?
I have a select list with an Id mapped to different column similar to what you have in demo.
https://paramquery.com/pro/demos33/datamap
in this demo: select 1 from column A - column b,c,d populate
Now fill the 2nd row,3rd row with 1st row in column A - column A get populated for both rows but not b,c
Any solution?
7
Help for ParamQuery Pro / LoadState from database not working in IE but works in chrome
« on: September 29, 2017, 02:23:37 am »
Please tell me what is wrong - it works fine in chrome but not in IE.
In Create : I have loadStateSuccess = loadState(this); and the function that loads data from db is below:
function loadState(grid) {
$.ajax({
url:url
data: params,
type: 'GET',
dataType: 'json',
success: function (json) {
if (json.data != null)
{
var colModel = json.data;
grid.loadState({ state: colModel });
}
},
error: function (xhr, status) {
},
complete: function (xhr, status) {
}
});
}
In Create : I have loadStateSuccess = loadState(this); and the function that loads data from db is below:
function loadState(grid) {
$.ajax({
url:url
data: params,
type: 'GET',
dataType: 'json',
success: function (json) {
if (json.data != null)
{
var colModel = json.data;
grid.loadState({ state: colModel });
}
},
error: function (xhr, status) {
},
complete: function (xhr, status) {
}
});
}
8
Help for ParamQuery Pro / Re: Drag column - not working :(
« on: September 29, 2017, 02:21:13 am »
yes thanks for the confirmation .
9
Help for ParamQuery Pro / Re: Drag column - not working :(
« on: September 27, 2017, 10:43:34 pm »
Thank you 
it worked...
I did not want copy paste allowed in the grid - but all other fields are non-editable so i think it should be fine. Correct?
it worked... I did not want copy paste allowed in the grid - but all other fields are non-editable so i think it should be fine. Correct?
10
Help for ParamQuery Pro / Re: Drag column - not working :(
« on: September 27, 2017, 07:05:04 pm »ex: enter abc in another column , drag it down values are not in the 2nd row
Sorry may be i was using a different term - it is the fill handle - it is not filling the values
11
Help for ParamQuery Pro / Re: Drag column - not working :(
« on: September 27, 2017, 06:42:34 pm »
hi,
yes, i was dragging the entire column which has select lists
https://jsfiddle.net/ragorantla/0gq6eg45/
Please let me know if it works
yes, i was dragging the entire column which has select lists
https://jsfiddle.net/ragorantla/0gq6eg45/
Please let me know if it works
12
Help for ParamQuery Pro / Drag column - not working :(
« on: September 27, 2017, 02:11:30 am »
Hi,
Have a select list in my colmodel and i want that to be draggable - please let me knwo what am i missing
here is my colmodel:
{
title: "Companyname", dataIndx: "Companyname", width: 100, draggable: true,
editor: {
type: 'select',
valueIndx: "value",
labelIndx: "text",
options: [],
mapIndices: { "text": "Companyname", "value": "CompanyId" }
},
validations: [{ type: 'minLen', value: 1, msg: "Required" }]
,
filter: { type: 'textbox', condition: 'contain', listeners: ['keyup'] }
}
Here is my pqgrid obj:
$("div#grid_showhide_columns").pqGrid({
width: "100%",
height: 425,
dataModel: dataModel,
copy: false,
fillHandle: 'vertical',
filterModel: { type: 'local', header: true }, //on: true, mode: "AND",
pasteModel: { on: false },
scrollModel: { lastColumn: null },
colModel: columns,
editModel: {
clicksToEdit: 1
},
selectionModel: { column: true },
numberCell: false,
freezeCols: 1,
resizable: true
});
Have a select list in my colmodel and i want that to be draggable - please let me knwo what am i missing
here is my colmodel:
{
title: "Companyname", dataIndx: "Companyname", width: 100, draggable: true,
editor: {
type: 'select',
valueIndx: "value",
labelIndx: "text",
options: [],
mapIndices: { "text": "Companyname", "value": "CompanyId" }
},
validations: [{ type: 'minLen', value: 1, msg: "Required" }]
,
filter: { type: 'textbox', condition: 'contain', listeners: ['keyup'] }
}
Here is my pqgrid obj:
$("div#grid_showhide_columns").pqGrid({
width: "100%",
height: 425,
dataModel: dataModel,
copy: false,
fillHandle: 'vertical',
filterModel: { type: 'local', header: true }, //on: true, mode: "AND",
pasteModel: { on: false },
scrollModel: { lastColumn: null },
colModel: columns,
editModel: {
clicksToEdit: 1
},
selectionModel: { column: true },
numberCell: false,
freezeCols: 1,
resizable: true
});
13
Bug Report / Re: Do not show selected options but show default
« on: August 30, 2017, 12:07:57 am »
Great,thank you.. We only have one currently .
14
Bug Report / Re: Do not show selected options but show default
« on: August 25, 2017, 05:58:14 pm »
Do you see any issues with the fix that i have?
15
Bug Report / PQSelect- You shouldn't be able to check more than the max
« on: August 25, 2017, 01:38:42 am »
Hi,
I think i found a solution to this problem. Solution : when you reach the maximum selection s- i am disabling all other options which are not selected,and when you uncheck an option - they will get enabled again
Below is my code. If you think this causes any issue - please let me know.
$sel.pqSelect({
checkbox: true,
multiplePlaceholder: 'Select/Unselect columns',
maxDisplay: 100,
width: 'auto',
maxSelect: 20, maxDisplay: 0,
displayText: "Select/Unselect Columns",
//deselect: false,
search: true,
}).on("pqselectmaxselectreach", function (event, ui) {
$("label[id^=pq-option]").find('input:not(:checked)').attr('disabled', 'disabled');
})
.on("change", function (event) {
var length = 20;
if ($(this).find("option:selected").length < length) {
$("label[id^=pq-option]").find('input[type="checkbox"]').removeAttr('disabled');
}
});
Thanks!
I think i found a solution to this problem. Solution : when you reach the maximum selection s- i am disabling all other options which are not selected,and when you uncheck an option - they will get enabled again
Below is my code. If you think this causes any issue - please let me know.
$sel.pqSelect({
checkbox: true,
multiplePlaceholder: 'Select/Unselect columns',
maxDisplay: 100,
width: 'auto',
maxSelect: 20, maxDisplay: 0,
displayText: "Select/Unselect Columns",
//deselect: false,
search: true,
}).on("pqselectmaxselectreach", function (event, ui) {
$("label[id^=pq-option]").find('input:not(:checked)').attr('disabled', 'disabled');
})
.on("change", function (event) {
var length = 20;
if ($(this).find("option:selected").length < length) {
$("label[id^=pq-option]").find('input[type="checkbox"]').removeAttr('disabled');
}
});
Thanks!