TokenInput — получение значений из нескольких полей поиска

Я использую Loopj TokenInput, и он работает нормально.

У меня есть три поля поиска на одной странице — по одному для трех разных поисковых атрибутов и каждое со своим собственным внешним источником данных (в данном случае поиск по названию корабля, классу корабля и типу корабля). Конечно, есть три кнопки «Отправить», по одной для каждого окна поиска.

Моя проблема. При нажатии любой кнопки "Отправить" возвращаются значения только для ее собственного окна поиска (на основе приведенного ниже скрипта). Я бы хотел нажать кнопку ЛЮБАЯ и получить значения для ВСЕХ полей поиска, чтобы я мог создать запрос MySQL.

<script type="text/javascript">
  $(document).ready(function() {
    $("input[type=button]").click(function () {
      alert("Would submit: " + $(this).siblings("input[type=text]").val());
    });
});
</script>

Примечание. Этот предыдущий вопрос "Использование tokeninput jquery для более чем одного ввода на странице". кажется связанным, но ответы на этот вопрос не затрагивают эту проблему.


person user1429842    schedule 11.06.2012    source источник


Ответы (1)


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

  1. Сценарий «предупреждения» javascript — отвлекающий маневр. Он не получает значения токенов волшебным образом из воздуха. Значения токена уже сохранены в соответствующих полях ввода.

  2. Кнопки "Отправить" - отвлекающий маневр. Это потому, что они «. Они просто там, чтобы вызвать предупреждение javascript, они не могут отправить форму.

  3. Вам нужна форма! Демонстрации "TokenInput" показывают, как работает плагин, но они предназначены для использования В ФОРМЕ.

  4. Я добавил поле формы вверху страницы и закрывающее поле формы (</form>) внизу страницы. В результате три моих окна поиска оказались внутри формы. Обратите внимание, что действие заключается в получении той же страницы и метода = post.

    `<form id="myshiptype" name="pixsearchform" action="<?php echo $_SERVER[REQUEST_URI]; ?>" method="post" >`
    
  5. Я изменил поля ввода «имя» образца с «бла» на что-то более значимое — shipid, classid и typeid.

  6. Я добавил кнопку «Отправить» (типа <input type="Submit" />) внизу формы. <input type="submit" id="update" name="update" value="Update search" />

  7. Я добавил на страницу код отладки, чтобы отображать значения полей ввода после нажатия кнопки «Отправить».

    <?php 
    $postvalues = "";
    if ($_POST) {
    $kv = array(); 
    foreach ($_POST as $key => $value) {
    $kv[] = "$key=$value";
    } 
    $postvalues = join("&", $kv);
    }
    echo "post values are ".$postvalues;
    ?>
    
  8. Вот пример отладки: "значения сообщения: shipid=34&classid=&typeid=677,638&update=Поиск обновлений"

Следующие шаги — адаптировать форму к Ajax, а также отключить клавишу «Ввод» в форме (когда пользователь нажимает «Ввод» в пустом поиске).

person user1429842    schedule 12.06.2012