2

What I am experiencing is that jQGrid sorts the select options by its value, and I can't find a way to make it sort by its label.

The options are loaded locally:

var cities = {
    "15604":"Akashi",
    "7538":"lompolo",
    "13488":"Akersloot",
    "15516":"Akita",
    "17301":"Akizuki",
    "15848":"Akola",
    "11415":"Akron",
    "15224":"Akron",
    "7458":"Akrotiri",
    "10783":"Aksaray",
    "15127":"Aksu",
    "9563":"Aktobe"
};

But the options appears like this:

<option role="option" value="7458">Akrotiri</option>
<option role="option" value="7538">lompolo</option>
<option role="option" value="9563">Aktobe</option>
<option role="option" value="10783">Aksaray</option>
<option role="option" value="11415">Akron</option>
<option role="option" value="13488">Akersloot</option>
<option role="option" value="15127">Aksu</option>
<option role="option" value="15224">Akron</option>
<option role="option" value="15516">Akita</option>
<option role="option" value="15604">Akashi</option>
<option role="option" value="15848">Akola</option>
<option role="option" value="17301">Akizuki</option>

And this is the portion where I used it:

//other colModels,
{
    "name":"city_id",
    "index":"city",
    "width":"100",
    "editable":true,
    "align":"center",
    "edittype":"select",
    "formatter":"select",
    "editoptions":{"value":cities},
    "stype":"select",
    "searchoptions":{
        "sopt":["eq","ne"],
        "value":cities}
}
//other colModels

How can I make the select options be sorted by its label and not by its values when adding or editing a record?

macinville
  • 236
  • 2
  • 9

1 Answers1

2

It's not correct. jqGrid don't sort select options at all. You can still have problem with the order of select options if you use object for of value property. The answer describe why the form can follow to changing the order of options. It's interesting that the order depend on the browser which you use. To fix the problem you can use either string form of value property or you can use dataUrl alternatively.

UPDATED: Like I suspected you used object format of value so you have problems described in the answer. You should change cities from object to the string like "15604:First labele;9563:Second label;...;12345:Last label".

I would recommend you additionally to consider to use jQuery UI Autocomplete instead of <select>.

Community
  • 1
  • 1
Oleg
  • 220,925
  • 34
  • 403
  • 798
  • Well I actually tried using dataUrl, the thing is the options are really 17,000+ records (I only used 10 records just to show an example), so it takes almost 5 seconds before the add/edit form shows the dropdown, so I decided to load it locally so that the server will only need to every the page is loaded,not every time the add/edit/search requests are triggered. – macinville Jul 11 '13 at 10:14
  • @macinville: The results of loading `dataUrl` can be cached. You can also use jQuery UI Autocomplete instead of ` – Oleg Jul 11 '13 at 10:25
  • Thanks Oleg! I generated the city options as string instead of JSON, and it the sorting of options is fixed. – macinville Jul 11 '13 at 11:30
  • @Oleg Hi Oleg, can you help me with this question. am facing the same problem. – user1447718 Jan 27 '14 at 04:36