不使用按钮获取记录

时间:2014-04-03 19:35:50

标签: jquery mysql ajax

我已经编写了这个简单的编码来根据手机号码(用户提供的手机号码)获取客户姓名和地址。我已使用获取按钮成功完成了此操作。但我需要没有按钮选项。

当用户在文本字段中输入手机号码时,他们将转到下一个字段(名称)。如果数据库客户名中已存在移动号码,则应从数据库中获取地址。如果手机号码不存在,则会输入剩余的两个字段。有什么帮助吗?

require('config.php');
if(isset($_POST['submit']))
{
    $cmobile = $_POST['mobile'];
    $cname = $_POST['name'];
    $caddress = $_POST['address'];

    try
    {
        $stmt = $conn->prepare("INSERT INTO autocomplete ( mobile, name, address ) VALUES ( :cmobile, :cname, :caddress )");
        $conn->errorInfo();
        $stmt->bindParam(':cmobile', $cmobile, PDO::PARAM_STR);
        $stmt->bindParam(':cname', $cname, PDO::PARAM_STR);
        $stmt->bindParam(':caddress', $caddress, PDO::PARAM_STR);
        $stmt->execute();
    }
    catch(PDOException $e)
    {
        $e->getMessage();
    }
    if($stmt)
    {
        echo "success";
    }
    else
    {
        echo "error";
    }
}
if(isset($_POST['fetch']))
{
    $cmobile = $_POST['mobile'];

    try
    {
        $stmt = $conn->prepare("SELECT * FROM autocomplete WHERE mobile = :cmobile");
        $conn->errorInfo();
        $stmt->bindParam(':cmobile', $cmobile, PDO::PARAM_STR);
        $stmt->execute();
        while($row = $stmt->fetch(PDO::FETCH_ASSOC))
        {
            $aname = $row['name'];
            $aaddress = $row['address'];
        }
    }
    catch(PDOException $e)
    {
        $e->getMessage();
    }
    if($stmt)
    {
        echo "fetch success";
    }
    else
    {
        echo "fetch error";
    }
}

<form method="post" name="form" action="">
    mobile number : <input type="text" name="mobile" /><br />
    name : <input type="text" name="name" value="<?= $aname ?>" /><br />
    address : <input type="text" name="address" value="<?= $aaddress ?>" />
    <br />
    <input type="submit" name="submit" value="Submit" />
    <button name="fetch">Fetch</button>
</form>

4 个答案:

答案 0 :(得分:0)

尝试使用jQuery。

https://api.jquery.com/jQuery.ajax/

http://api.jquery.com/mouseleave/

为此做一个简单的功能。

答案 1 :(得分:0)

最好的方法是选择Ajax。您可以在不刷新页面的情况下填充数据。

$('input[name="mobile"]').blur(function(e)
{
  mobile=$(this).val();
  $.ajax(
  {
    type: "POST",
    url: "PAGE_URL_TO_GET_NEW_DATA",
    data: {mobile: mobile},
    dataType: "JSON",
    success: function(data)
    {
      $('input[name="name"]').val(data.name);
      $('input[name="address"]').val(data.address);
    }
  }
});

在您的PHP页面中,使用json_encode而不是简单的echo

答案 2 :(得分:0)

也许这样的事情会起作用。但是,异步执行此操作会更困难一些。 你可能不得不使用一些ajax。

$(document).ready(function(){
 $("#fetch").hide();
$("input").blur(function(){
   $("#fetch").click();
});
});

答案 3 :(得分:0)

您可以在html中的文本字段中添加一些不同的事件:

如果你有HTML5:

  • oninput(仅在实际发生更改时触发,但会立即触发)

否则:

  • onchange

  • onkeyup(不是keydown或keypress,因为输入的值不会有 还有新的按键)

  • onpaste(支持时)

因此,您可以使用javascript操作触发文本字段的键,这需要检查移动号码字段的长度以及何时达到正确数量的数字以进行php提取。

使用内联脚本的示例: * *

    <script>
    function showInfo(str)
    {
    if (str=="")
      {
      document.getElementById("txtResult").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("txtResult").innerHTML=xmlhttp.responseText;
        }
      }
    xmlhttp.open("GET","MYPHPFILE.php?q="+str,true);
    xmlhttp.send();
    }
    </script>

<form method="post" name="form" action="showInfo(this.value);">
    mobile number : <input type="text" name="mobile" onKeyUp="showInfo(this.value);">
  <br />
    <input type="submit" name="submit" value="Submit" />
    <button name="fetch">Fetch</button>
</form>

    <br>
    <div id="txtResult"><b>RESULTS FROM PHP WILL BE DISPLAYED HERE</b></div>

* * 我建议使用库,例如​​Dojo用于更清晰的Ajax方法或AT-LEAST,将脚本放在外部JavaScript文件中,并且可能使用带参数的方法调用ajax,这样你就可以了可以在整个网站中重复使用它来调用其他内容。

所以这是JavaScript的一个粗略示例(不包括if语句),如果查看该字段,可以在移动字段的键盘上调用,您可以看到onkeyup调用方法并传递移动号码的值。

添加一个if语句来检查到目前为止已经输入了多少个数字(通过获取该元素的当前innerhtml的值并检查长度,然后在执行该Ajax时执行ajax),然后执行该Ajax完成输入字段后检查。

现在我假设你的config.php是带有数据库连接的你的文件,所以生病了,遗漏了连接的东西。

<?php
$q = intval($_GET['q']);

$sql="SELECT * FROM registeredUsers WHERE mobile = $q";

$result = mysqli_query($con,$sql);

echo "<table border='1'>
<tr>
<th>Name</th>
<th>Address</th>
</tr>";

while($row = mysqli_fetch_array($result))
  {
  echo "<tr>";
  echo "<td>" . $row['Name'] . "</td>";
  echo "<td>" . $row['Address'] . "</td>";
  echo "</tr>";
  }
echo "</table>";

mysqli_close($con);
?>

所以这个php方法在JavaScript中调用,并将手机号码作为“q”传递,并将查找用户名和地址,并传递手机号码。

此方法要求您拥有某种带有移动名称和地址字段的registeredUsers表,以便从中获取信息。

如果是这样,它会将包含其姓名和地址的表格返回到您的页面。一切都没有提神......魔术! - 在今天的世界中有更有效的方法可以做到这一点,但是像这样的方法将起作用,我希望这可以帮助你了解它并使其正常工作。