ajax在文本框中显示查询结果

好吧，所以我在我的GoDaddy托管帐户上安装了jQuery。我需要在文本框中显示结果，并完成了我的HTML，它获取用户输入，单击按钮和结果区域（div id = status）。我只想将结果放在一个框中，而不必刷新页面。我正在尝试这个json的事情和AJAX来完成这一点，我试图找出我的尝试有什么问题。这是HTML。ajax在文本框中显示查询结果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<script language='JavaScript' type='text/javascript'> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Test</title> 

</head> 
<body> 
<p>Miles <input name="miles" id="miles" type="text" /> <button type="button" name="getdata" id="getdata">Submit</button></p> 
<p></p> 
<div id="status"> 

</div> 
<script type="text/javascript" language="javascript"> 
$('getdata').click(function(){ 

    $.ajax({ 
      url: 'process.php', 
      type:'POST', 
      dataType: 'json', 
      success: function(output_string){ 
        $('#result_table').append(output_string); 
       } 
      )); 

}); 
</script> 
</body> 
</html>

，它应该被送到process.php文件：

<?php 
$hostname = 'myhost.com'; 
$username = 'ratetable'; 
$password = 'mypassword'; 

$miles = (int) $_POST['miles']; 

try 
{ 
    $db = new PDO("mysql:host=$hostname;dbname=ratetable", $username, $password); 

    foreach($db->query('SELECT * FROM rates WHERE mileage<= ' . $miles . ' ORDER BY mileage DESC LIMIT 1') as $row) { 
    $output_string .= '<input type='text' name='answer' value='" . $row['ratepermile'] . "'>'; 

    } 
}   
echo json_encode($output_string); 
catch (PDOException $e) { 
    echo $e->getMessage(); 
    throw($e); 
} 
?>

我试图用一个例子来建造这一点，并没有任何反应......甚至HTML表单。这有什么问题？

谢谢你看看。

来源

2013-01-16 Shawn

则需要等到DOM是阅读，看看下面的答案有关使用#ID作为一个选择。 http://docs.jquery.com/Tutorials:Introducing_$（document）.ready（） – Popnoodles

为什么dataType：'json'当你提供一个html代码？ – sweb

你的选择是错的$('getdata')应该是$('#getdata')，你必须在ID前加上#来选择一个带有它的id的元素。你也需要的参数传递给POST请求

$.ajax({ 
     url: 'process.php', 
     type:'POST', 
     data: {miles: $('#miles').val()}, 
     dataType: 'json', 
     success: function(output_string){ 
       $('#result_table').append(output_string); 
     } 
));

来源

2013-01-16 20:31:42 Musa

这种情况经常发生在我身上，令人感到尴尬。 – argentage

问题中的脚本没有准备好 – Popnoodles

@popnoodles该脚本低于所有操作的元素，因此不需要$（document）.ready。 – Musa

试试这个，

$('#result_table').val(output_string);

来源

2013-03-22 11:09:22 HOSTGUY

ajax在文本框中显示查询结果

回答

相关问题