2016-01-29 103 views
2
<?php 
if(isset($_POST['date'])) { 
    $date = strtotime($_POST['date']); 
    $day = strtolower(date("D", $date)); 
} 
?> 
<script> 
$(function() { 
    $("#datepicker").datepicker($.extend({ 
     constrainInput: true, 
     altField: ".alternate", 
     altFormat: "yy-mm-dd", 
     minDate: 0, 
     firstDay: 1, 
     onSelect:function(dateText,instance) { 
      $.post("index.php", { date:dateText }, 
        function(data) { 
         $('#txtHint').html(''); 
         $('#txtHint').html(data); 
        }); 
     } 
    }, 
    )); 
}); 
</script> 

我想在DIV #txtHint中顯示datepicker發佈數據。它的工作原理,但它將整個頁面的HTML張貼到這個div。我只希望發佈的信息被內<div id="txtHint"></div>jQuery發佈數據到div

這裏顯示的是index.php文件:

<?php 
$today = strtotime(date("d-m-Y")); 
$now = strtotime(date("H:i")); 
$before = "-".$settings['close_before']." hours"; 
if(isset($_POST['date'])) { 
    $date = strtotime($_POST['date']); 
    $day = strtolower(date("D", $date)); 
    // THIS HERE SHOULD BE RETURNED TO TXTHINT DIV BELOW IN FORM 
    echo "<select name=\"time\" class=\"form-control\" disabled>"; 
    echo "<option value=\"\">".$day."</option>"; 
    echo "</select>"; 
} 
?> 
<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <title>form</title> 
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> 
    <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
    <script src="js/jquery.ui.datepicker-da.js"></script> 
    <!--[if lt IE 9]> 
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script> 
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
    <![endif]--> 
    <script> 
    $(function() { 
     $("#datepicker").datepicker($.extend({ 
     constrainInput: true, 
     altField: ".alternate", 
     altFormat: "yy-mm-dd", 
     minDate: 0, 
     firstDay: 1, 
     onSelect:function(dateText,instance) { 
      $.post("index.php", { date:dateText }, 
      function(data) { 
       var obj = $(data); 
        $("#txtHint").html(obj.find("didHint").html()); 
       }); 
       } 
     } 
     )); 
    }); 
    </script> 
</head> 
<body> 
<form role="form" method="post" action="index.php"> 
    <div class="box-body"> 
      <div class="form-group"> 
       <div class="row"> 
        <div class="col-sm-4"> 
         <div class="input-group"> 
          <span class="input-group-addon text-bold uppercase"><i class="fa fa-calendar"></i> <small><i class="fa fa-asterisk text-red"></i></small></span> 
          <input id="datepicker" type="text" class="form-control date"> 
          <input name="date" class="alternate" type="hidden"> 
         </div> 
        </div> 
        <div class="col-sm-4"> 
         <div class="input-group"> 
          <span class="input-group-addon text-bold uppercase" style="border: none !important;"><i class="fa fa-clock-o"></i> <small><i class="fa fa-asterisk text-red"></i></small></span> 
          <!-- HERE IS WHERE POSTED SELECT SHOULD APPEAR --> 
          <div id="txtHint"> 
           <select name="time" class="form-control" disabled> 
            <option value="" selected disabled>Select date first</option> 
           </select> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 
      <div class="form-group"> 
       <button type="submit" name="goforit" class="btn btn-success pull-right text-bold" style="text-transform: uppercase;">submit</button> 
      </div> 
     </div> 
</form> 
</body> 
</html> 

我特別希望它是在一個頁面。不爲外部數據調用外部腳本。 任何人都可以建議?

回答

1

更改index.php因此它在響應AJAX請求後退出,並且不打印完整的HTML文件。

<?php 
$today = strtotime(date("d-m-Y")); 
$now = strtotime(date("H:i")); 
$before = "-".$settings['close_before']." hours"; 
if(isset($_POST['date'])) { 
    $date = strtotime($_POST['date']); 
    $day = strtolower(date("D", $date)); 
    // THIS HERE SHOULD BE RETURNED TO TXTHINT DIV BELOW IN FORM 
    echo "<select name=\"time\" class=\"form-control\" disabled>"; 
    echo "<option value=\"\">".$day."</option>"; 
    echo "</select>"; 

    exit(); // <<=== Add this 
} 
?> 
+0

這並沒有幫助我。它不會加載數據,就好像它沒有發佈一樣...... –

+0

我想你需要顯示'index.php'返回的內容,並解釋你想要放入'#txtHint'的哪一部分。 – Barmar

+0

這是我的index.php http://pastebin.com/2zeBCC7y –