使用Javascript从数据库加载数据

时间:2012-04-01 13:36:02

标签: php javascript ajax

我有这段代码来显示从accounts_view.php中的数据库中检索到的数据:

<script type="text/javascript">
function showPrice(str)
{
if (str=="")
  {
  document.getElementById("sender_price").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("sender_price").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","?action=account&q="+str,true);
xmlhttp.send();
}
</script>

我在下面的行中遇到问题:

xmlhttp.open("GET","?action=account&q="+str,true);

只是向你解释我有index.php并且有很多案例,我有

case "account" :

$q=$_GET["q"];

//code is here to get data from db and return with result..

include($_STR_TEMPLATEPATH."/account_view.php");

break;

因此,当我重定向到?action=account&q=str

中的account_view.php

它再次显示页面,所以我将有2页彼此。

我希望你能清楚问题:)

谢谢和问候,

1 个答案:

答案 0 :(得分:0)

如果您想使用ajax,我建议使用jquery从数据库中检索数据。所有浏览器不兼容性已经被考虑在内,您不必为编写手动完成此操作所遇到的所有问题而烦恼。基本上为什么要重新发明已经完美创造的车轮。

以下是使用jquery的代码示例以及使用它的简单方法。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>some title</title>
<link href="customize.css" rel="stylesheet" type="text/css" media="screen" />
<link href="css/black-tie/jquery-ui-1.8rc3.custom.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.8rc3.custom.min.js"></script>
<script type="text/javascript">
   function ShowActive(inputString){
     //gives visual that something is happening
     $('#Sresults').addClass('loading');
     //send your data to a php script here i am only sending one variable
     //if using more than one then use json format
     $.post("allactive.php", {queryString: ""+inputString+""}, function(data){
       if(data.length >0) {
         //populate div with results
         $('#Sresults').html(data);
         $('#Sresults').removeClass('loading');
       }
     });
   }
</script>
</head>
<body>
  put your form here ....
  <div id="Sresults" name="Sresults"></div>
</body>