Question

我有一个带有下拉菜单的html页面，菜单工作，onchange调用一个函数popBox（）也可以工作。在函数内我使用ajax将下拉菜单的值发布到php中，它选择形成db。我希望用所选信息填写“DetailsForm”形式的文本框。我目前没有填充任何文本框，警报（msg）显示页面的整个html侧和警告框。有人可以帮我解决我的问题。我已经尝试了多种不同的ajax和jquery变体来执行此操作，并且在相同的功能上15小时后，我开始有点沮丧地说至少。在此先感谢您的帮助，我很感激。

这是我的代码： HTML

    <head>
    <link href="../UserTemplate.css" rel="stylesheet" type="text/css"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>Tours</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js">  </script>

    <script type="text/javascript">
    function popBox(str)
    {
        $.ajax({
      type: "PopulateBoxes.php",
      data: { dat: str}
      }).done(function( msg ) { //you can also use success
       alert( "Data Saved: " + msg );
      });
     //document.getElementById("txt_Duration").value = <?php Print($Duration); ?>;
     //document.getElementById("txt_Vessel_Name").value = <?php Print($Vessel); ?>;
     //document.getElementById("txt_Location").value = <?php Print($Location); ?>;
     //document.getElementById("txt_Available").value = <?php Print($Available); ?>;
     //document.getElementById("txt_Price").value = <?php Print($Price); ?>;
    }
    </script>
    </head> 
    <body>
    <div id="MainDiv">
        <div id="Header">
            <div id="Logo"><img src="../Scotia Sea Life Logo.png" width="150px"  height="110px" alt="Company Logo"/></div>
             <div id="NavBar"><ul>
                        <a href="homepage.php">Home</a> <a href="SelectStudentScore.php">Tours</a> <a href="AdditionPageMain.php">About</a> <a href="SubtractionPageMain.php">Donate</a> <a href="Devisionmain.php">Account</a>
               </ul>
         </div>     
           <div id="Title">Tours</div>
      </div>
            <div id="Content">
              <div id="Search">
                <div id="SearchDiv">
               <form id="SelectTourForm" style="margin:5px;">
                           <table border="0" align="center" width="100%">
                                        <tr>
                                        <td>
                                        <label style="color:#FFF; font:Georgia, 'Times New  Roman', Times, serif; font-size:20px; margin-left:10px; margin-top:25px">Select Tours  Details</label></td>
                                        </tr>
                                        <tr>
                                          <td><select name="lst_MonthDrop"  style="background-color:#FF9933; color:#FFF; border:none; margin-top:10px; margin- left:10px;" onchange="popBox(this.value);">
                                                <option>Please Select</option>
                                                 <?php 
                                                 include 'populatedrodown.php';
                                                 foreach ( $results as $option ) : ?>
                                                      <option value="<?php echo $option- >Date; ?>"><?php echo $option->Date; ?></option>
                                                 <?php endforeach; ?>
                                            </select>
                                            <input type="submit" name="btn_TourSearch" id="btn_TourSearch" value="Search" style="background:#009300; border-radius:5px; border-color:#009300; color:#FFF;margin-left:5px;" /></td>
                                        </tr>
                                        <tr> 
                                          <td></td>
                                        </tr>      
                        </table>

                        <p>&nbsp;</p>
              </form>

            </div>
          </div>
          <div id="DetailsDiv">
            <div id="DetailsContent">
                <form id="DetailsForm" >
                    <table border="0" align="center" width="100%">
                    <tr><td><label style="color:#FFF; font-size:14px;">Tour ID</label>    <input type="text" id="Tour_ID" />    </td></tr>
                    <tr><td><label>Duration</label> <input type="text" id="txt_Duration" />     </td></tr>
                    <tr><td><label>Vessel Name</label> <input type="text"    id="txt_Vessel_Name"/> </td></tr>
                    <tr><td><label>Location</label> <input type="text" id="txt_Location" />   </td></tr>
                    <tr><td><label>Date</label> <input type="text" id="txt_Date" />        </td></tr>
                    <tr><td><label>Available</label> <input type="text" id="txt_Available" />  </td></tr> 
                    <tr><td><label>Price</label>  <input type="text" id="txt_Price" />     </td></tr>         
                    </table>
                </form>
            </div>
          </div>













        </div>
        <div id="Footer">
        <div id="FooterLinks"></div>
    </div>
</div>
</body>
</html>

PHP

    <?php
    $q = $_POST['dat'];

    $mysql_db_hostname = "localhost"; 
    $mysql_db_user = "root"; 
    $mysql_db_password = "pwd"; 
    $mysql_db_database = "db";

    $con = mysql_connect($mysql_db_hostname, $mysql_db_user, $mysql_db_password) or   die("Could not connect database");
    mysql_select_db($mysql_db_database, $con) or die("Could not select database"); 

    $sql="SELECT * FROM Tour WHERE Date = '".$q."'";

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


    while($row = mysqli_fetch_array($result))
      {

     $Duration = $row['Duration'] ;
     $Vessel = $row['Vessel_Name'] ;
     $Location = $row['Location'] ;
     $Available = $row['Available'];
     $Price = $row['Price'];
      }

    mysqli_close($con);
    ?>

Answer 1

尝试修改类似于此的JS代码：

 function popBox(selectValue) {
   $.ajax({
     type: 'POST',    
     url: "PopulateBoxes.php",
     data: { dat: selectedValue },
     success: function(serverResponse) {
       // after success request server should return response with data 
       // that will be passed to this callback function as parameter
       // and you can use it to fill text boxes:
       $('#txt_Duration').val(serverResponse.duration);
     }
   });
 }

此外，您应修改您的PHP代码以返回JSON中的数据：

// At the end you should return selected array. For example:    
echo json_encode($dataArray); exit;

Answer 2

当您在PHP代码中使用$ _POST时，您需要编辑ajax调用脚本。类型是GET或POST，页面地址来自url属性。

$.ajax({
  type: 'POST',
  url: "PopulateBoxes.php",
  data: { dat: str}
  }).done(function( msg ) { //you can also use success
   alert( "Data Saved: " + msg );
  });     
}

Ajax-为php填充多个文本框

2 个答案: