ผู้รู้ อาจารย์ ช่วยดูให้ทีครับ สร้างฟอร์มผ่าน Modal ส่งค่าไปอัพเดท Form ไม่ไปไฟล์ action ที่กำหนด พอกด Save อยู่ที่หน้าเดิมครับ
ผู้รู้ อาจารย์ ช่วยดูให้ทีครับ สร้างฟอร์มผ่าน Modal ส่งค่าไปอัพเดท Form ไม่ไปไฟล์ action ที่กำหนด พอกด Save อยู่ที่หน้าเดิมครับ
Code (PHP)
<?php
session_start();
date_default_timezone_set("Asia/Bangkok");
include("config.inc.php") ;
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SM PART</title>
<meta content="A fully featured admin theme which can be used to build CRM, CMS, etc." name="description" />
<meta content="Coderthemes" name="author" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!-- App favicon -->
<link rel="shortcut icon" href="assets/images/favicon.ico">
<!-- Plugin Css-->
<link rel="stylesheet" href="../plugins/magnific-popup/css/magnific-popup.css" />
<link rel="stylesheet" href="../plugins/jquery-datatables-editable/dataTables.bootstrap4.min.css" />
<!-- DataTables -->
<link href="../plugins/datatables/dataTables.bootstrap4.min.css" rel="stylesheet" type="text/css" />
<link href="../plugins/datatables/buttons.bootstrap4.min.css" rel="stylesheet" type="text/css" />
<!-- Responsive datatable examples -->
<link href="../plugins/datatables/responsive.bootstrap4.min.css" rel="stylesheet" type="text/css" />
<!-- App css -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="assets/css/icons.css" rel="stylesheet" type="text/css" />
<link href="assets/css/metismenu.min.css" rel="stylesheet" type="text/css" />
<link href="assets/css/app.css" rel="stylesheet" type="text/css" />
<!-- your custom css -->
<link href="assets/css/style.css" rel="stylesheet" type="text/css" />
<script src="assets/js/modernizr.min.js"></script>
</head>
<body>
<!-- Begin page -->
<div id="wrapper">
<!-- Top Bar Start -->
<?php
include("navbar.php");
?>
<!-- ========== Left Sidebar Start ========== -->
<?php
include("menu.php")
?>
<!-- ============================================================== -->
<!-- Start right Content here -->
<!-- ============================================================== -->
<div class="content-page">
<!-- Start content -->
<div class="content">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="page-title-box">
<h4 class="page-title float-left">ค้นหารายงการตาม วัน.เดือน.ปี</h4>
<div class="clearfix"></div>
</div>
</div>
</div>
<!-- end row -->
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body table-responsive">
<h4 class="m-t-0 header-title mb-4"><b>ค้นหารายการรวม 4 ล้อ และ 6 ล้อ</b></h4>
<script type="text/javascript">
$(function(){
var startDateTextBox = $('#dateStart');
var endDateTextBox = $('#dateEnd');
startDateTextBox.datepicker({
dateFormat: 'yy-mm-dd',
onClose: function(dateText, inst) {
if (endDateTextBox.val() != '') {
var testStartDate = startDateTextBox.datetimepicker('getDate');
var testEndDate = endDateTextBox.datetimepicker('getDate');
if (testStartDate > testEndDate)
endDateTextBox.datetimepicker('setDate', testStartDate);
}
else {
endDateTextBox.val(dateText);
}
},
onSelect: function (selectedDateTime){
endDateTextBox.datetimepicker('option', 'minDate', startDateTextBox.datetimepicker('getDate') );
}
});
endDateTextBox.datepicker({
dateFormat: 'yy-mm-dd',
onClose: function(dateText, inst) {
if (startDateTextBox.val() != '') {
var testStartDate = startDateTextBox.datetimepicker('getDate');
var testEndDate = endDateTextBox.datetimepicker('getDate');
if (testStartDate > testEndDate)
startDateTextBox.datetimepicker('setDate', testEndDate);
}
else {
startDateTextBox.val(dateText);
}
},
onSelect: function (selectedDateTime){
startDateTextBox.datetimepicker('option', 'maxDate', endDateTextBox.datetimepicker('getDate') );
}
});
});
</script>
<form name="frmSearch1" method="get" action="smpart-004.html?=<?php echo $_SERVER['SCRIPT_NAME'];?>">
<div class="form-group row">
<div class="form-group">
<label for="exampleInputEmail1">วันเริ่มต้น</label>
<input type="date" class="form-control" name="dateStart" id="dateStart">
<small id="emailHelp" class="form-text text-muted">เลือกวันที่เริ่มต้นค้นหา</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">วันสิ้นสุด</label>
<input type="date" class="form-control" name="dateEnd" id="dateEnd">
<small id="emailHelp" class="form-text text-muted">เลือกวันที่สุดท้ายค้นหา</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1"> </label>
<button type="submit" class="btn btn-pink form-control">Search</button>
</div>
</div>
<table id="datatable" class="table table-striped table-bordered">
<thead>
<tr>
<th><center>No.</center></th>
<th><center>เลขที่</center></th>
<th>วันที่</th>
<th>เวลา</th>
<th>ชื่อพนักงาน</th>
<th>ทะเบียนรถ</th>
<th>ประเภทรถ</th>
<th>บริษัทผูว่าจ้าง</th>
<th>บริษัทรับงาน</th>
<th>บริษัทส่งงาน</th>
<th>รายละเอียดงาน</th>
<th>สุทธิ</th>
<th>ปรับ</th>
<th>Edit</th>
</tr>
</thead>
<tbody>
<?php
$dateStart = isset($_GET['dateStart']) ? $_GET['dateStart'] : '';
$dateEnd = isset($_GET['dateEnd']) ? $_GET['dateEnd'] : '';
$date = date('Y-m-d', strtotime("-1 days"));
$i = 0;
$strSQL = "SELECT * FROM dayjob
WHERE Date between '".$dateStart."' AND '".$dateEnd."' AND Employer = 'บริษัท A (การตลาด)' AND txtCancel != 'ยกเลิก' AND txtCancel != 'ผ่าน' order by id asc ";
$objQuery = mysqli_query($conn,$strSQL);
?>
<?php
while($objResult = mysqli_fetch_array($objQuery,MYSQLI_ASSOC))
{
$objID = $objResult["ID"];
$i++;
?>
<tr class="gradeU">
<td><?php echo $i;?></td>
<td align="center"><?php echo $objResult["ID"];?></td>
<td><?php echo $objResult["Date"];?></td>
<td><?php echo $objResult["TimeNow"];?></td>
<td><?php echo $objResult["Name"];?></td>
<td><?php echo $objResult["License"];?></td>
<td><?php echo $objResult["Typecar"];?></td>
<td><?php echo $objResult["Employer"];?></td>
<td><?php echo $objResult["Receive"];?></td>
<td><?php echo $objResult["Send"];?></td>
<td><?php echo nl2br($objResult["txtDetail"]);?></td>
<td align="right"><?php echo number_format($objResult["Price"]);?></td>
<td align="right" style="color:#C0392B;"><?php echo number_format($objResult["edit_price"]);?></td>
<td>
<div class="modal fade bs-example-modal-center" id="formEditPrice">
<div class="modal-dialog modal-dialog-centered">
<form action="save-editprice.php" method="post">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Price Adjustment (แก้ไขราคา)</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<?php
$dateStart = isset($_GET['dateStart']) ? $_GET['dateStart'] : '';
$dateEnd = isset($_GET['dateEnd']) ? $_GET['dateEnd'] : '';
?>
<div class="modal-body">
<div class="form-group">
<label>รหัสลำดับ</label>
<input type="text" class="form-control" name="id" id="id" required disabled="disabled">
<small class="form-text text-muted">โปรดเช็คลำดับการจ้างงานเพื่อความถูกต้อง</small>
<input type="text" class="form-control" name="dateStart" id="dateStart" required disabled="disabled" value="<?php echo $dateStart;?>">
<input type="text" class="form-control" name="dateEnd" id="dateEnd" required disabled="disabled" value="<?php echo $dateEnd;?>">
</div>
<div class="form-group">
<label>ราคาที่ปรับ</label>
<input type="text" class="form-control" name="edit_price" id="edit_price" required>
<small class="form-text text-muted">ระบุราคาที่ต้องการปรับ เพื่อยืนยัน</small>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default waves-effect" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary waves-effect waves-light">Save changes</button>
</div>
</div><!-- /.modal-content -->
</form>
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<div class="button-list">
<!-- Button trigger modal -->
<center>
<a href="#" class="edit-prices"
data-id ="<?php echo $objResult["ID"];?>"
data-edit_price ="<?php echo $objResult["edit_price"];?>"
data-dateStart ="<?php echo $dateStart;?>"
data-dateEnd ="<?php echo $dateEnd;?>">
<i class="fas fa-pencil-alt" style="color:#3498DB;"></i>
</a>
</center>
</div>
</td>
</tr>
<?php }?>
</tbody>
<tfoot>
<tr>
<th colspan="10" style="text-align:right">Total:</th>
<th style="text-align:right"></th>
<th style="text-align:right"> </th>
<th style="text-align:right"></th>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
</div>
<!-- end row -->
</div> <!-- container -->
</div> <!-- content -->
<footer class="footer text-right">
-------
</footer>
</div>
<!-- ============================================================== -->
<!-- End Right content here -->
<!-- ============================================================== -->
</div>
<!-- END wrapper -->
<!-- jQuery -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/metisMenu.min.js"></script>
<script src="assets/js/waves.js"></script>
<script src="assets/js/jquery.slimscroll.js"></script>
<!-- Examples -->
<script src="../plugins/magnific-popup/js/jquery.magnific-popup.min.js"></script>
<script src="../plugins/datatables/jquery.dataTables.min.js"></script>
<script src="../plugins/datatables/dataTables.bootstrap4.min.js"></script>
<script src="../plugins/tiny-editable/mindmup-editabletable.js"></script>
<script src="../plugins/tiny-editable/numeric-input-example.js"></script>
<!-- Responsive examples -->
<script src="../plugins/datatables/dataTables.responsive.min.js"></script>
<script src="../plugins/datatables/responsive.bootstrap4.min.js"></script>
<!-- App js -->
<script src="assets/js/jquery.core.js"></script>
<script src="assets/js/jquery.app.js"></script>
<script src="assets/js/modaledit.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#datatable').dataTable({
"lengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
"footerCallback": function ( row, data, start, end, display ) {
var api = this.api(), data;
// Remove the formatting to get integer data for summation
var intVal = function ( i ) {
return typeof i === 'string' ?
i.replace(/[\฿,]/g, '')*1 :
typeof i === 'number' ?
i : 0;
};
// Total over all pages
var numFormat = $.fn.dataTable.render.number( '\,', '.' ).display;
total = api
.column( 11 )
.data()
.reduce( function (a, b) {
return intVal(a) + intVal(b);
}, 0 );
// Total over this page
pageTotal = api
.column( 11, { page: 'current'} )
.data()
.reduce( function (a, b) {
return intVal(a) + intVal(b);
}, 0 );
// Update footer
$( api.column( 11 ).footer() ).html(
numFormat(+pageTotal +' ')
);
// Total over all pages
var numFormat = $.fn.dataTable.render.number( '\,', '.' ).display;
total2 = api
.column( 12 )
.data()
.reduce( function (a, b) {
return intVal(a) + intVal(b);
}, 0 );
// Total over this page
pageTotal2 = api
.column( 12, { page: 'current'} )
.data()
.reduce( function (a, b) {
return intVal(a) + intVal(b);
}, 0 );
// Update footer
$( api.column( 12 ).footer() ).html(
numFormat(+pageTotal2 +' ')
);
$('.edit-prices').click(function(){
//get data from edit btn
var id = $(this).attr('data-id');
var edit_price = $(this).attr('data-edit_price');
var dateStart = $(this).attr('data-dateStart');
var dateEnd = $(this).attr('data-dateEnd');
//set value to modal
$('#id').val(id);
$('#edit_price').val(edit_price);
$('#dateStart').val(dateStart);
$('#dateEnd').val(dateEnd);
$('#formEditPrice').modal('show');
});
}
});
} );
</script>
</body>
</html>
Tag : PHP, MySQL, JavaScript
ประวัติการแก้ไข 2022-06-21 20:09:16
Date :
2022-06-20 17:31:33
By :
ncompon
View :
474
Reply :
7
ตัด code แค่ modal มาดูครับ
Date :
2022-06-20 17:40:54
By :
mongkon.k
Code Modal ครับ
Code (PHP)
<div class="modal fade bs-example-modal-center" id="formEditPrice">
<div class="modal-dialog modal-dialog-centered">
<form action="save-editprice.php" method="post">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Price Adjustment (แก้ไขราคา)</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>รหัสลำดับ</label>
<input type="text" class="form-control" name="id" id="id" required disabled="disabled">
<small class="form-text text-muted">โปรดเช็คลำดับการจ้างงานเพื่อความถูกต้อง</small>
</div>
<div class="form-group">
<label>ราคาที่ปรับ</label>
<input type="text" class="form-control" name="edit_price" id="edit_price" required>
<small class="form-text text-muted">ระบุราคาที่ต้องการปรับ เพื่อยืนยัน</small>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default waves-effect" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary waves-effect waves-light">Save changes</button>
</div>
</div><!-- /.modal-content -->
</form>
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
ประวัติการแก้ไข 2022-06-20 17:48:20 2022-06-20 17:48:25 2022-06-20 17:48:31 2022-06-20 17:48:36 2022-06-20 17:48:52
Date :
2022-06-20 17:43:44
By :
ncompon
id="formEditPrice"
มันซ้ำกันครับ เพราะ loop เลยทำให้มันทำงานไม่ถูก
Date :
2022-06-20 23:05:01
By :
mongkon.k
id ซ้ำ
Code (JavaScript)
let id = $(this).data('id');
let edit_price = $(this).data('edit_price');
let dateStart = $(this).data('dateStart');
let dateEnd = $(this).data('dateEnd');
Date :
2022-06-21 11:26:05
By :
Guest
ทำได้แล้วครับ ต้องเอา modal ออกมาไว้ข้างนอกครับ
Date :
2022-06-22 09:39:26
By :
ncompon
Load balance : Server 04