2016-05-12 17 views
1

我有一個帶有兩個選擇html標籤和輸入提交的表單。要填充選項標記的值並顯示選定選項標記的等效值,我使用PHP,請參閱下面的代碼片段。如何在PHP foreach中使用ajax?

現在,我想使用AJAX使用JS來避免在用戶點擊按鈕時重新加載瀏覽器。但我不知道如何。請幫我

這裏的link

段:

if(isset($_POST['mall_list'])){ 
    $mall_list= $_POST['mall_list']; 
    $malls= $wpdb->get_results($wpdb->prepare("SELECT stores FROM tablename WHERE malls = '" . $mall_list. "' GROUP BY stores ORDER BY stores", OBJECT)); 

    echo '<div class="\record\">'; 
    foreach ($malls as $record){ 
     echo '<div>' . $record->stores . '</div>'; 
    } 
    echo '</div>'; 

} elseif(isset($_POST['store_list'])){ 
    $store_list= $_POST['store_list']; 
    $stores= $wpdb->get_results($wpdb->prepare("SELECT malls FROM tablename WHERE stores= '" . $store_list. "' GROUP BY malls ORDER BY malls", OBJECT)); 

    echo '<div class="\record\">'; 
    foreach ($stores as $record){ 
     echo '<div>' . $record->malls. '</div>'; 
    } 
    echo '</div>'; 
} 
+1

這是一個非常基本的問題。請嘗試使用ajax,並返回代碼。 https://jonsuh.com/blog/jquery-ajax-call-to-php-script-with-json-return/ –

回答

2
,如果你想通過Ajax的jQuery發佈數據

。這段代碼適合你。

$("form").submit(function(event) { 
     event.preventDefault(); 
      $.ajax({ 
       type: "POST", 
       url: "your post url", 
       data: $('#yourformname').serialize(), 
       success: function (data) 
       { 
       } 
      }); 
}); 
+0

以及如何在PHP foreach中調用ajax? – User014019

+0

$ data = $ _POST ['data']或$ _REQUEST ['data']然後json_decode($ data);你從表單提取數據 - >通過ajax發佈到php後端 - >通過foreach處理數據 – ThatAwesomeCoder

+0

你能創建一個例子嗎? – User014019

2

HTML

<form name="ajaxform" id="ajaxform" action="ajax-form-submit.php" method="POST"> 
    First Name: <input type="text" name="fname" value =""/> <br/> 
    Last Name: <input type="text" name="lname" value ="" /> <br/> 
    Email : <input type="text" name="email" value=""/> <br/> 
</form> 

JAVASCRIPT

//callback handler for form submit 
$("#ajaxform").submit(function(e) 
{ 
    var postData = $(this).serializeArray(); 
    var formURL = $(this).attr("action"); 
    $.ajax(
    { 
     url : formURL, 
     type: "POST", 
     data : postData, 
     success:function(data, textStatus, jqXHR) 
     { 
      //data: return data from server 
     }, 
     error: function(jqXHR, textStatus, errorThrown) 
     { 
      //if fails  
     } 
    }); 
    e.preventDefault(); //STOP default action 
    e.unbind(); //unbind. to stop multiple form submit. 
}); 

$("#ajaxform").submit(); //Submit the FORM 
+0

@ User014019您可以將此問題標記爲已接受的答案嗎?謝謝。 – ThatAwesomeCoder

0

的JavaScript

$("#form").submit(function(e){ 
    var data = $(this).serialize(); 
    var url = $(this).attr("action"); 
    $.post({ 
     url, 
     data, 
     function(res) 
     { 
      if(res.code == 0) 
      { 
       //success 
       //code somthing when the server response 
       alert(res.message); 

      } 
     } 
    }); 
}) 

服務器

if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') 
{ 
    #is ajax request 
    # code your business logic 

    #response data 
    $response = [ 
     'code' => 0, 
     'message' => 'success', 
     'data' => [] 
    ]; 
    echo json_encode($response);exit; 
} else { 
    #is normal request 
}