Задать вопрос

Как отправлять id, а не value в форме с Select2?

Есть приложение на Ruby on Rails, где можно на странице редактирования поста задать посту страну, вот код input'a (использую simple form):

= f.input :country, label: t("heading.country"), as: :string, input_html: { class: 'select2', data: { allowadd: true, depth: 0, id: post.location.country.id, url: search_locations_path } }


В CoffeeScript'e я подключаю select2

loadSelect2 = (selector = '.select2') ->
  $(@).select2
    ajax:
      data: (term, page) ->
        search: term
        depth: $(@).data('depth')
      results: (data, page) ->
        results: data
      url: $(@).data('url')
    createSearchChoice: (term, data) ->
      if $(data).filter(->
        @title.localeCompare(term) is 0
      ).length is 0
        id: term
        title: term
    createSearchChoicePosition: 'bottom'
    formatResult: (item) ->
      item.title
    formatSelection: (item) ->
      item.title
    initSelection: (element, callback) ->
      callback
        id: $(element).data('id')
        title: $(element).val()


То же самое, но в ванильном:

var loadSelect2;

loadSelect2 = function(selector) {
  if (selector == null) {
    selector = '.select2';
  }
  return $(this).select2({
    ajax: {
      data: function(term, page) {
        return {
          search: term,
          depth: $(this).data('depth')
        };
      },
      results: function(data, page) {
        return {
          results: data
        };
      },
      url: $(this).data('url')
    },
    createSearchChoice: function(term, data) {
      if ($(data).filter(function() {
        return this.title.localeCompare(term) === 0;
      }).length === 0) {
        return {
          id: term,
          title: term
        };
      }
    },
    createSearchChoicePosition: 'bottom',
    formatResult: function(item) {
      return item.title;
    },
    formatSelection: function(item) {
      return item.title;
    },
    initSelection: function(element, callback) {
      return callback({
        id: $(element).data('id'),
        title: $(element).val()
      });
    }
  });
};


Так, я могу выбрать страну из списка или добавить вручную, если в списке нет вариантов. Начальные значения я получаю из val() input'a и data-id input'a, это описывается в функции initSelection.

Если я выберу какую-либо страну из списка и отправлю форму, то всё работает как задумывалось: в переменной post_params['country'] оказывается id, то есть число. Если же я отправлю форму не меняя выбора страны, то вместо id я получаю value выбранной по умолчанию страны, а нужно id.

Что я делаю не так и как исправить?
  • Вопрос задан
  • 3661 просмотр
Подписаться 1 Оценить Комментировать
Решения вопроса 1
sintyalev
@sintyalev
Сейчас стал использовать gem "select2-rails"
Есть презентация на Хабрахабр - Как мы Select2 в хелпер заворачивали
Очень удобно, есть документация с примерами.
Ответ написан
Пригласить эксперта
Ответы на вопрос 3
@vsuhachev
В значении инпута должен быть изначально id. У вас видимо есть Country#to_s и туда рендерится название.

= f.input :country_id
либо
= f.input :country, input_html: { value:  post.location.country.id }
Ответ написан
colix
@colix Автор вопроса
Ответ такой:
= f.input :country, 
               label: t("heading.country"), 
               as: :string, 
               input_html: { value: @post.location.country.id, 
                                    class: 'select2', 
                                    data: { allowadd: true, 
                                               depth: 0, 
                                               title: @post.location.country.title, 
                                               url: search_locations_path } }


initSelection: (element, callback) ->
      callback
        id: $(element).val(),
        title: $(element).data('title')
Ответ написан
Комментировать
mlnkv
@mlnkv
JavaScript Developer
Зря вы используете CoffeeScript, так количество людей, готовых вам помочь, резко снижается
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы