2016-08-17 127 views
2

我在php中创建一个程序,用户选择一个字母,然后在屏幕上打印所有名字,这个字母存储在我的mysql“presta_prova”数据库中。 这里是我的代码(PHP文件):我可以使用ajax选择mysqli数据库行吗?

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <style> 
 
    table { 
 
     width: 100%; 
 
     border-collapse: collapse; 
 
    } 
 
    table, 
 
    td, 
 
    th { 
 
     border: 1px solid black; 
 
     padding: 5px; 
 
    } 
 
    th { 
 
     text-align: left; 
 
    } 
 
    </style> 
 
    <script> 
 
    function showUser(str) { 
 
     if (str == "") { 
 
     document.getElementById("txtHint").innerHTML = ""; 
 
     return; 
 
     } else { 
 
     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("txtHint").innerHTML = xmlhttp.responseText; 
 
      } 
 
     }; 
 
     xmlhttp.open("GET", "presta_prova.php?q=" + str, true); 
 
     xmlhttp.send(); 
 
     } 
 
    } 
 
    </script> 
 
</head> 
 

 
<body> 
 
    <form> 
 
    <select name="users" onchange="showUser(this.value)"> 
 
     <option value="">Scegliete una lettera:</option> 
 
     <option value="1">A</option> 
 
     <option value="2">B</option> 
 
     <option value="3">C</option> 
 
     <option value="4">D</option> 
 
    </select> 
 
    </form> 
 
    <br> 
 
    <div id="txtHint"><b>Vedi qui i tipi ti marche:</b> 
 
    </div> 
 
    <?php $q=i ntval($_GET[ 'q']); $con=m ysqli_connect('localhost', 'root', 'evolvia2016', 'presta_prova'); if (!$con) { die('Could not connect: ' . mysqli_error($con)); } mysqli_select_db($con, "presta_prova"); $sql="SELECT * FROM presta_prova WHERE marca LIKE '" 
 
    .$q%. "' "; $result=m ysqli_query($con,$sql); echo "<table> 
 
<tr> 
 
<th>Marca</th> 
 
<th>Descrizione</th> 
 
</tr>"; while($row=m ysqli_fetch_array($result)) { echo "<tr>"; echo "<td>" . $row[ "marca"] . "</td>"; echo "<td>" . $row[ "descrizione"] . "</td>"; echo "</tr>"; } echo "</table>"; mysqli_close($con); ?> 
 
</body> 
 

 
</html>
但是,当我选择了一封信,这是我的输出。而不是我的数据库的行这个程序输出的表头。我做了我的代码错了吗?也许这种方式不适用于mysqli数据库?谢谢! 这里是我的数据库: enter image description here

enter image description here

+0

忽略会导致语法错误的随机空格,'。$ q%.'也会导致语法错误。 '%',即通配符需要在SQL字符串中。 –

回答

0

如果目的是为了填充新行的表,而不是追加的响应为div这是它如何出现,那么你可以重构代码,并使用POST喜欢这个。

<?php 

    if($_SERVER['REQUEST_METHOD']=='POST'){ 
     ob_clean(); 

     /* Forgot to change this to POST! */ 
     $q=intval($_POST[ 'q']); 

     $con=mysqli_connect('localhost', 'root', 'evolvia2016', 'presta_prova'); 
     if (!$con)die('Could not connect: ' . mysqli_error($con)); 

     mysqli_select_db($con, "presta_prova"); 
     $sql="SELECT * FROM presta_prova WHERE marca LIKE '".$q."%' "; 
     $result=mysqli_query($con,$sql); 



     $html=array("<tr><th>Marca</th><th>Descrizione</th></tr>"); 

     while($row=mysqli_fetch_array($result)) { 
      $html[]="<tr><td>" . $row[ "marca"] . "</td><td>" . $row[ "descrizione"] . "</td></tr>"; 
     } 

     mysqli_close($con); 


     exit(implode(PHP_EOL,$html)); 
    } 

?> 


<!DOCTYPE html> 
<html> 
    <head> 
    <title>gotta have a title</title> 
     <style> 
     table { 
      width: 100%; 
      border-collapse: collapse; 
     } 
     table, 
     td, 
     th { 
      border: 1px solid black; 
      padding: 5px; 
     } 
     th { 
      text-align: left; 
     } 
     </style> 
     <script> 
     function showUser(str) { 
      if (str == "") { 
      document.getElementById("txtHint").innerHTML = ""; 
      return; 
      } else { 
      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("results").innerHTML = xmlhttp.responseText; 
       } 
      }; 
      xmlhttp.open("POST", location.href, true);/*"presta_prova.php"*/ 
      /* send the content-type header */ 
      xmlhttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); 

      /* my mistake here, this should be like this rather than object literal. */ 
      xmlhttp.send('q='+str); 

      } 
     } 
     </script> 
    </head> 
    <body> 
     <form> 
     <select name="users" onchange="showUser(this.value)"> 
      <option value="">Scegliete una lettera:</option> 
      <option value="1">A</option> 
      <option value="2">B</option> 
      <option value="3">C</option> 
      <option value="4">D</option> 
     </select> 
     </form> 
     <br> 
     <div id="txtHint"><b>Vedi qui i tipi ti marche:</b> 
     </div> 
     <table id='results'> 
     <tr> 
      <th>Marca</th> 
      <th>Descrizione</th> 
     </tr> 
     </table> 
    </body> 
</html> 

完整的工作示例没有数据库交互,但显示选择机制的工作。

<?php 
    if($_SERVER['REQUEST_METHOD']=='POST'){ 
     ob_clean(); 

     $q=intval($_POST[ 'q']); 
     $t=$_POST['text']; 

     /* emulated database search and results being generated */ 
     $html=array('<tr><th>Marca</th><th>Descrizione</th></tr>'); 
     for($i=0; $i < 10; $i++) $html[]='<tr><td>Marca:'.$i.' q='.$q.'</td><td>Descrizione:'.$i.' text='.$t.'</td></tr>'; 

     header('Content-Type: text/html'); 
     exit(implode(PHP_EOL, $html)); 
    } 
?> 
<!DOCTYPE html> 
<html> 
    <head> 
    <title>gotta have a title</title> 
     <style> 
     table { 
      width: 100%; 
      border-collapse: collapse; 
     } 
     table, 
     td, 
     th { 
      border: 1px solid black; 
      padding: 5px; 
     } 
     th { 
      text-align: left; 
     } 
     </style> 
     <script> 
     function showUser(o) { 
      if (o.value == '') { 
      document.getElementById("txtHint").innerHTML = ""; 
      return; 
      } else { 

      xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP"); 
      xmlhttp.onreadystatechange = function() { 
       if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
       document.getElementById("results").innerHTML = xmlhttp.responseText; 
       } 
      }; 
      xmlhttp.open("POST", location.href, true); 
      xmlhttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); 
      xmlhttp.send('q='+o.value+'&text='+o.options[o.options.selectedIndex].text); 
      } 
     } 
     </script> 
    </head> 
    <body> 
     <form> 
     <select name="users" onchange="showUser(this)"> 
      <option value="">Scegliete una lettera:</option> 

      <?php 
      /* Generate each letter of the alphabet as an option */ 
      for($i=0; $i<26; $i++){ 
       $char=chr($i + 65); 
       $int=$i+1; 
       echo "<option value='$int'>$char"; 
      } 
      ?> 
     </select> 
     </form> 
     <br> 
     <div id="txtHint"><b>Vedi qui i tipi ti marche:</b> 
     </div> 
     <table id='results'><!-- results will overwrite the table innerHTML --> 
     <tr> 
      <th>Marca</th> 
      <th>Descrizione</th> 
     </tr> 
     </table> 
    </body> 
</html> 
+0

确定这不是交互式的。我选了一封信,没有任何反应。我不知道这是否适用于您的电脑。 –

+0

我必须承认在发送ajax请求中的参数时犯了一个小错误 - 我不认为咖啡已经开始工作。当然,它应该是一个格式为“q = A”等的字符串,也可以设置Content-Type头。 – RamRaider

+0

也许我应该插入一些脚本来使其工作?我的本地主机上没有任何内容。 –

相关问题