Postingan lainnya
Buku Ini Koding!
Baru!
Buku ini akan jadi teman perjalanan kamu belajar sampai dapat kerjaan di dunia programming!
edit tanggal (datepicker) dengan modal ajax
mohon bantuannya, saya buat modal edit dengan bootstrap... tp kenapa ketika coba input/tekan pada form modal, input bagian tgl otomatis berubah jd tanggal hari ini.. bagian table:
<div class="panel panel-default">
<div class="panel-body">
<div class="table-responsive" >
<table class="table table-bordered table-hover table-striped" id="datatables">
<thead>
<tr>
<th>No.</th>
<th>kode produk</th>
<th>nama produk</th>
<th>tanggal reject</th>
<th>Jumlah Resize</th>
<th>Jumlah HWG</th>
<th>Total Reject</th>
<th>tonase</th>
<th>Opsi</th>
</tr>
</thead>
<tbody>
<?php
$tampil=mysqli_query($konek, "SELECT * from det_sortir_tmp r inner join tb_produk p on r.kd_prdk = p.kd_prdk where ket_sortir='reject' order by r.kd_prdk asc");
$no=1;
while ($r=mysqli_fetch_assoc($tampil)){
$tgl_reject = $r[tgl_reject];
$tgl= date('d-m-Y', strtotime($tgl_reject));
?>
<tr>
<td align="center"><?php echo $no++; ?></td>
<td><?php echo $r[kd_prdk]; ?></td>
<td><?php echo $r[nm_prdk]; ?></td>
<td><?php echo $tgl; ?></td>
<td><?php echo $r[jml_resize]; ?></td>
<td><?php echo $r[jml_hwg]; ?></td>
<td><?php echo $r[jml_sortir]; ?></td>
<td><?php echo $r[ton_sortir]; ?></td>
<td align="center">
<a id="edit_detail" title = "Edit" class ="btn btn-success btn-sm" data-toggle="modal" data-target="#edit" data-kd="<?php echo $r[kd_detail]; ?>" data-prd="<?php echo $r[kd_prdk]; ?>" data-nama="<?php echo $r[nm_prdk]; ?>" data-tgl="<?php echo date('d-m-Y', strtotime($r[tgl_reject]));?>" data-res="<?php echo $r[jml_resize]; ?>" data-hwg="<?php echo $r[jml_hwg]; ?>" data-brt="<?php echo $r[brt_prdk]; ?>">
<span class="glyphicon glyphicon-edit" aria-hidden="true"></span></a>
<a title = "Hapus" class ="btn btn-danger btn-sm" href="?page=tambah-reject&act=del&kd=<?php echo $r[kd_detail]; ?>" onclick="return confirm('Yakin akan menghapus data?')">
<span class="glyphicon glyphicon-trash" aria-hidden="true"></span></a>
</td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
</div>
</div>
bagian ajax :
$(document).on("click", "#edit_detail", function() {
var kdrec = $(this).data('kd');
var kdprd = $(this).data('prd');
var nmprd = $(this).data('nama');
var tglrec = $(this).data('tgl');
var jmlres = $(this).data('res');
var jmlhwg = $(this).data('hwg');
var brtrec = $(this).data('brt');
$("#modal-edit #kd_detail").val(kdrec);
$("#modal-edit #kd_prdk").val(kdprd);
$("#modal-edit #nm_prdk").val(nmprd);
$("#modal-edit #jml_resize").val(jmlres);
$("#modal-edit #jml_hwg").val(jmlhwg);
$("#modal-edit #tgl_reject").val(tglrec);
$("#modal-edit #brt_prdk").val(brtrec);
})
$(document).ready(function(e){
$("#form").on("submit", (function(e){
e.preventDefault();
$.ajax({
url :'moduls/edit_detailreLoad.php',
type : 'POST',
data : new FormData(this),
contentType : false,
cache : false,
processData : false,
success : function(msg) {
$('.table').html(msg);
}
})
}))
})
bagian modal :
<div id="edit" class="modal fade" role="dialog">
<div class="modal-dialog" >
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal--title">Edit Data Produk</h4>
</div>
<form id="form" enctype="multipart/form-data">
<div class="modal-body" id="modal-edit">
<div class="form-group row">
<label class="col-sm-4 col-form-label">Kode produk</label>
<div class="col-sm-4">
<input type="hidden" class="form-control" name="kd_detail" id ="kd_detail" class="form-control">
<input type="text" class="form-control" name="kd_prdk" id ="kd_prdk" class="form-control" readonly="readonly">
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">Nama produk</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="nm_prdk" id ="nm_prdk" class="form-control" readonly="readonly">
<input type="hidden" class="form-control" name="brt_prdk" id="brt_prdk" >
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">Tanggal Reject</label>
<div class="col-sm-4">
<div class="input-group">
<input type="text" name="tgl_reject" id="tgl_reject" class="input-group date form-control" >
<span class="input-group-addon">
<i class="glyphicon glyphicon-calendar"></i>
</span>
</div>
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">Jumlah</label>
<div class="col-sm-3">
<input type="number" class="form-control" name="jml_resize" id ="jml_resize" >
</div>
<div class="col-sm-3">
<input type="number" class="form-control" name="jml_hwg" id="jml_hwg" >
</div>
</div>
</div>
<div class="modal-footer">
<input type="submit" class="btn btn-success" name="edit" value="simpan">
</div>
</form>
</div>
</div>
</div>
0
2 Jawaban:
coba jawab ya, di lihat dulu kalo class date di form nya ada format date nya ga? defaultnya date picker spertinya "d/m/Y"
sepertinya script format tanggalnya sudah betul.
0
datepickernya :
<script type="text/javascript">
$('.date').datepicker({
format: 'dd-mm-yyyy',
autoclose:true,
todayHighlight: true,
orientation: "top auto",
todayBtn: true,
todayHighlight: true,
});
$(document).ready(function(){
$('#datatables').DataTable();
});
</script>
0