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

Question

Я хочу, чтобы сделать поиск с помощью Ajax JQuery JS, для этого I have taken this piece of code from here: -

Теперь у меня есть некоторые проблемы, у меня есть этот 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, как я могу отправить как данные i.e cv, так и cvtwo в файл 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), а другая - значение кнопки.