我如何發送數據到一個* .php文件從提交的選擇形式沒有刷新

Question

我正在使用Google Visualizator Geomap混搭，我想做一個動態選擇的過濾器每次更改沒有任何「提交「按鈕從SQL查詢中檢索到的信息。

這裏是我的主網頁來源：（顯示在Firebug的任何錯誤和映射輸出）

<?php 
require 'protoext.php' 
?> 
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> 
    <script type='text/javascript' src='https://www.google.com/jsapi'></script> 
    <script type='text/javascript'> 

google.load('visualization', '1', {'packages': ['geomap']}); 
    google.setOnLoadCallback(drawMap); 

    function drawMap() { 
     var data = new google.visualization.DataTable(); 
    data.addColumn('string', 'Code'); 
    data.addColumn('number', 'Value'); 
    data.addRows([ 
     <?php while($r = mysql_fetch_assoc($res)) { 
       echo "['$r[COD]', $r[Value]],"; 
     } ?> 
    ]); 
     var options = {}; 
     options['dataMode'] = 'regions'; 
     options['region'] = 'IT'; 

     var container = document.getElementById('map_canvas'); 
     var geomap = new google.visualization.GeoMap(container); 
     geomap.draw(data, options); 
    }; 
</script> 

在「protoext.php」，似乎工作得很好的來源。

的主要問題是與發送該表格POST方法「性別」的值改爲「protoext.php

<form method="post"> 
    <select name="gender" onchange="this.form.submit();"> 
     <option selected>Choose</option> 
     <option value="total">total</option> 
     <option value="male">male</option> 
     <option value="female">female</option>  
    </select> 
</form> 

<div id='map_canvas'></div> 
</div> 

正如我所說的它的工作原理，但它讓我每次選擇新的時間刷新頁面價值，這是阻止我添加一些新的選擇到窗體，以改善地理過濾器 我知道，以防止刷新我必須使用AJAX，我已經嘗試了幾種方法，但它就像沒有被髮送到protoext.php。

任何人都有想法嗎？預先感謝您的回覆。

編輯

由於任何AJAX調用我做不能解決正確，我將發佈其他PHP文件（protoext.php）也許我已經得到了功能，或只是不兼容問題之間的衝突。

<?php 
$selection=$_POST["gender"]; 
$dbhost="localhost"; 
$dbuser="root"; 
$dbpass=""; 

$conn = mysql_connect($dbhost, $dbuser, $dbpass); 
if(!$conn) die ("Error Mysql: ".mysql_error()); 

$sql= "USE csv_db"; 
$ok = mysql_query ($sql, $conn); 

if(!$ok) 
    die("imposs. select DB: ".mysql_error()); 

    $sql="SELECT COD, Value 
FROM view_codes //that is the view obtained from my database 
WHERE `Age` LIKE '15+ years ' 
AND `Qualification` LIKE 'totale' 
AND `Home_Town` LIKE 'totale' 
AND `Gender` LIKE '$selection' 
AND `Period` LIKE 'T2-2012'"; 

echo "querySQL: $sql<br>"; 

$res=mysql_query($sql,$conn); 
if (!$res) 
    die ("Error query" .mysql_error()); 
?> 

---

編輯，更新

我也試過這種方式，但仍然不能正常工作。

<form method="post"> 
     <select name="gender" onchange="this.form.submit(
     function(){ 
     $.ajax({ 
     type: "POST", 
     url: "protoext.php",   //www.gautam.com?id=..&value1=.. 
     success:function(data){           
       alert("successfully submitted"); 
      } 
      }); 
     } 
    );"> 

我在做什麼錯？

Answer 1

您可以使用Ajax

$.ajax({ 
      type: "POST", 
      url: "Your url here",   //www.gautam.com?id=..&value1=.. 
      success:function(data){           
       alert("successfully submitted"); 
      } 
      }); 

Answer 2

$('form').on('submit', function() { 
    $.post('http://example.com', $(this).serialize(), function() { 
     // Done 
    }); 
}); 

Answer 3

在你的視圖文件

<script> 
    $('document').ready(function(){ 
      $.ajax({ 
     type: "POST", 
     url: "Your url here",   //www.gautam.com?id=..&value1=.. 
     success:function(data){           
      alert("successfully submitted"); 
     } 
     }); 

    }) 
</script>