2013-10-15 5 views
3

Предположим, у меня есть форма с несколькими полями, использующая typeahead.js, для некоторых файлов я хочу передать значения из ранее заполненных полей формы как часть запроса. НапримерTypeahead.js передает динамические дополнительные параметры

<input id="First_Name" type="text"> 
<input id="Last_Name" type="text"> 

JavaScript:

$('#Last_Name').typeahead({ 
    name: 'typeahead', 
    remote: 'Search.pl?query=%QUERY'. 
    template:[ 
...... 
    ].join(''), 
    engine: Hogan 
}); 

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

Заранее спасибо

ответ

5

Вы можете это сделать. Используйте команду replace для обработки строки запроса до ее установки.

Что-то вроде:

$('#Last_Name').typeahead({ 
    name: 'typeahead', 
    remote: { 
    url: 'Search.pl?query=%QUERY', 
    replace: function(url, uriEncodedQuery) { 
     val = $('#First_Name').val(); 
     if (!val) return url; 
     //correction here 
     return url + '&first_name=' + encodeURIComponent(val) 
    }, 
    template: ..., 
    engine: Hogan 
}); 
+0

Спасибо, но есть способ сделать добавление новых полей общим или мне нужно жестко кодировать это для каждого поля? –

+1

Просто напишите код javascript, чтобы закодировать входные данные в форме, собрать их значения и добавить к 'url'. Что-то вроде '$ (« input »). ForEach (...)', а в 'forEach' использовать' this.val() 'и добавить свою кодировку в URI в' url'. –

+0

Хорошо, спасибо! –

0

Старая тема, но может быть полезно с более развернутым ответом:

Как @Shaked уже сказал, вам нужно использовать заменить функция

1. Если вы хотите иметь динамические параметры

В этом случае вы не будете динамическими параметрами, которые не являются частью ввода типа headhead.

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

$('#myID').typeahead({ 
    name: 'typeahead', 
    remote: { 
    url: 'search.php', 
    replace: function(url, uriEncodedQuery) { 
     val = $('#yourValue').val(); 
     if (!val) return url; 
     return url + '?param=' + encodeURIComponent(val) 
    }, 
    template: ..., 
}); 

2. Если вы хотите добавить динамические параметры

Этот случай является более интересным. Если вы не захотите получить дополнительные параметры, поступающие от других входов DOM, они не будут входить в состав ввода Typehead.

Вы должны использовать заменить слишком, но содержание отличается:

$('#myID').typeahead({ 
     name: 'typeahead', 
     remote: { 
     wildcard: '%QUERY', 
     url: 'search.php?query=%QUERY', 
     replace: function(url, uriEncodedQuery) { 
      val = $('#yourValue').val(); 
      if (!val) return url.replace("%QUERY",uriEncodedQuery); 
      return url.replace("%QUERY",uriEncodedQuery) + '&param=' + encodeURIComponent(val) 
     }, 
     template: ..., 
    }); 

С помощью этого кода, вы будете иметь возможность получить TypeHead вход + некоторые дополнительные параметры

Смежные вопросы