我需要一个帮助。我有一个json array，我需要使用Jquery在动态创建的日期字段中的JSON array中添加一些日期值。我在下面解释我的代码。
$depdate=[
{
"sett_id":"270",
"sett_name":"Car",
"sett_type":"vtypes",
"id":"6",
"dep_dates":"31-10-2018,07-11-2018,14-11-2018,21-11-2018,28-11-2018",
"vehicle_type":"270"
},
{
"sett_id":"271",
"sett_name":"Bus",
"sett_type":"vtypes",
"id":"7",
"dep_dates":"01-11-2018,08-11-2018,22-11-2018,15-11-2018,29-11-2018,06-12-2018",
"vehicle_type":"271"
}]
这是我的JSON array值，具有键dep_dates，它包含所有逗号分隔的日期。我在下面解释代码。
<?php foreach ($depdate as $key => $value) {
$dep_date=explode(",",$value['dep_dates']);
//print_r($dep_date);exit;
?>
<tr>
<td><?php echo $key+1; ?></td>
<td><?php echo $value['sett_name']; ?></td>
<td><div class="input_fields_wrap<?php echo $key+1; ?> form-horizontal"><div style="margin-bottom: 5px;"><input type="text" name="ddate_<?php echo $value['sett_id']; ?>[]" value="" class="depdate<?php echo $key+1; ?> form-control" style="width:280px;max-width:280px;display:inline-block"><button type="button" class="add_field_button<?php echo $key+1; ?> btn btn-primary" style="margin-left: 2px; margin-top: -5px;min-height: 30px;"><i class="fa fa-plus"></i></button></div></div></td>
<input type="hidden" name="vid_<?php echo $value['sett_id']; ?>_id" value="<?php echo $value['sett_id']; ?>" >
</tr>
<script>
$(function(){
var addButton = $('.add_field_button<?php echo $key+1; ?>');
var wrapper = $('.input_fields_wrap<?php echo $key+1; ?>');
var nowTemp = new Date();
var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);
$(addButton).click(function(){
$(wrapper).append('<div style="margin-bottom: 5px;"><input type="text" name="ddate_<?php echo $value['sett_id']; ?>[]" value="" class="depdate<?php echo $key+1; ?> form-control" style="width:280px;max-width:280px;display:inline-block"/><button type="button" class="remove_field<?php echo $key+1; ?> btn btn-danger" style="margin-left: 2px; margin-top: -5px;min-height: 30px;"><i class="fa fa-minus"></i></button></div>'); //add input box
$('.depdate<?php echo $key+1; ?>').datepicker({
format: 'dd-mm-yyyy',
onRender: function(date) {
return date.valueOf() < now.valueOf() ? 'disabled' : '';
}
});
})
$(wrapper).on('click', '.remove_field<?php echo $key+1; ?>', function(e){
e.preventDefault();
$(this).parent('div').remove();
})
$('.depdate<?php echo $key+1; ?>').datepicker({
format: 'dd-mm-yyyy',
onRender: function(date) {
return date.valueOf() < now.valueOf() ? 'disabled' : '';
}
});
})
</script>
<?php } ?>
这里有一个带有+按钮的日期字段，当用户单击该日期字段时，将创建一个新字段。在这里，我的要求是如果dep_dates有任何值，它将转换为数组，并且日期字段将根据日期值的编号动态创建，并且这些值将追加到该字段中。实际上，这就是update功能。请帮我做到这一点。
答案 0 :(得分：0)
您快要接近了，您想将数据从$depdate json填充到datepicker文本框。
解决方案：
sett_id并读取json值dep_dates转换为数组datepicker 请检查下面的HTML代码（阅读注释行）：
$(document).ready(function () {
$depdate = [
{
"sett_id": "270",
"sett_name": "Car",
"sett_type": "vtypes",
"id": "6",
"dep_dates": "31-10-2018,07-11-2018,14-11-2018,21-11-2018,28-11-2018",
"vehicle_type": "270"
},
{
"sett_id": "271",
"sett_name": "Bus",
"sett_type": "vtypes",
"id": "7",
"dep_dates": "01-11-2018,08-11-2018,22-11-2018,15-11-2018,29-11-2018,06-12-2018",
"vehicle_type": "271"
}]
});
$(function () {
var addButton = $('.add_field_button1');
var wrapper = $('.input_fields_wrap1');
var nowTemp = new Date();
var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);
$(addButton).click(function () {
var sett_id = 0;///Apply PHP code here
var myDatesArr = $depdate[sett_id].dep_dates.split(',');///Read json file and convert date into array
var crrDatePosition = $('.input_fields_wrap1 .datepicker').length;//Get total existing datepicker
$(wrapper).append('<div style="margin-bottom: 5px;"><input type="text" name="ddate_' + sett_id + '" value="' + myDatesArr[crrDatePosition] + '" class="depdate1 datepicker form-control" style="width:280px;max-width:280px;display:inline-block"/><button type="button" class="remove_field1 btn btn-danger" style="margin-left: 2px; margin-top: -5px;min-height: 30px;">-</button></div>'); //add input box
$('.depdate1').datepicker({
format: 'dd-mm-yyyy',
onRender: function (date) {
return date.valueOf() < now.valueOf() ? 'disabled' : '';
}
});
})
$(wrapper).on('click', '.remove_field1', function (e) {
e.preventDefault();
$(this).parent('div').remove();
})
$('.depdate1').datepicker({
format: 'dd-mm-yyyy',
onRender: function (date) {
return date.valueOf() < now.valueOf() ? 'disabled' : '';
}
});
})<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/datepicker.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/datepicker.js"></script>
<table border="1">
<tr>
<td>1</td>
<td>Something <input type="hidden" name="vid_1_id" value="1"></td>
<td>
<div class="input_fields_wrap1 form-horizontal">
<div style="margin-bottom: 5px;">
<input type="text" name="ddate_1" value="" class="depdate1 form-control" style="width:280px;max-width:280px;display:inline-block">
<button type="button" class="add_field_button1 btn btn-primary" style="margin-left: 2px; margin-top: -5px;min-height: 30px;">Click here to add</button>
</div>
</div>
</td>
</tr>
</table>
您可以看到var sett_id = 0;被零静态地应用，您需要更改其PHP值。