Порядок в выпадающем списке Google Chrome, похоже, неверный

Question

Я использую следующий код для рендеринга поля выбора в одной из моих форм, и когда я проверяю, я вижу следующий код в Firefox

<select name="make">
    <option value="13501">Jeep</option>
    <option value="26838">Joyner</option>
    <option value="13658">Kia</option>
    <option value="13898">Lada</option>
</select>

Но в хроме, когда я проверяю элемент формы, я вижу

<select name="make">
    <option value="13501">Jeep</option>
    <option value="13658">Kia</option>
    <option value="13898">Lada</option>
    <option value="26838">Joyner</option>
</select>

Кто-нибудь может предложить решение для этого?

Answer 1

Это не очень хорошая практика, но ...

Если вы добавите пробел к значению, Chrome не будет рассматривать значение и не будет сортировать их по значению.

Пример:

<select>
  <option value=" 3">Third</option>
  <option value=" 1">First</option>
  <option value=" 2">Second</option>
</select>

Хорошая сторона в том, что вам не нужно добавлять, а затем удалять алфавитные символы из идентификатора, как кто-то предложил (не помню, если в этом или другом посте с подобным вопросом), вы могли бы легко обрезатьэто, но в большинстве случаев пробел просто игнорируется, и если вы отправите или получите их в другой файл, они просто увидят целочисленное значение, а не пробел.

Answer 2

Это случается и со мной тоже. Со следующей клиентской стороной JS:

var data=incoming_json_assoc_array_of_counties_sorted_alphabetically_by_county //eg 47=>"west midlands"
    for (key in data) {
        options.push('<option value="' + key + '">' + data[key]+ '</option>');
    }
    $('#county_id').val(options.join(''));

Похоже, что chrome не будет поддерживать целые числа в качестве имен свойств или будет сортировать по ключу, а не по значению. Независимо от значения, в которое поступают данные

Это боль в задней части, так как большинство моих массивов - это num => массивы данных.

Пожалуйста, посетите http://code.google.com/p/chromium/issues/detail?id=12169 для объяснения, все еще ищите обходной путь / исправление.

Это не делается в FF или даже в сафари, основанном на webkit. Пробовал на ПК и MAC хром и получаю ту же проблему.

Другой вариант, который, я полагаю, состоит в том, чтобы визуализировать HTML на стороне сервера и просто использовать JS для помещения данных в теги .., а не генерировать их на стороне клиента.

[обновление] см. Google Chrome: ассоциативные массивы JavaScript, оцененные не по порядку , для хорошего сплошного ответа

[редактировать 2013] По-видимому, это все еще не было исправлено Это допустимое поведение в соответствии со стандартами ECMAScript, но это не то, как можно «ожидать» его поведения. Хотели ли вы использовать selected.js , который может помочь вам решить вокруг проблемы.