Onchange с несколькими значениями get через selectbox с помощью jQuery

Question

У меня есть 2 ящика с Java-скриптом. Когда я использую filter1, мой URL-адрес меняется на www.url.com/&filter[]=6827, это работает отлично, а выбранный вариант работает без проблем. Но я хочу новый selectbox, такой как filter2 с несколькими фильтрами. Когда я использую его, как показано ниже, URL выглядит следующим образом: www.url.com/&filter[]%3D=6727%26filter[]%3D6728

Может кто-нибудь помочь из этой проблемы? Я думаю, что это в JQuery... не уверен в этом.

<div class="filter1">
  <div class="title">Filter1</div>
    <form action="filter1" method="get" id="input-custom-filter1">   
     <select name="filter[]=" onchange="$('#formFilters').submit();">
     <option value="6725">Option1</option>
     <option value="6726">Option2</option>
     <option value="6727">Option3</option>
     <option value="6728">Option4</option>
     </select>
</div>   
<div class="filter2">
  <div class="title">Filter1</div>
    <form action="filter2" method="get" id="input-custom-filter2">   
     <select name="filter[]=" onchange="$('#formFilters').submit();">


     <option value="6725&filter[]=6726">Option1 & Option2</option>
     <option value="6727&filter[]=6728">Option3 & Option4</option>
         </select>
    </div> 


<script type="text/javascript">
    $(document).ready(function(){
      $('#formFilters').submit() {
            }
        });
    });
</script>

Answer 1

<option value="6725&filter[]=6726">Option1 & Option2</option>
<option value="6727&filter[]=6728">Option3 & Option4</option>

проблема с вашими значениями попробуйте изменить его..

Answer 2

В приведенном выше фрагменте HTML-кода есть несколько проблем.

1. пожалуйста, удалите = от <select name="filter[]="атрибут name должен указывать имя поля формы; если вы установите method = "get", браузер автоматически добавит = для создания URL.

2. <option value="6725&filter[]=6726"> не будет удовлетворять вашим требованиям. Все в атрибуте value будет обрабатываться как значение определенного поля формы, которое в вашем случае является filter[] и, следовательно, кодируется. Вот почему вы видите %3D

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

Таким образом, во второй форме вы можете передать несколько значений с помощью флажка

<input type="checkbox" name="filter[]" value="6725"/>
<input type="checkbox" name="filter[]" value="6726"/>

Опять же, пожалуйста, удалите = из атрибута имени в любом элементе поля формы.

Answer 3

Код не понимает все символы, через которые вы проходите. Я не уверен, чего вы здесь добиваетесь, но это явно не ошибка в вашем javascript и не в вашем HTML. Хотя использование 6727&filter[]=6728 в качестве значения - плохая идея.

Я ожидаю, что ошибка заключается в том, где вы получаете отправленную информацию. Вы, вероятно, и ошибка определения и перенаправления на URL.

Answer 4

@gijsnl URL-кодирование - это поведение браузера по умолчанию (потому что вы используете метод get get), и я не думаю, что его стоит взламывать. В вашем случае вы можете использовать множественный выбор для достижения цели. В Stackru уже есть сообщение,

Как опубликовать выборки в HTML List Box с несколькими выбранными значениями

Мои предложения следующие: 1. удалить знак равенства из атрибута name* select элемента; 2. не добавляйте несколько значений в один элемент option. 3. используйте пост формы, а не get, если у вас нет для этого веской причины.