Автоматическое заполнение списка названий стран с использованием jquery и события щелчка по полю

В моей форме есть поле со списком, которое запрашивает страну пользователя, но я хочу только заполнить поле со списком с помощью вызова AJAX, если в поле еще не отображается страна пользователя. Первоначально список содержит только одну страну — страну, полученную в результате поиска ip-to-country на сервере.

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

Спасибо за любые предложения.

$().ready(function() {
  $('select#selCountry').one('click', function() {
    var selCountry = $('select#selCountry');
    var selected = $(selCountry).val();
    selCountry.html('<option value="">Loading...</option>');
    $.getJSON('/AjaxHelpers/CountryList', function(data) {
      if (data.length) {
        var options = '';
        for (var i = 0; i < data.length; i++) {
          var key = data[i].Key;
          var val = data[i].Value;
          options += '<option value="' + key + '"';
          if (key == selected) {
            options += ' selected="selected"';
          }
          options += '>' + val + '</option>';
        }
        selCountry.html(options);
      }
      else {
        selCountry.html('<option value="">Failed.</option>');
      }
    });
  });
});

HTML:

<div>
  <select id="selCountry" name="CountryCode"><option value="GB">United Kingdom</option>


jquery ajax listbox countries
person Robert Northen    schedule 24.07.2009    source источник
comment
какое действие по умолчанию. что именно происходит с этим кодом, чего вы не хотите?   -  person mkoryak    schedule 24.07.2009

Ответы (3)


arrow_upward
1
arrow_downward

У вас не будет кросс-браузера радости с событием select click. Только событие изменения поддерживается всеми, поэтому вам нужно переосмыслить.

Одним из вариантов может быть использование метки, которая показывает страну IP, и если пользователь хочет изменить ее, он нажимает кнопку рядом с меткой, которая затем создает и заполняет выбор и заменяет метку.

person redsquare    schedule 24.07.2009

arrow_upward
1
arrow_downward

линия

$('select#selCountry').one('click', function() {

это то, что откладывает вызов Ajax до тех пор, пока вы не нажмете на поле. Попробуйте изменить его на просто

$(function(){

или просто удалить эту строку и закрывающую скобку.

person Christopher Tokar    schedule 24.07.2009

arrow_upward
1
arrow_downward

Было бы намного лучше, если бы у вас было что-то вроде:

Страна: Испания изменить

Когда они нажимают «Изменить», замените название страны раскрывающимся списком всех стран.

person Jason Christa    schedule 24.07.2009
comment
ээээ это не то, что я сказал! - person redsquare; 24.07.2009