获取ajax结果并加载页面后使用php回声值

时间:2016-05-09 13:39:49

标签: javascript php jquery html ajax

你好这是我的js代码,我的所有代码都在同一个php文件中

<script type="text/javascript">
$(function() {
    $('#submit').click(function() {

        $.post({
            type: "POST",
            dataType:'html',
            url: "<?php echo $_SERVER['PHP_SELF']?>",
            data: {cid: $("#customer_Id").val()},


            complete: function(){
            } ,
            success: function(html){
                alert(html);


            }

        });

    });
    return false;
});

其次这是我的html和php代码

 <div class="row">


    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xs-offset-0 col-sm-offset-0 col-md-offset-3 col-lg-offset-3 toppad">

            <div id="customerFrm">


            <input id="customer_Id" name="customer_Id" type="text" value="" class="form-control" placeholder="Search for...">


                <button class="btn btn-default" type="button" id="submit" value="search" onclick="$('#PataintInfo').removeClass('hidden');">Go!</button>

            </div><!-- /form -->


    </div><!-- /.col-lg-6 -->



</div>

<div id="PataintInfo" class="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xs-offset-0 col-sm-offset-0 col-md-offset-3 col-lg-offset-3 toppad hidden">


<div class="panel panel-info">
    <div class="panel-heading">
        <h3 class="panel-title">Pataint Info</h3>
    </div>
    <div class="panel-body">
        <div class="row">

            <div id="customerq_no" class="col-md-3 col-lg-3" align="center">

            </div>

            <div class="col-md-9 col-lg-9">
                <table class="table">
                    <tbody>
                    <tr>
                        <td>Name:</td>
                        <td id="pid"><?php var_dump($_POST)?></td>
                    </tr>
                    <tr>
                        <td>Gender</td>
                        <td>Male</td>
                    </tr>
                    <tr>
                        <td>Date of Birth</td>
                        <td>01/24/1988</td>
                    </tr>

                    <tr>
                    </tr>

                    <tr>
                        <td>Mobile</td>
                        <td>Metro Manila,Philippines</td>
                    </tr>

                    <tr>
                        <td>Service</td>
                        <td>
                            <select id="roomlist">
                                <option value="-1">Please Select Service</option>
                                <?php foreach (getRoomList() as $row ) {
                                    ?>
                                    <option value="<?php echo $row['room_id'];?>"><?php echo $row['room_title_en'];?></option>
                                    <?php
                                }
                                ?>
                            </select>

                        </td>
                    </tr>

                    </tbody>
                </table>


                <a href="#" class="btn btn-primary">Book a site</a>
            </div>
        </div>
    </div>
    <div class="panel-footer">

    </div>

</div>

警告显示写入数组,但在显示 PataintInfo div之后有vardump($ _ POST)!

没有显示任何$ _POST数组,我想我错过了一些逻辑,因为当onclick事件发生时PataintInfo已经加载了。

现在我想使用PHP而不是javascript来处理 Cid 的值

1 个答案:

答案 0 :(得分:0)

如果要在同一页面上加载ajax响应,则需要刷新该部分。

<div class="row">
   <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xs-offset-0 col-sm-offset-0 col-md-offset-3 col-lg-offset-3 toppad">
      <div id="customerFrm">
         <input id="customer_Id" name="customer_Id" type="text" value="" class="form-control" placeholder="Search for...">
         <button class="btn btn-default" type="button" id="submit" value="search" onclick="$('#PataintInfo').removeClass('hidden');">Go!</button>
      </div>
      <!-- /form -->
   </div>
   <!-- /.col-lg-6 -->
</div>
<div id="PataintInfo" class="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xs-offset-0 col-sm-offset-0 col-md-offset-3 col-lg-offset-3 toppad hidden" >
<div class="panel panel-info">
   <div class="panel-heading">
      <h3 class="panel-title">Pataint Info</h3>
   </div>
   <div class="panel-body" id='contentDiv'>
      <div class="row">
         <div id="customerq_no" class="col-md-3 col-lg-3" align="center">
         </div>
         <div class="col-md-9 col-lg-9">
            <table class="table">
               <tbody>
                  <tr>
                     <td>Name:</td>
                     <td id="pid"><?php var_dump($_POST)?></td>
                  </tr>
                  <tr>
                     <td>Gender</td>
                     <td>Male</td>
                  </tr>
                  <tr>
                     <td>Date of Birth</td>
                     <td>01/24/1988</td>
                  </tr>
                  <tr>
                  </tr>
                  <tr>
                     <td>Mobile</td>
                     <td>Metro Manila,Philippines</td>
                  </tr>
                  <tr>
                     <td>Service</td>
                     <td>
                        <select id="roomlist">
                           <option value="-1">Please Select Service</option>
                           <?php foreach (getRoomList() as $row ) {
                              ?>
                           <option value="<?php echo $row['room_id'];?>"><?php echo $row['room_title_en'];?></option>
                           <?php
                              }
                              ?>
                        </select>
                     </td>
                  </tr>
               </tbody>
            </table>
            <a href="#" class="btn btn-primary">Book a site</a>
         </div>
      </div>
   </div>
   <div class="panel-footer">
   </div>
</div>
<script type="text/javascript">
   $(function() {
       $('#submit').click(function() {
        $('#PataintInfo').load('<?php echo $_SERVER['PHP_SELF']?> #contentDiv',{cid: $("#customer_Id").val()});
        return false;
       });

   });
</script>