【问题标题】:how to create link edit datatables and ajax.如何创建链接编辑数据表和 ajax。
【发布时间】:2016-06-08 01:52:42
【问题描述】:

我还是数据表和 ajax 的新手。我想问的是如何让每一行数据的编辑链接都显示在datatables中? 我在 pc_list_barcode.php 页面上写了一个查询。 daftar_barcode.php 页面显示查询结果。

<?php 
include "class/connect_sql.class.php";
if( isset( $_SERVER['HTTP_X_REQUESTED_WITH'] ) && ( $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest' ) )
{


    
    $query = mssql_query("select TOP 30 barcode_wo_nmr, barcode_wo_line,wo_wks_desc,
			barcode_wo_proses, barcode_npk, barcode_start, barcode_pending, barcode_end,barcode_qty,barcode_ng,barcode_reason_pending
			from WO_ENG_BARCODE, WO_ENG_DET, WO_ENG_DET_WKS  with(nolock) where 
			barcode_wo_nmr= WO_DET_NOMOR and barcode_line = wo_det_line and 
			 barcode_wo_nmr = wo_wks_nmr and WO_DET_NOMOR = wo_wks_nmr and barcode_wo_line = wo_wks_line and WO_DET_NAMA_BARANG = wo_wks_barang and right(barcode_wo_nmr,2) = '15'
			order by barcode_wo_nmr asc");
    $jsonResult = '{"data" : [ ';
    $i=0;
    while ($data=mssql_fetch_assoc($query)) 
	{
       if($i != 0)
	  {
           $jsonResult .=',';
       }
       $jsonResult .=json_encode($data);
       $i++;
	   $data['barcode_wo_nmr'];
	  $data['wo_wks_desc'];
	  $data['barcode_wo_line'];
	  $data['barcode_wo_proses'];
	  $data['barcode_npk'];
	  $data['barcode_start'];
	  $data['barcode_pending'];
	  $data['barcode_end'];
	  $data['barcode_qty'];
	  $data['barcode_ng'];
	  $data['barcode_reason_pending'];
	   
   }
    $jsonResult .= ']}';
    echo $jsonResult;
} 
else {
    echo '<script>window.location="404.html"</script>';
}
?>
<!doctype html>
<html>
    <head>
        <title>Work Order</title>
        <link rel="stylesheet" href="asset/media/css/bootstrap.min.css"/>
        <link rel="stylesheet" href="asset/media/css/dataTables.bootstrap.css"/>
    </head>
    <body>
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            
                            <div class="btn-group pull-right">
                                <a href="#">Add</a>
                            </div>
                        </div>
                        <!-- /.panel-heading -->
                        <div class="panel-body">
                            <div class="table-responsive">
                                <table class="table table-striped table-bordered table-hover" id="provinsi">
                                    <thead>
                                        <tr>
                                            <th>No WO</th>
                                            <th>Deskripsi</th>
											 <th>Line</th>
                                            <th>Proses</th>
											 <th>NPK</th>
                                            <th>Mulai</th>
											 <th>Pending</th>
                                            <th>Selesai</th>
											 <th>QTY</th>
                                            <th>Not Good</th>
											 <th>Reason</th>
											  <th>Action</th>
                                          
											
                                        </tr>
                                    </thead>
                                </table>
                            </div>
                        </div>
                        <!-- /.panel-body -->
                    </div>
                    <!-- /.panel -->
                </div>
                <!-- /.col-lg-12 -->
            </div>
        </div>
        
        <script src="asset/script/jquery-2.1.4.min.js"></script>
        <script src="asset/bootstrap-3.3.6-dist/bootstrap.min.js"></script>
        <script src="asset/media/js/jquery.dataTables.js"></script>
        <script src="asset/media/js/dataTables.bootstrap.js"></script>
        <script>
            $(document).ready(function() {
                var t = $('#provinsi').DataTable( {
                    "ajax": "pc_list_barcode.php",
                    "order": [[ 1, 'asc' ]],
                    "columns": [
                        { 
                            "data": "barcode_wo_nmr",
                            "width": "120px",
                            "sClass": "text-center"
                        },
                        { "data": "wo_wks_desc" },
						{ "data": "barcode_wo_line" },
						{ "data": "barcode_wo_proses" },
						{ "data": "barcode_npk" },
						{ "data": "barcode_start" },
						{ "data": "barcode_pending" },
						{ "data": "barcode_end" },
						{ "data": "barcode_qty" },
						{ "data": "barcode_ng" },
						{ "data": "barcode_reason_pending" },
						// {"data": return '<a href="edit_barcode.php?id=' + row.id + '">EDIT</a>' },
                    ]
                } );
            } );
        </script>
    </body>
</html>

【问题讨论】:

    标签: php jquery json ajax datatables


    【解决方案1】:

    您的数据有 11 个字段,您的表头有 12 个字段,您的 DataTable 初始化有 9 或 10 个字段...如果您想将调整后的 html 返回到一行中,您需要一个渲染函数,根据您的描述它应该大概是这样的:

    {
        "data": "unique_id",
        "render": function(data){
            return '<a href="edit_barcode.php?id=' + data + '">EDIT</a>' 
        }
    }
    

    我看不到您引用的row.id 在您的PHP JSON 创建中设置的位置,所以我不确定unique_id 应该来自哪里。基本上你需要为你的用例改变这个,但如果你用这个替换你的注释行,它应该会有所帮助。

    希望对您有所帮助。

    【讨论】:

    • 对不起:),有人想问。如何在每行添加一个序列号?
    • 你的意思是一个唯一的ID?如果它不在您的数据中,那么您需要从服务器获取它,如果它在您的数据中,您将能够从EDIT 链接的点击事件中获取它。它不一定是可见的。
    猜你喜欢
    • 2019-08-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-11-23
    • 2012-09-14
    • 1970-01-01
    相关资源
    最近更新 更多