2013-03-01 4 views
0

В настоящее время у меня есть окно поиска продукта; вы можете выполнить поиск по имени картриджа или имени принтера. Это разные SQL-запросы, поэтому я сделал соответствующие файлы PHP для запросов, но мне не удается заставить Jquery проверить значение переключателя, а затем изменить почтовый файл на основе этого переключателя.Изменение JQuery AJAX URL-адрес на основе переключателя

Нужно проверить обновление радиокнопки в любое время, когда пользователь делает что-либо в форме, конечно.

Любая помощь будет оценена очень сильно!

Вот Jquery:

  $("#faq_search_input").watermark("Begin Typing to Search"); 
     $("#faq_search_input").keyup(function() 
     { 
      var faq_search_input = $(this).val(); 
      var dataString = 'keyword='+ faq_search_input; 
      if(faq_search_input.length>1) 
      { 
       var search_method = $("#search_method").val(); 
       if(search_method == 'Cartridge'){ 
        $.ajax({ 
         type: "GET", 
         url: "<?php echo $site_Config_Url; ?>/resources/ajax-search.php", 
         data: dataString, 
         beforeSend: function() { 
          $('input#faq_search_input').addClass('loading'); 
         }, 
         success: function(server_response){ 
          $('#searchresultdata').html(server_response).show(); 
          $('span#faq_category_title').html(faq_search_input); 

          if ($('input#faq_search_input').hasClass("loading")) { 
           $("input#faq_search_input").removeClass("loading"); 
          } 
         } 
        }); 
       }else{ 
        $.ajax({ 
         type: "GET", 
         url: "<?php echo $site_Config_Url; ?>/resources/ajax-search2.php", 
         data: dataString, 
         beforeSend: function() { 
          $('input#faq_search_input').addClass('loading'); 
         }, 
         success: function(server_response){ 
          $('#searchresultdata').html(server_response).show(); 
          $('span#faq_category_title').html(faq_search_input); 

          if ($('input#faq_search_input').hasClass("loading")) { 
           $("input#faq_search_input").removeClass("loading"); 
          } 
         } 
        }); 
       } 
      }return false; 
     }); 
    }); 

Вот HTML для формы:

<form action="<?php echo $site_Config_Url; ?>controllers/product_Search_Process.Controllers.php" method="get"> 
<div style="width:885px;padding-left:15px;height:127px;padding-top:50px;margin-left:auto;margin-right:auto;background-image:url(<?php echo $site_Config_Url; ?>/display/img/layout/ink_and_toner_finder.png);"> 
    <div style="width:400px;height:108px;float:left;padding-top:7px;"> 
     <div style="width:400px;padding-left:20px;float:left;"> 
      <div style="float:left;"> 
       <select name="drop_1" id="drop_1" style="width:300px;"> 
        <option value="" selected="selected" disabled="disabled">Select Printer Brand</option> 
        <?php getTierOne(); ?> 
       </select> 
      </div> 
      <div style="width:80px;padding-left:5px;padding-top:5px;float:left;"> 
       <span id="wait_1"> 
        <img alt="Please Wait" src="<?php echo $site_Config_Url; ?>display/img/ui/ajax-loader.gif"/> 
       </span> 
      </div> 
      <div class="clear"></div> 
     </div> 
     <div class="clear"></div> 

     <span id="result_1" style="display: none;"></span> 
     <span id="result_2" style="display: none;"></span> 

    </div> 
    <div style="width:70px;height:115px;float:left;"></div> 
    <div style="width:400px;float:left;"> 
     <h2 style="padding-top:15px;padding-bottom:0;margin-bottom:0;padding-left:10px;">Search by Cartridge or Printer</h2> 
     <div class="clear"></div> 
     <div style="padding-left:10px;padding-top:10px;"> 
      <span style="padding-left:10px;"><input type="radio" name="search_method" value="Cartridge" checked>Cartridge</span> 
      <span style="padding-left:20px;"><input type="radio" name="search_method" value="Printer">Printer</span> 
      <div class="clear"></div> 
      <div style="padding-top:5px;"> 
       <div style="padding-top:5px;float:left;"> 
        <input type="text" name="search_text" style="float:left;width:230px;" id="faq_search_input"/> 
       </div> 
       <div style="padding-left:18px;float:left;"> 
        <input id="submit_right" type="submit" name="submit_right" value="Find Ink!" /> 
       </div> 
       <div class="clear"></div> 
      </div> 
     </div> 
     <div id="searchresultdata" class="faq-articles"> </div> 
    </div> 
</div> 

+0

ли e только изменение - это URL? –

ответ

1

Чтобы получить значение выбранной радиостанции поле вы можете использовать $('input:radio[name="search_method"]:checked').val();

$("#faq_search_input").watermark("Begin Typing to Search"); 
$("#faq_search_input").keyup(function() { 
    updateResult(); 
    return false; 
}); 

$('input[name="search_method"]').on('click', updateResult) 

function updateResult(){ 
    var faq_search_input = $('#faq_search_input').val(); 
    var dataString = 'keyword='+ faq_search_input; 
    if(faq_search_input.length>1) 
    { 
     var search_method = $('input:radio[name="search_method"]:checked').val(); 

     $.ajax({ 
      type: "GET", 
      url: "<?php echo $site_Config_Url; ?>/resources/ajax-search" + (search_method == 'Cartridge'? '': '2') + ".php", 
      data: dataString, 
      beforeSend: function() { 
       $('input#faq_search_input').addClass('loading'); 
      }, 
      success: function(server_response){ 
       $('#searchresultdata').html(server_response).show(); 
       $('span#faq_category_title').html(faq_search_input); 

       if ($('input#faq_search_input').hasClass("loading")) { 
        $("input#faq_search_input").removeClass("loading"); 
       } 
      } 
     }); 
    } 
} 
+0

Это сработало отлично! Можете ли вы порекомендовать лучший способ добавить слушателя к переключателям, чтобы, если пользователь уже набрал что-то и изменил переключатель, запрос снова запустится? – ihateartists

+1

@ihateartists см. Мой обновленный ответ –

+0

Хм, я пробовал, но, похоже, он не работает. Я набираю «23», а затем меняю переключатель, но результаты не меняются. Я попытался изменить ваш пример: '$ ('input [name =" search_method "]'). Change (function() { \t updateResult(); });' но это не сработало – ihateartists

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