從表單前一頁

Question

我有上有一個搜索表單如下搜索PHP頁面調用jQuery函數（我已經刪除了自舉類）

<form id="searchform" name="search" role="form" action="/Search" method="post"> 
    <input type="text" class="form-control" name="keywords" placeholder="keywords e.g. some words here"/> 
    <input type="hidden" id="location" value="" class="county" name="location[]" /> 
    <button class="btn btn-primary btn-lg" type="submit" name="search_button" id="searchbutton"> 
     <span class="glyphicon glyphicon-search" aria-hidden="true"></span> 
     &nbsp;&nbsp;SEARCH 
    </button> 
</form> 

在此搜索頁面我有頂部顯示相同的搜索表單，結果顯示在右側列表中，左側顯示覆選框列表並選擇稱爲AJAX並優化搜索的列表。調查結果被加載到名爲displaylisting的div中。

$(document).ready(function() { 
$('# list here comma separated').on('change',function(){ 
    $.ajax({ 
     type: "POST", 
     url: "ajaxlistings.php", 
     contentType: 'application/x-www-form-urlencoded', 
     data: $("#formID").serialize(), 
     cache: false, 
     dataType: 'html', 
     success: function(data){ 
      console.log(data); 
      $('#displaylisting').html(data); 
     }, 
     error: function (xhr, status, error) { 
      alert("Sorry, there was a problem!: " + error); 
      console.log(xhr.status); 
       console.log(xhr.responseText); 
       console.log(error); 
     }, 
     complete: function (xhr, status) { 
      //$('#showresults').slideDown('slow') 
     } 
    }); 
    return false; 
}); 

/* Search button clicked */ 
$("#searchbutton").click(function() { 
    $.ajax({ 
     type: "POST", 
     url: "ajaxlistings.php", 
     contentType: 'application/x-www-form-urlencoded', 
     data: $("#formID").serialize(), 
     cache: false, 
     dataType: 'html', 
     success: function(data){ 
      console.log(data); 
      $('#displaylisting').html(data); 
     }, 
     error: function (xhr, status, error) { 
      alert("Sorry, there was a problem!: " + error); 
      console.log(xhr.status); 
       console.log(xhr.responseText); 
       console.log(error); 
     }, 
     complete: function (xhr, status) { 
      //$('#showresults').slideDown('slow') 
     } 
    }); 
    return false; 
}); 

當在search.php頁面上測試時，所有這些工作都正常。

這裏是我的問題：

從邏輯上講，去這個搜索頁面，在我的index.php我也有同樣的搜索表單。

我想要的是，當用戶點擊我的index.php頁面上的搜索表單時，它們被帶到search.php頁面（它目前正在執行的操作），但我想調用AJAX調用這裏顯示列表。

這可能嗎？作爲解決方法，我在主頁上創建了一個隱藏變量，並將其設置爲1，當提交到搜索PHP頁面時，它會調用ajaxlisting.php中相同的PHP代碼，當此值爲1時。但似乎反作用，特別是當ajaxlisting.php會幫我完成這項工作。

我有搜索論壇，但無法找到我的問題的答案。

Answer 1

要做到這一點，你可以把你的keywords輸入您所查找的值，然後觸發onchange事件

HTML（請注意，您需要在這裏淨化你的迴音，以防止XSS）

<input type="text" class="form-control" name="keywords" placeholder="keywords e.g. some words here" value="<?php echo $_POST['keywords']; ?>"/> 

JS

$("[name='keywords']").trigger('change'); 

Answer 2

到目前爲止基於鏈接中的評論（How to submit form on one page to a different page using ajax call in jquery）我有這個在我的搜索PHP頁面搭上從索引PHP頁面的POST：

$method = $_SERVER['REQUEST_METHOD']; 
if($method == 'POST') 
{ 
echo $method . " - Send to AJAX\n\n"; 
$fromhome = 1; 
} 
else 
    exit; 

，然後在SCRIPT標籤的頭，我有：

var fromhome = <?php echo $fromhome; ?>; 
if(fromhome == 1) 
    CallAjax(); 

function CallAjax(){ 
    console.log('From home' + fromhome); 
    $.ajax({ 
     type: "POST", 
     url: "ajaxlistings.php", 
     contentType: 'application/x-www-form-urlencoded', 
     data: $("#formID").serialize(), 
     cache: false, 
     dataType: 'html', 
     success: function(data){ 
      console.log(data); 
      $('#displaylisting').html(data); 
     }, 
     error: function (xhr, status, error) { 
      alert("Sorry, there was a problem!: " + error); 
      console.log(xhr.status); 
      console.log(xhr.responseText); 
      console.log(error); 
     }, 
     complete: function (xhr, status) { 
      //$('#showresults').slideDown('slow') 
     } 
    }); 
    return false; 
    } 
} 

但Firebug是一個錯誤：

ReferenceError: $ is not defined 
$.ajax({ 

Answer 3

我它排序。

這是我做的。在我搜索PHP頁面我有：

$method = $_SERVER['REQUEST_METHOD']; 
if($method == 'POST') 
    $fromhome = 1; 
else 
    exit; 

，並在標題中這樣的：

<script> var fromhome = <?php echo $fromhome; ?>; </script> 

我有我所有的jQuery和腳本在頁腳PHP頁面所以在這裏我有：

$(document).ready(function() { 
if(fromhome == 1) 
    { 
    console.log('From home: ' + fromhome); 
    CallAjaxFunction(); 
    } 

function CallAjaxFunction(){ 
alert("here"); 
    $.ajax({ 
     type: "POST", 
     url: "ajaxlistings.php", 
     contentType: 'application/x-www-form-urlencoded', 
     data: $("#formID").serialize(), 
     cache: false, 
     dataType: 'html', 
     success: function(data){ 
      console.log(data); 
      $('#displaylisting').html(data); 
     }, 
     error: function (xhr, status, error) { 
      alert("Sorry, there was a problem!: " + error); 
      console.log(xhr.status); 
      console.log(xhr.responseText); 
      console.log(error); 
     }, 
     complete: function (xhr, status) { 
      //$('#showresults').slideDown('slow') 
     } 
    }); 
    return false; 
} ... 

所以現在它工作正常，AJAX函數被調用時，從索引PHP頁面通過帖子執行搜索，然後在搜索PHP AJAX調用做其餘的。