Значение прокси-фильтра для поля ввода, поддерживаемого базой данных - PullRequest
1 голос
/ 01 мая 2011

Фон

Для поля страны система обнаруживает и по умолчанию использует Канаду. Для поля города пользователь вводит канадское название города, заполненное в стиле Facebook .

Список стран и городов заполняется с помощью AJAX и JSON, получаемых из удаленной базы данных с использованием прокси-сервера (запрашивается через PHP).

Страна по умолчанию настроена на страну происхождения пользователя, используя GeoIP PHP API MaxMind .

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

Например, пользователь, чей IP-адрес находится в Канаде, может выбрать Соединенные Штаты. Когда это происходит:

  1. поле города будет стерто;
  2. поле города получает фокус; а затем
  3. отображаются только города США (как пользователь вводит).

Проблема

Следующий фрагмент PHP-прокси позволяет получить список городов на удаленном сервере:

echo file_get_contents( 'http://server/city.dhtml?q=' . 
  urlencode( $_GET['q'] ) );

Функция jQuery tokenInput, по-видимому, не обеспечивает механизм для передачи дополнительного содержимого. Ниже приведены соответствующие фрагменты jQuery.

Приобрести страны

Следующий код получает код страны и список стран. Он устанавливает страну пользователя в качестве страны по умолчанию.

  // Where in the world?
  $.getJSON( 'geoip.dhtml', function( data ) {
    country = data[0].id;
  });

  // Select from countries that have significant amounts of data.
  $.getJSON( 'country.dhtml', function( data ) {
    var h = '';
    var len = data.length;

    for( var i = 0; i < len; i++ ) {
      var s = '';

      // Make the person's own country the default selection.
      if( data[i].id == country ) {
        s = '" selected="selected"';
      }

      h += '<option value="' + data[i].id + s + '">' + data[i].name + '</option>';
    }

    $('#country').html(h);
  });

Получить города

Следующий код загружает список городов. Функция tokenInput автоматически передает параметр q в код внутри «локальной версии» city.dhtml (фрагмент кода PHP приведен выше). Параметр q - это текст, который пользователь вводит для города.

  $('#city').tokenInput( 'city.dhtml', {
    hintText: "Type a city name.",
    tokenLimit: 1,
    classes: {
      tokenList: "token-input-list-facebook",
      token: "token-input-token-facebook",
      tokenDelete: "token-input-delete-token-facebook",
      selectedToken: "token-input-selected-token-facebook",
      highlightedToken: "token-input-highlighted-token-facebook",
      dropdown: "token-input-dropdown-facebook",
      dropdownItem: "token-input-dropdown-item-facebook",
      dropdownItem2: "token-input-dropdown-item2-facebook",
      selectedDropdownItem: "token-input-selected-dropdown-item-facebook",
      inputToken: "token-input-input-token-facebook"
    }
  });

city.dhtml должен фильтровать города по коду страны.

Вопрос

Как бы вы указали код страны для city.dhtml, не используя cookie?

Идеи

Последняя версия ввода токена поддерживает JSONP, это будет полезно?

Спасибо!

Ответы [ 2 ]

2 голосов
/ 02 мая 2011

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

Решение состоит в том, чтобы использовать патч для jQuery TokenInput, который позволяет устанавливать URLпараметр, основанный на результате вызова функции.

https://github.com/loopj/jquery-tokeninput/pull/77

Примените исправление и используйте следующий код для динамического изменения запроса:

  function cityURL() {
    return 'city.dhtml?c=' + $('#country').val();
  }

  $('#city').tokenInput( cityURL, { /* ... */ });

И отключитекэширование в jquery.tokeninput.js (около строки 650):

    //var cached_results = cache.get(query);
    var cached_results = false;
1 голос
/ 01 мая 2011

Аккуратный вопрос, +1!Что мешает вам просто сделать:

$('#city').tokenInput('city.dhtml?c=' + $('#country').val(), { /* ... */ });

Возможно, вам нужно заключить это в onChange событие, но оно должно работать.

...