JQuery Ajax на основе поиска

Question

Я хочу сделать поиск, используя ajax jquery js, для этого Я взял этот кусок кода отсюда : -

Теперь у меня есть некоторые проблемы, у меня есть этот код Javascript: -

<script language="JavaScript" type="text/javascript">
<!--
function searchuser(cv) {
    $("#SearchResult").html('<img src="loader.gif"/>').show();
    var url = "elements/search-user.php";
    $.post(url, {contentVar: cv} ,function(data) {
       $("#SearchResult").html(data).show();
    });
}
//-->
</script>

Моя форма: -

<label>
        <input onClick="generatenew();" type="radio" name="search_option" value="code" id="search_option_0">
        Customer Code</label></td>
      <td><label>
        <input onClick="generatenew();" type="radio" name="search_option" value="company" id="search_option_1">
        Customer Company</label></td>
      <td><label>
        <input onClick="generatenew();" type="radio" name="search_option" value="name" id="search_option_2">
        Customer Name</label></td>
      <td><label>
        <input onClick="generatenew();" type="radio" name="search_option" value="email" id="search_option_3">
        Customer Email</label>

Это мое текстовое поле поиска

<input type="text" name="searchuser_text" id="newInput" size="25" maxlength="25" class="inputbox MarginTop10">

Это моя кнопка поиска

<input onclick="javascript:searchuser('con1');" class="Button" name="search_user_submit" type="button" value="Search">

Это моя область отображения: -

<div id="SearchResult">My default content for this page element when the page initially loads</div>

Теперь я хочу знать, по нажатию кнопки я отправляю данные, например con1.Я хочу отправить две данные на searchuser function, одну - на значение выбранной опции, а другую - на текст textbox.После отправки обоих данных в функцию, как я получу данные в функции?Нужно ли мне изменить function searchuser(cv) на function searchuser(cv, cvtwo).

Кроме того, пока $.post(url, {contentVar: cv} ,function(data) отправляет только один файл данных в файл php, как я могу отправить оба данные, то есть cv и * 1029?* к файлу php?

Answer 1

Прежде всего вы можете изменить функцию поиска на что-то вроде этого

$("input[name='search_user_submit']").click(function(){
var cv = $('#newInput').val();
var cvtwo = //similar to above
var data = 'cv='+ cv + '&cvtwo='+cvtwo; // sending two variables
$("#myDiv").html('<img src="loader.gif"/>').show();
    var url = "elements/search-user.php";
    $.post(url, {contentVar: data} ,function(data) {
       $("#SearchResult").html(data).show();
    });

});

Answer 2

Не используйте встроенные функции, вы можете легко это сделать с помощью встроенной функции связывания jQuery:

// Search when you click on submit
$(document).on('click', '.submit_button', function(){
   search('click_button');
});

// Search when you press enter
$(document).on('keypress', "#searchString", function(e){
    var c = (e.keyCode ? e.keyCode : e.which);
    if(c == 13) {
        search('pressed_enter');
    }
});

Таким образом, вы можете собрать значение кнопки и передать его функции поиска:

function search(button_value) {
    $("#myDiv").html('<img src="loader.gif"/>').show();
    $.post("elements/search-user.php", { search_value: $('#newInput').val(), button_value: button_value} ,function(data) {
       $("#SearchResult").html(data).show();
    });
}

Что вы делаете, это отправляете форму с двумя переменными $ _POST: одна - строка поиска, которую вы ввели в поле поиска (называемое search_value), а другая - значение кнопки.