добавить строку запроса к URL при нажатии кнопки jquery - PullRequest
Новая
       17

добавить строку запроса к URL при нажатии кнопки jquery

1 голос
/ 27 декабря 2011

Как получить выбранное значение radiobtn и ключевое слово, введенное в форму, и передать его URL-адресу при нажатии кнопки с помощью jquery или javascript? Если радио-кнопка выбрана как «все», а ключевое слово набрано как «Танец», а URL-адрес http://myschool.com/event.aspx,, тогда я хочу добавить URL-адрес следующим образом при нажатии кнопки: http://myschool.com/event.aspx?all&dance

<div class="EventRadios" style="color:#574319; font:13px Trebuchet">
    <input type="radio" name="EventType" value="All" />All &nbsp;  
    <input type="radio" name="EventType" value="Class" />Class &nbsp;  
    <input type="radio" name="EventType" value="Event" />Event &nbsp;    
    <input type="radio" name="EventType" value="Support Group" />Support Group &nbsp;&nbsp;<br /><br />
</div>
<input name="KeywordBox" class="BasicSearchInputBox" type="text" value="Keyword Search..."/>
<div class="searchBtnHolder"><a class="searchButton" href="#" type="submit"><span>Search</span></a></div>

Ответы [ 2 ]

4 голосов
/ 27 декабря 2011

лучший вариант - jQuery BBQ, это также позволит вам сохранить историю.

проверьте этот пример: http://benalman.com/code/projects/jquery-bbq/examples/fragment-basic/

простой ответ на ваш вопрос - захватить все вашиСформируйте значение и сделайте строку URL с вашим значением и отправьте в location.href = "ваш URL + значение"; 

$(".searchButton").click(function(){
    var radioVal =  $('input:radio[name=EventType]:checked').val();
    var textVal = $("input:text[name=keywordBox]").val();

    value = "r="+ radioVal + "&t=" + textVal;
    location.href = "yourURL" + value;

});
0 голосов
/ 27 декабря 2011

вы можете использовать метод .serialize () : 

var queryString = $('#myForm').serialize();

, что даст вам что-то вроде: 

EventType=All&KeywordBox=blablabla

Вы можете загрузить нужную страницу следующим образом: 

document.location = 'http://myschool.com/event.aspx?'+queryString;

Резюме: 

<form id="myForm" method="GET"><div class="EventRadios" style="color:#574319; font:13px Trebuchet">
    <input type="radio" name="EventType" value="All" />All &nbsp;  
    <input type="radio" name="EventType" value="Class" />Class &nbsp;  
    <input type="radio" name="EventType" value="Event" />Event &nbsp;    
    <input type="radio" name="EventType" value="Support Group" />Support Group &nbsp;&nbsp;<br /><br />
</div>
<input name="KeywordBox" class="BasicSearchInputBox" type="text" value="Keyword Search..."/>
<div class="searchBtnHolder"><a class="searchButton" href="#" type="submit"><span>Search</span></a></div></form>
<script type="text/javascript">
  $('.searchButton').click(function(ev){

    var queryString = $('#myForm').serialize();
    document.location = 'http://myschool.com/event.aspx?'+queryString;
  });
</script>

это то, что вы ищете?

...