jQuery UI team solved the issue in github by replacing the missing definition for default icons. Here’s the commit
https://github.com/jquery/jquery-ui/commit/dde9b83df61d1d676e66cb2a2f7970dd44a05137
Thanks.
Tony, Thanks for your reply.
Althought it can’t be seen in github (I don’t know why other themes aren’t there) that change was applied to all themes. The difference is the sprite image used. Some examples:
1 2 3 |
https://code.jquery.com/ui/1.12.1/themes/ui-lightness/jquery-ui.css https://code.jquery.com/ui/1.12.1/themes/ui-darkness/jquery-ui.css https://code.jquery.com/ui/1.12.1/themes/blitzer/jquery-ui.css |
Anyway, as you correctly stated, you can’t just add that definition in jqGrid css since, beforehand, you don’t know in which path is jQuery UI. I think the solutions involves replacing hyperlinks and divs/spans with real buttons (which gets styled correctly by jQuery UI) and then adjust their size/appearance in jqGrid CSS. I understand that it’s not a simple change and maybe it can’t be done or you can’t make it since you have other priorities.
In my case I place the fix directly in jQuery UI CSS (reverted the change) since it’s affecting other plugins as well, so I can live whith that.
Thanks!
Hello Tony,
Reverting that change in the stylesheet should work, at least in my case did. I Think jQuery UI will not consider this a problem, since the removal of that property was made to allow customization of the icon colour, which aparently never worked as expected when customizing available themes. Here’s the issue which motivated that modification:
https://github.com/jquery/jqueryui.com/issues/159
Anyway, I think the solution is to adjust the plugins css accordingly instead of revert that change in jQuery UI stylesheet
I may add that the removal of that css property affects not only jqGrid but all the code and plugins that use the icons outside of a html button.As the title of the commit states “Theme: Fix icon default color when not within a button”.
Will,
In that demo you can clearly see what I’m refering to. See the buttons on the pager grid in the default state. They appear black. The same happens with sort order icons. Take a look to this old demo where the icons are orange:
http://jsfiddle.net/Lgy7ae3h/2/
Maybe was some unexpected behaviour but I think it made the grid looks better.
Also edit a row and see the buttons in edit form…they look bad in black colour and it’s not consistent with the style of the jquery-ui buttons in that theme.
@Will: The change is not listed in the changelog since it may be a minor fix for them. The same happens with “fractional removal detection” for example. If you compare version 1.12 with 1.12.1 you’ll notice those changes.
Hello Tony,
I redownloaded jQuery UI 1.12.1 again but I’m having the same problem. Please test with “UI lightness” theme. I tried other themes like “Le frog” and “Excite Bike” where the colour of the icons also change. I didn’t notice the colour difference using base and UI Darkness theme. I guess it depend’s on how the image sprites are set for each theme.
Thanks in advance.
var buildSelectLocal = function(options) {
return function(data) {
data = JSON.parse(data);
data = data.d ? data.d : data;
var s = ‘<select><option value=””>- Select ‘ + options.label + ‘ -</option>’;
for (var i = 0, l=data.length; i<l ; i++) {
s += ‘<option value=”‘+data[0]+'”>’+data[1]+'</option>’;
}
return s + “</select>”;
};
};
Please note that select is built correctly. If I set cacheUrlData to false I don’t have any problem and empty string value of combo is preserved.
Hello Will,
formatter select won’t work with dataUrl without preloading the values for the combos before filling the grid. Using afterSubmit to change the value displayed in the grid seems to work. I have used this approach before to format strings to date or int when posting to server and then restore original postData in afterSubmit. Here’s the demo:
http://jsfiddle.net/d26hzhu6/18/
Regarding the alternatives you suggested I can’t find a way to make them work, can you please post a working sample with such modifications?
Thanks!
Hello Will,
I’m already using that configuration: removing key property and setting id:0 in jsonReader. That only fix the issue with main id of the row. I also reported that issue on github:
https://github.com/tonytomov/jqGrid/issues/800
The problem with the combo is still present. I prepared a demo using version 5.1.1:
http://jsfiddle.net/d26hzhu6/16/
Edit any row, Change city to London and save changes. You’ll notice that id 1 is sent to server but also displayed on the grid (instead of the text London)
Thanks in advance.
I tested code in version 5.1.
The code works almost the same with one exception. After posting the key to the database, the key is displayed in the grid (instead of the value). As a solution, I’m going to swap the key with the value in afterSubmit event so it’s displayed in the grid correctly and I don’t have to change my original queries to the database
Here’s a JSFiddle sample:
http://jsfiddle.net/Lgy7ae3h/2/
I had problems to simulate ajax request in dataUrl so I’m using a workaround.
here’s the commit of the change:
https://github.com/tonytomov/jqGrid/commit/edb5073b6bd617878221674d201cba060489241c
The extpost variable was providing that functionality and was removed.
I can’t set key and value to same content, since I must display value but save key to database.
Ok, so I’ll have to use promises to retrieve the data for the combo before filling the grid, which could be completely unnecesary if the user just want to see something without editing, and also increasing startup time. I think the “old way” was better since retrieving the actual value to be displayed in the grid avoid this issue. I honestly can’t find a reason why is better to use the key instead of the value, but I guess I’m missing something.
Thanks!
Ok, thank you!
Great, I’ll use this implementation then.
Thanks for your response!
Copyright 2014 TriRand LtdAll Rights ReservedRSS
Back to Top