我有一个dataTable,将其行传递给模式。是否可以使用相同的模式脚本将其直接传递到php页面?
这是我的main_page.php
<table id="example1" class="table table-bordered">
<thead>
<th>Reference No</th>
<th>Finger Scan No</th>
<th>Date From</th>
<th>Date To </th>
<th>Tools </th>
</thead>
<tbody>
<?php
$user = $user['fingerscanno'];
$sql = "
SELECT
payroll.payrollno AS payrollno,
payroll.referenceno AS referenceno,
payroll.fingerscanno AS fingerscanno,
payroll.datefrom AS datefrom,
payroll.dateto AS dateto,
USERINFO.USERID,
USERINFO.BADGENUMBER
FROM
payroll,
USERINFO
WHERE
USERINFO.BADGENUMBER = payroll.fingerscanno AND
payroll.fingerscanno='$user'
";
$query = sqlsrv_query($conn, $sql, array(), array("Scrollable" => SQLSRV_CURSOR_KEYSET));
while($row = sqlsrv_fetch_array($query, SQLSRV_FETCH_ASSOC)){
echo "
<tr>
<td>".$row['referenceno']."</td>
<td>".$row['fingerscanno']."</td>
<td>".$row['datefrom']."</td>
<td>".$row['dateto']."</td>
<td>
<button class='btn btn-success btn-sm edit btn-flat' data-id='".$row['referenceno']."'><i class='fa fa-edit'></i> Proof of Attendance</button>
<button class='btn btn-danger btn-sm delete btn-flat' data-id='".$row['referenceno']."'><i class='fa fa-edit'></i> Payslip Summary</button>
</td>
</tr>
";
}
?>
</tbody>
</table>
<?php include 'includes/mymodal.php'; ?>
这是模态函数
$(function(){
$("body").on('click', '.edit', function (e){
e.preventDefault();
$('#edit').modal('show');
var id = $(this).data('id');
getRow(id);
});
这是模式页面
mymodal.php
<div class="modal fade" id="edit">
<input type="hidden" class="decid" id="id" name="id">
<table id="example2" class="table table-bordered">
<thead>
<th>Schedule Date</th>
<th>Schedule Name</th>
<th>Recorded In</th>
<th>Recorded Out</th>
<th>Day Count</th>
<th>Day Value</th>
<th>N.D. Value</th>
<th>Leave Count</th>
<th>R.H. Count</th>
<th>R.H. Value</th>
</thead>
<tbody>
<?php
$sql = "SELECT fingerscanno, scheduledate, schedulename, recordin, recordout, noofdays, rate, nightdifferential, leaveday, regularholiday, specialholiday, referenceno
FROM payrollrecords WHERE fingerscanno='$user' and referenceno='$id'";
$query = sqlsrv_query($conn, $sql, array(), array("Scrollable" => SQLSRV_CURSOR_KEYSET));
while($row = sqlsrv_fetch_array($query, SQLSRV_FETCH_ASSOC)){
echo "
<tr>
<td>".$row['scheduledate']."</td>
<td>".$row['schedulename']."</td>
<td>".$row['recordin']."</td>
<td>".$row['recordout']."</td>
<td>".$row['noofdays']."</td>
<td>".$row['rate']."</td>
<td>".$row['nightdifferential']."</td>
<td>".$row['leaveday']."</td>
<td>".$row['regularholiday']."</td>
<td>".$row['specialholiday']."</td>
</tr>
";
}
?>
</tbody>
</table>
</div>
我的问题是,如何将其传递到桌子上?这样该变量referenceno='$id'
将从主页接收值。
您需要使用AJAX。
Ajax是一种javascript方法,可让您与尝试进行后端PHP文件交换信息。
AJAX代码块将数据发送到mymodal.php
文件,该mymodal.php
文件将执行MySQL查找并创建HTML,然后将echo
一个字符串变量(可以是json对象,也可以是您在while循环中构建的HTML)返回主页。AJAX代码块将接收从.done()
函数内部的PHP文件中回显的数据,并且在该函数中,您也可以修改DOM以注入新数据。对于用户来说,看起来就像他们单击具有class的元素,edit
而数据只是出现在模态中一样。
请注意,您不在页面中include
的mymodal.php
文件中main_file.php
,因为AJAX代码块知道如何与该文件通信。
您需要将模式的HTML结构添加到主页底部(请注意,其最初设置为display:none
):
<style>
#lamodal{display:none;position:fixed;width:100vw;height:100vh;background:black;opacity:0.8;}
#mdl_inner{width:60%;height:40%;}
.myflex{display:flex;align-items:center;justify-content:center;}
</style>
<div id="lamodal" class="myflex">
<div id="mdl_inner"></div>
</div><!-- #lamodal -->
您的JavaScript(AJAX)如下所示:
$(function(){
$("body").on('click', '.edit', function (e){
e.preventDefault();
var id = $(this).data('id');
$.ajax({
type: 'post',
url: 'mymodal.php',
data: 'userid=id'
}).done(function(d){
//console.log('d: '+d);
$('#mdl_inner').html(d);
$('#lamodal').show();
});
});
});
您的mymodal.php
文件将更改为如下所示:
<?php
$sql = "SELECT fingerscanno, scheduledate, schedulename, recordin, recordout, noofdays, rate, nightdifferential, leaveday, regularholiday, specialholiday, referenceno
FROM payrollrecords WHERE fingerscanno='$user' and referenceno='$id'";
$query = sqlsrv_query($conn, $sql, array(), array("Scrollable" => SQLSRV_CURSOR_KEYSET));
$out = '
<table id="example2" class="table table-bordered">
<thead>
<th>Schedule Date</th>
<th>Schedule Name</th>
<th>Recorded In</th>
<th>Recorded Out</th>
<th>Day Count</th>
<th>Day Value</th>
<th>N.D. Value</th>
<th>Leave Count</th>
<th>R.H. Count</th>
<th>R.H. Value</th>
</thead>
<tbody>
';
while($row = sqlsrv_fetch_array($query, SQLSRV_FETCH_ASSOC)){
$out .= '
<tr>
<td>".$row['scheduledate']."</td>
<td>".$row['schedulename']."</td>
<td>".$row['recordin']."</td>
<td>".$row['recordout']."</td>
<td>".$row['noofdays']."</td>
<td>".$row['rate']."</td>
<td>".$row['nightdifferential']."</td>
<td>".$row['leaveday']."</td>
<td>".$row['regularholiday']."</td>
<td>".$row['specialholiday']."</td>
</tr>
';
}
$out .= '
</tbody>
</table>
';
echo $out;
?>
注意我们如何构造一个字符串变量并通过隐式构造它。完成后,Justecho $out
和新构建的HTML将出现在.done()
AJAX代码块的功能中。
请参阅以下其他AJAX示例和说明:
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句