column header with characters like / , ( issue with dropdown

[odyssey045Participant]

I have a a few column headers like ME123/ME1234, XYZ(1,2) etc.. and a drop down for each one of those column cells for about 4 – 5 rows. If a column header contains normal text like 100, 200 , abc etc, the drop downs render fine. But if for column headers that contain special characters like “/ , ( ) ” etc.. the drop down breaks.. My code for drop down is something like this

var k2 = {};
k2.text = detailsEntry.platformList[i].platformName;
k2.columntype = “dropdownlist”;

k2.columngroup = “Platforms”;
k2.datafield = detailsEntry.platformList[i].platformName;

k2.createeditor=function (row, value, editor) {

editor.jqxDropDownList({
source: bugDetailsEntry.data

});
}

On further exploration, turns out the cell ids for the drop downs have the column headers suffixed as IDs. And when column headers have special characters, its causing issues. Can something be done about this. Is there a way we can assign custom IDs for these drop down cells and work around these special characters.

[DimitarParticipant]

Hello odyssey045,

We could not reproduce this issue with the latest version of jQWidgets (3.9.1). None of the special characters appear suffixed in the ids. Please make sure you are using the latest version, too.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[odyssey045Participant]

Hi,

I have upgraded to 3.9.1 but i do not find any change in the issue.

For a column header ABC1k(/w AVC) i see that coming up for the drop down.

<div style="overflow: hidden; outline: none; background-color: transparent; border: none; float: left; width:100%; height: 100%; position: relative;" id="dropdownlistWrapperdropdownlisteditorbudDetailsgridABC1k(/wAVC)"><div style="outline: none; background-color: transparent; border: none; float: left; position: relative;" unselectable="on" id="dropdownlistContentdropdownlisteditorbudDetailsgridABC1k(/wAVC)" class="jqx-dropdownlist-content jqx-dropdownlist-content-energyblue jqx-disableselect jqx-disableselect-energyblue"></div><div style="background-color: transparent; border: none; float: right; position: relative;" unselectable="on" id="dropdownlistArrowdropdownlisteditorbudDetailsgridABC1k(/wAVC)"><div unselectable="on" class="jqx-icon-arrow-down jqx-icon-arrow-down-energyblue jqx-icon jqx-icon-energyblue"></div></div></div>

The drop down is broken and an just a down arrow

for a number like 7600, in the adjoining column in the table, the following complete html is generated for the drop down. Note that the “please select” portion of the html is missing.

<div style="overflow: hidden; outline: none; background-color: transparent; border: none; float: left; width:100%; height: 100%; position: relative;" id="dropdownlistWrapperdropdownlisteditorbudDetailsgrid7600"><div style="outline: medium none; background-color: transparent; border: medium none; float: left; position: relative; margin-top: 3px; margin-bottom: 3px; width: 93px; height: 23px; left: 0px; top: 0px;" unselectable="on" id="dropdownlistContentdropdownlisteditorbudDetailsgrid7600" class="jqx-dropdownlist-content jqx-dropdownlist-content-energyblue jqx-disableselect jqx-disableselect-energyblue"><span style="color: inherit; border: medium none; background-color: transparent; padding-top: 0px; padding-bottom: 0px;" unselectable="on" class="">Please Choose:</span></div><div style="background-color: transparent; border: medium none; float: right; position: relative; width: 19px; height: 23px;" unselectable="on" id="dropdownlistArrowdropdownlisteditorbudDetailsgrid7600"><div unselectable="on" class="jqx-icon-arrow-down jqx-icon-arrow-down-energyblue jqx-icon jqx-icon-energyblue jqx-icon-arrow-down-selected jqx-icon-arrow-down-selected-energyblue"></div></div></div>

[DimitarParticipant]

Hi odyssey045,

The column’s text (which appears in the header) can contain any character, but the datafield cannot. What you can do is map a “normal” datafield name to the name with special characters from your database. You can learn about mapping in the data adapter help topic: http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxdataadapter/jquery-data-adapter.htm.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[Author]

Posts