Как заставить автозаполнение работать для нескольких форм, используя один и тот же идентификатор (css)?

0

Следующий код предназначен для поиска в списке компаний и возврата 10 результатов. Он отлично работает для одной входной формы с одним id (css).

Когда у меня есть вторая форма в представлении с одним и тем же идентификатором, автозаполнение работает только для первого экземпляра, где я вызываю вход id = "компания". Для моей цели у меня есть несколько форм, для которых мне нужен один и тот же автозаполнение, чтобы работать без изменения идентификатора (company1, company2 и т.д.),

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

приложение/вид:

 <script>
 $('#company').autocomplete({

     minLength: 2,

     source: '<%= company_path %>',

     focus: function(event, ui) {
         $('#company').val(ui.item.name);
         return false;
     },

     select: function(event, ui) {
         $('#company').val(ui.item.name);
         return false;
     }
 })


        .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
            return $( "<li></li>" )
                .data( "item.autocomplete", item )

                .append( "<a>" + item.name + "</a>" )
                .appendTo( ul );
        };

});

</script>

<input type="text" class="span11" id="company" name = "company" >  ***<!--autocomplete works fine-->***

<input type="text" class="span11" id="company" name = "company" >  ***<!--autocomplete does not work in second instance -->***

Config/маршруты:

match '/company', to: 'search#company_autocomplete'

Контроллер /search_controller

  def company_autocomplete
  if params[:term]
    if params[:term].length>1
    @companies_autocomplete = Company.select(:name).where( 'name LIKE ?', "%#{params[:term]}%").first(10)

    end
  end

   render :json => @companies_autocomplete.to_json 

  end
  • 4
    Вздох, это потому, что идентификаторы уникальны, и вы не можете иметь один и тот же идентификатор дважды в одном документе, нет никаких исправлений, кроме написания действительного кода.
Теги:
jquery-autocomplete

2 ответа

0
Лучший ответ

Это взломанно, но вместо того, чтобы писать $("#company"), вы можете написать $("*[id=company]").

  • 0
    прекрасный! Работал
1

Идентификаторы должны быть уникальными. Обычно, если вам нужно применить одно и то же к двум различным элементам, вы должны использовать класс.

<input type="text" class="span11 company" id="company1" name = "company" >

<input type="text" class="span11 company" id="company2" name = "company" >

Тогда ваши селекторы JS могут просто использовать периоды вместо #

$('.company').autocomplete({

     minLength: 2,

     source: '<%= company_path %>',

     focus: function(event, ui) {
         $('.company').val(ui.item.name);
         return false;
     },

     select: function(event, ui) {
         $('.company').val(ui.item.name);
         return false;
     }
 })

Ещё вопросы

Сообщество Overcoder
Наверх
Меню