Question

下面是一个小提琴示例作为起点： http://jsfiddle.net/1ezos4ho/8/

基本上我希望以下内容发生：

选择要动态添加的日期作为输入的值，它就像<input type text value="date selected"....

更新

<script> 
$(function() { // on load function, everything inside here will not run until the pagehas had time to load 
      $("#dpick").datepicker(); //date picker added here at its state its only able to grab the startDate not the end date not sure why

$('.filter').click(function(){ 

                document.getElementById("results").innerHTML = "<div class='loading-indication'><img src='ajax-loader.gif' /> &nbsp; Please wait... Loading New Courses...</div>";

var datastring = $('#testform').serialize(); // this will create key/value pairs to send to the phph page like `duration5=5` with a `&` sepparating each key/value pair 
$('#display-datastring').html(datastring); // this line is just so you can see the variable being created 
$.ajax({ 
url: 'fetch_pages.php', 
type: 'post', 
data: datastring, 
success: function(res){ 

$('#results').html(res); 
} 
}); 


}); 

}); 
</script>

以下是表格：

 <form id="testform"> 

            <input type="text"  placeholder="Start" style="width: 40%;" name="dateStart" class="filter" id="dpick" > 
                            <label id="Paylbl0">To</label>

             <input type="text"  style="width: 40%;" placeholder="End" name="dateEnd" class="filter" id="dpick">

问题是一旦我点击输入时功能就开始运行，只有当它被执行时才会选择日期。出于某种原因，日期选择器仅在开始日期而非结束日期时才会生效。

Answer 1

不确定您是否完全了解插件的工作原理。它会分配值。这是一个快速的警报＆＃34;测试我告诉你。只需选择一个日期。它会监视输入的更改，然后根据 VALUE 提醒所选日期。

提交表单（或根据我的例子通过js获取输入值），它应该可以正常工作。

http://jsfiddle.net/1ezos4ho/11/

一个js示例向您展示......

var i = 3;

$(function() {
    $(".dpick").datepicker();

    $('.dpick').on('change', function() {
        $val = $(this).val();
        alert($val);
    });
});

另外，如果您通过表单提交输入，请务必为输入命名。根据您的评论，您正在执行POST请求，该请求正在查找尚未识别的项目。

简而言之，$_POST['endDate']正在寻找名为endDate的input。

<input type="text" name="startDate" placeholder="Start" style="width: 40%;" class="dpick" id="dpick0" >

<input type="text" name="endDate" style="width: 40%;" placeholder="End" class="dpick" id="dpick1">

使用日期选择器：简单的任务

1 个答案: