使用UI Datepicker在输入字段的值中获取所选日期ID(来自数据库)

时间:2012-09-16 07:24:33

标签: javascript date input datepicker

我有一个注册表单,人们可以从中选择从数据库中选择的多个日期。我使用jQuery UI Datepicker。一切正常,但是当我提交表单时,它会像我一样保存日期:"09/16/2012,08/04/2011,04/19/1994"。我想存储日期的ID。

有谁知道如何获取所选日期的ID,并将其放在value=""属性中?

<input type="text" class="datepicker" name="live[]" value="">

<script>
var dates = [<?php $i=0; while($dataDate = mysql_fetch_object($dates)) : echo ($i>0) ?  ", " : ""; echo '"'.date("n-j-Y", strtotime($dataDate->date)).'"'; $i++; endwhile;?>];
var enabledDays = dates;
function enableAllTheseDays(date) {
var m = date.getMonth(), d = date.getDate(), y = date.getFullYear();
for (i = 0; i < enabledDays.length; i++) {
    if($.inArray((m+1) + '-' + d + '-' + y,enabledDays) != -1) {
        return [true];
    }
}
return [false];
}
$('.datepicker').datepicker({
    beforeShowDay: enableAllTheseDays,
    yearRange: "1994:2012",
    changeMonth: true,
    changeYear: true
});
</script>

1 个答案:

答案 0 :(得分:0)

好的,这是完全新的方法,以获得理想的结果。 首先,将日期放在json obejct中。

使您的SQL查询从数据库中选择id,date 现在,如果您有php json,请使用

<?php   
while($row = mysql_fetch_object($query) ) {
    $data[] = array( "id" => $row['id'], "date" => $row['date'] );
}

echo "var dates = [" . json_encode($data) . "];";
?>

否则你可以这样做:

<?php
echo "var dates = [";
while($row = mysql_fetch_object($query) ) {
    $data[] = '{"id" : "' .$row["id"] . '", "date" : "' . $row["date"] . '" }';
}
echo implode(',', $data);
echo "];";
?>

现在我们得到的json对象应该看起来像

[{"id" : "12", "date": "2012-02-01"},{"id" : "33", "date": "2012-02-03"}]

我稍微调整了你的函数,使用我们的json对象

function enableAllTheseDays(date) {
    var m = date.getMonth(), d = date.getDate(), y = date.getFullYear();
    var datestr = y + "-" + m + "-" + d;
    for (i = 0; i < dates.length; i++) {
        if( dates[i].date == datestr) {
            return [true];
        }
    }
    return [false];
}

$('.datepicker').datepicker({
    beforeShowDay: enableAllTheseDays,
    yearRange: "1994:2012",
    changeMonth: true,
    changeYear: true
});

现在回到获取id

$('.datepciker').on('change',function() {
    for(var i = 0; i < dates.length; i++) {
        if( dates[i].date == $(this).val() )
        var index = dates[i].id;
    }

    $("#date_id_holder").val( index );

    });

现在您的$(“#date_id_holder”)包含所选日期的ID