通过单击jquery中的表格单元格的值来设置文本框的值

时间:2013-08-07 03:48:47

标签: php jquery

我想通过单击table cell的值来设置文本框的值。我只是混淆了如何做到这一点。 该表是由数据库中的搜索数据生成的,当我点击表格中的任何单元格时,该值将在另一个文本框中设置。这是我的表格代码的一部分

的search.php

$title=$_POST["title"];
$last_name=$_POST["last_name"];
$mobile=$_POST["mobile"];
$email=$_POST["email"];

$result = mysqli_query($con,"SELECT * FROM user WHERE first_name='$title' AND last_name='$last_name' OR mobile='$mobile' OR email='$email'");

echo "<table class='datatable' cellpadding='0' cellspacing='0' id='example'>
<thead>
    <tr>
        <th>First Name</th>
        <th>Last Name</th>
        <th>Mobile</th>
        <th>Email</th>
    </tr>
    </thead>";

while($row = mysqli_fetch_array($result))
  {
  echo "<tr>";
  echo "<td id='first_name' class='clickable'>" . $row['first_name'] ."</td>";
  echo "<td id='last_name' class='clickable'>" . $row['last_name'] . "</td>";
  echo "<td>" . $row['mobile'] . "</td>";
  echo "<td>" . $row['email'] . "</td>";
  echo "</tr>";
  }
echo "</table>";

我需要更新的文本框是在另一个php页面。所以我有什么办法设置我的文本框的值?

1 个答案:

答案 0 :(得分:0)

搜索页面是通过jquery打开的。以下是html代码

<script type="text/javascript">
            $(document).ready(function(){
               function search(){
                            var title=$("#first_name").val();
                            var last_name=$("#last_name").val();
                            var mobile=$("#mobile").val();
                            var email=$("#email").val();


                            if(title!=""){
                            $("#result").html();
                            $.ajax({
                            type:"post",
                            url:"search.php",
                            data:'title='+ title + '&last_name='+ last_name + '&mobile='+ mobile + '&email='+ email,
                            success:function(data){
                                $("#result").html(data);
                                $("#first_name").val("");
                                $("#last_name").val("");
                                $("#mobile").val("");
                                $("#email").val("");

                                                           }
                          });
                      }

                 }

                  $("#button").click(function(){
                     search();
                  });

                  $('#first_name').keyup(function(e) {
                     if(e.keyCode == 13) {
                        search();
                      }
                  });

                  $('#last_name').keyup(function(e) {
                      if(e.keyCode == 13) {
                         search();
                       }
                   });

                  $('#mobile').keyup(function(e) {
                      if(e.keyCode == 13) {
                         search();
                       }
                   });
                  $('#email').keyup(function(e) {
                      if(e.keyCode == 13) {
                         search();
                       }
                   });





            });
        </script>
 <table class="datatable">
    <tr>
    <td width="100"><label for="first_name">First Name: </label></td>
    <td>
   <input type="text" name="first_name" value="" id="first_name" /></td></tr>
   <tr>
    <td><label for="last_name">Last Name: </label></td>
        <td>
   <input type="text" name="last_name" value="" id="last_name" /></td></tr>

   </table></fieldset>

   <fieldset>
    <table class="datatable">
    <tr>
    <td width="100"><label for="mobile">Mobile: </label></td>
    <td>
   <input type="text" name="mobile" value="" id="mobile"/></td></tr>

   </table></fieldset>

    <fieldset>
    <table class="datatable">
    <tr>
    <td width="100"><label for="email">Email: </label></td>
    <td>
   <input type="text" name="email" value="" id="email" /></td></tr>
      </table>
            <input type="button" id="button" value="Search"  />
             <ul id="result"></ul>