В раскрывающемся списке jQuery HTML нужно два значения, но отображать / отправлять одно. Второе значение, используемое для выбора другого выпадающего меню - PullRequest
1 голос
/ 28 мая 2009

Хорошо, здесь идет:

У меня есть опция выпадающего списка SELECT с названиями штатов США

<select>
  <option value="ca">california</option>
  <option value="ut">utah</option>
  <option value="mi">michigan</option>
</select>

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

<select>
  <option value="ca">california</option> <!-- true-->
  <option value="ut">utah</option>       <!-- undecided-->
  <option value="mi">michigan</option>   <!-- false-->
  <option value="oh">ohio</option>       <!-- false-->
  <option value="az">arizona</option>    <!-- undecided-->
  <option value="dc">wash dc</option>    <!-- false-->
</select>

Теперь, когда второе значение добавлено (как-то) к первому раскрывающемуся меню SELECT, мне нужен способ выбрать второе раскрывающееся меню SELECT на основе первого выбранного раскрывающегося списка SELECT.

<select>
  <option value="t">true</option>
  <option value="f">false</option>
  <option value="u">undecided</option>
</select>

, поэтому, если пользователь выбирает «wash dc», для второго выпадающего меню «SELECT» должно быть установлено значение false.

Я использую jQuery для JavaScript, если это помогает, и я думаю, что могу решить вторую часть этой проблемы, но как мне сделать первую часть?

Ответы [ 3 ]

0 голосов
/ 28 мая 2009

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

0 голосов
/ 28 мая 2009

Нельзя использовать класс, имя или идентификатор для заполнить второе значение, как они есть использовал уже. и может иметь только один значение в атрибуте значения

Хорошо, если вы не можете использовать эти (обычные) методы, это ограничивает ваш выбор. Поскольку вы уже используете jQuery, на ум приходит функция .data (). Это в основном позволяет хранить пары ключ / значение в любом данном объекте DOM. Таким образом, вы можете прокрутить все ваши варианты в списке и

$('#selectID options').each(function(){
    $.data($(this), 'key', 'value')
});

Подробнее о .data () здесь

Изменить:

Не будет никаких изменений в вашей HTML-структуре, что звучит как бонус в этой ситуации. Функция .data () просто позволяет вам хранить «метаданные» для любого существующего HTML-элемента на вашей странице. Если бы вы просматривали источник на странице, этих данных не было бы. Он хранится где-то на земле jQuery, и я не могу точно сказать, как этот механизм работает, хотя я предполагаю, что это просто слой абстракции в базовом массиве JavaScript. В этом случае вы будете прикреплять кусочек данных к каждому из ваших элементов

.

Таким образом, чтобы установить данные, вы используете цикл, как показано выше. Затем, чтобы получить данные, вам просто нужно знать, какая опция выбрана в данный момент, а затем снова использовать .data () и ключ, чтобы вернуть значение.

var storedValue = $.data( $('#selectID option:selected'),'key' )

Поиск прост, я ожидаю, что ваша задача - получить данные, чтобы вы могли их установить. Один из способов - сгенерировать javascript на стороне сервера, а затем отправить его на страницу. Вы можете в конечном итоге не использовать цикл, поскольку я собираюсь предположить, что каждое значение уникально, оно может выглядеть примерно так:

$.data( $('#selectID options:eq(0)'), 'key', 'value1' );
$.data( $('#selectID options:eq(1)'), 'key', 'value2' );
$.data( $('#selectID options:eq(2)'), 'key', 'value3' );
$.data( $('#selectID options:eq(3)'), 'key', 'value4' );

'value1' может быть любым, включая строку json, которая позволит вам хранить несколько значений одним ключом, если это будет необходимо.

И, наконец, если вы собираетесь использовать эту функцию несколько раз, было бы довольно легко создать плагин jQuery, который позволит вам сделать это с меньшими затратами труда, но это ответ на другой вопрос.

0 голосов
/ 28 мая 2009

Вы можете использовать атрибут класса следующим образом:

<select>
  <option class="someclass true" value="ca">california</option> <!-- true-->
  <option class="someclass undecided" value="ut">utah</option>  <!-- undecided-->
  <option class="someclass false" value="mi">michigan</option>  <!-- false-->
</select>

Атрибут class может содержать несколько классов, разделенных пробелами.

Вы также можете создать собственный атрибут. Это нарушит проверку вашей страницы в формате HTML (XHTML).

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...