jQWidgets Forums
jQuery UI Widgets › Forums › Grid › Set cell (not column) specific editor
This topic contains 9 replies, has 3 voices, and was last updated by ioana 11 years, 8 months ago.
-
Author
-
Hi,
is it possible to set a specific editor pro cell, and not pro column?
Assuming that not all cells in a column have the same type.Thanks,
IoanaHi,
That is currently not supported functionality. We will implement it in a future version.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com/Hi again,
could you please let me know for which future version (approximately release date) can we expect this functionality?
Thank you
Ioana
Hi Ioana,
The feature will be most probably available by the end of August with the release of ver. 3.0
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com/Sounds good, thank you.
Regards,
IoanaHi,
do you have some more details about the planned features for 3.0? We have the requirement for a “real grid” i.e. a spreadsheet like component, that is: Cells need to be first class citizens inside the grid. Potentially it should be possible to configure each cell individually with different data types and different editors. Is this something v3.0 can address?
Kind regards,
ArthurHi Arthur,
Different cell data types is not in our plans.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com/Hi Peter,
I am using now the Grid version 3.0.2.
As described in my initial question, I have a grid with different type of cell editors (string and dropdown).The data model for the dropdown is a complex structure, with value and label, similar to the structure found in gridkeyvaluescolumnwitharray.htm.
Since our requirements are for a real grid, I can not set the value of the columntype to ‘dropdownlist’, but to “template” or “custom”.
The grid works just fine, the editors are cell based. The only problem is that the dropdown displayes the values, and not the labels.I used the “gridkeyvaluescolumnwitharray.htm” example, since there I found a dropdown with complex data structure in grid. In this example I’ve changed the columntype from “dropdownlist” to “template”, and the result is that the dropdown labels are no longer displayed after select. Instead the value is displayed.
Can you please provide me a solution to this problem, or an example with a grid containing a dropdown cell (not column, not row), where the dropdown model contains “label” and “value”?
Thank you,
Ioana
Below the source code:
$(document).ready(function () {
var column;
var data = [{
“firstname”: {
“value”: “Ioana”
}}, {
“firstname”: {
“value”: “Mary”
}
}, {
“firstname”: {
“values”: [{
“labelKey”: “Firstname 1”,
“value”: “firstname_1”
}, {
“labelKey”: “Firstname 2”,
“value”: “firstname_2”
}],
“value”: “firstname_2”
}
}];var getCellValues = function (row, column) {
var values = [];
var rowObject = data[row];
var cellData = rowObject[column];
if (cellData.values != null) {
values = cellData.values;
}
return values;
}var getCellType = function (row, column) {
var cellProperties = [{
“0firstname”: {
“cellType”: “string”
},
“1firstname”: {
“cellType”: “string”
},
“2firstname”: {
“cellType”: “dropdownlist”
}
}];var cellType = ‘string’;
var key = row + column;
var cellProp = cellProperties[0][key];
cellType = cellProp.cellType;
return cellType;
};var source = {
localdata: data,
datatype: “json”,
updaterow: function (rowid, rowdata, commit) {
commit(true);
},
datafields: [{
name: ‘firstname’,
map: ‘firstname.value’
}, {
name: ‘lastname’,
map: ‘lastname.value’
},]
};var settings = {
mapChar: ‘.’
};var dataAdapter = new $.jqx.dataAdapter(source, settings);
// initialize jqxGrid
$(“#jqxgrid”).jqxGrid({
width: “100%”,
source: dataAdapter,
editable: true,
theme: “”,
selectionmode: ‘multiplecellsadvanced’,
columns: [{
text: ‘First Name’,
datafield: ‘firstname’,
columntype: ‘custom’,
createeditor: function (row, cellValue, editor, cellText, width, height) {
var cellType = getCellType(row, column);
var cellValues = getCellValues(row, column);if (cellType === ‘dropdownlist’) {
editor.jqxDropDownList({
autoDropDownHeight: true,
width: width,
height: height,
source: cellValues,
displayMember: ‘labelKey’,
valueMember: ‘value’
});
} else {
var inputElement = $(“”).prependTo(editor);
inputElement.jqxInput({
displayMember: cellValue,
width: width,
height: height
});}
},
initeditor: function (row, cellvalue, editor, celltext, pressedkey) {
var cellType = getCellType(row, column);
if (cellType === ‘dropdownlist’) {
editor.jqxDropDownList(‘selectItem’, cellvalue);
} else {
var inputField = editor.find(‘input’);
if (pressedkey) {
inputField.jqxInput(‘selectLast’);
inputField.val(pressedkey);
} else {
inputField.val(cellvalue);
inputField.jqxInput(‘selectAll’);
}
}
},
geteditorvalue: function (row, cellvalue, editor) {
var cellType = getCellType(row, column);
if (cellType === ‘dropdownlist’) {
var optionValue = editor.val();
return optionValue;
} else {
return editor.find(‘input’).val();
}
}
}]
});
// events
$(“#jqxgrid”).on(‘cellbeginedit’, function (event) {
var args = event.args;
column = args.datafield;});
});
Hi, can someone please answer my question?
I would very much appreciate it.Thanks,
Ioana -
AuthorPosts
You must be logged in to reply to this topic.