2013-09-23 48 views
0

我有这种形式。动态表格php ajax

<form id="form1" name="form1" method="post" action=""> 
    <p> 
    <label for="textfield"></label> 
    Id: 
    <input type="text" name="textfield" id="textfield" /> 
    </p> 
    <p> 
    <label for="textfield2"></label> 
    Name: 
     <input type="text" name="textfield2" id="textfield2" /> 
    </p> 
    <p> 
    <label for="textfield3"></label> 
    Apellido: 
    <input type="text" name="textfield3" id="textfield3" /> 
    </p> 
    <p> 
    <input type="submit" name="button" id="button" value="Enviar" /> 
    </p> 
    <p>&nbsp;</p> 
</form> 

,当我写去ID,然后脉冲TAB键,输入姓名和apellido必须得到我的mysql数据库信息。

我希望你能理解我。

+0

你还没有显示任何javascript,或者php –

+0

试图更加详细。为什么你需要ajax和jquery – Ibu

+0

我认为他想在编译第一个文本字段时进行查询。例如:编译ID“textfield”时,他需要通过查询数据库将数据写入其他两个文本字段。这就是为什么他需要jQuery和Ajax。先生,http://api.jquery.com/jQuery.post/完成你的工作。看看这个例子,并使用json_encode和PHP编码数据。 – briosheje

回答

-1

您的代码将是这个样子:

<html> 
<head> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 

     <script type="text/javascript"> 
      $(document).ready(function() { 

       $('#textfield').blur(function() { 
        var myId = $(this).val(); 
        if (myId == '') return false; 

        $.ajax({ 
         type: "POST", 
         url: "myFile.php", 
         data: "theID=" +myId, 
         success: function(fromPHP) { 
          var allRecd = fromPHP.split('|'); 
          var name = allRecd[0]; 
          var apel = allRecd[1]; 

          $('#textfield2').val(name); 
          $('#textfield3').val(apel); 
         } 
        }) 
       }); 


      }); //END $(document).ready() 

     </script> 
    </head> 
<body> 

    <form id="form1" name="form1" method="post" action=""> 
     <p> 
     <label for="textfield"></label> 
     Id: 
     <input type="text" name="textfield" id="textfield" /> 
     </p> 
     <p> 
     <label for="textfield2"></label> 
     Name: 
      <input type="text" name="textfield2" id="textfield2" /> 
     </p> 
     <p> 
     <label for="textfield3"></label> 
     Apellido: 
     <input type="text" name="textfield3" id="textfield3" /> 
     </p> 
     <p> 
     <input type="submit" name="button" id="button" value="Enviar" /> 
     </p> 
     <p>&nbsp;</p> 
    </form> 

</body> 
</html> 

PHP端:myFile.php

<?php 
    $id = $_POST['theID']; 

    //Do your mysql query here, for example 
    $result = mysql_query("SELECT * FROM users WHERE user_id = '$id' "); 

    $n = $result['name']; 
    $a = $result['apellido']; 

    $response = $n . "|" . $a; 

    echo $response; 

注:

  1. 我们使用jQuery的blur()方法,当用户离开文本字段检测
  2. 然后拿到场(VAR身份识别码)的内容
  3. 如果该字段为空
  4. 发送不要做一个AJAX查询密钥名称为“theID”的assoc var以及内容== myId通过POST方法将文件myFile.php
  5. 在PHP端,接收ID并将其称为$ id(在此端)
  6. 您是否使用mysql查找并获取“名称”和“apellido”值
  7. 将它们作为一个简单字符串加在一起,用“|”分隔char
  8. ECHO回到AJAX代码块
  9. 重要提示:从PHP返回的所有数据必须在success函数内处理!
  10. 再次提取名称和apellido值
  11. 注入到正确的字段中。
-1

您可以使用jQuery使用AJAX并将此表单数据发送到MySQL。

$(document).ready(function(){ 
    $('#button').on('click',function(e){ 
     var data = $('#form1').serialize(); 
     $.ajax({ 
      url:'get_data.php', 
      type: 'post', 
      data: data, 
      success: function(response) {console.log(response);}, 
      error: function() {console.log('Request failed.')} 
     }); 
     return false; 
    }); 
}); 

而在服务器端,你可以得到如下的数据并保存到mysql数据库。我假设你有一个表名Persons。

<?php 
    $textfield = $_POST['textfield']; 
    $textfield2= $_POST['textfield2']; 
    $textfield3= $_POST['textfield3']; 

    $con=mysqli_connect("localhost","dbusername","dbpass","dbname"); 
    if (mysqli_connect_errno()) 
    { 
    echo "Failed to connect to MySQL: " . mysqli_connect_error(); 
    } 

    mysqli_query($con,"INSERT INTO Persons (textfield , textfield2, textfield3) 
    VALUES ('$textfield', '$textfield2','$textfield3')"); 
    mysqli_close($con); 
?>