如何创建链接编辑数据表和ajax。

时间:2016-06-08 01:52:43

标签: php jquery json ajax datatables

我还是一个有数据表和ajax的新手。我想问的是如何使每行数据的编辑链接显示在数据表中? 我在页面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>';
}
?>
&#13;
<!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>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

你的数据有11个字段,你的表头有12个字段,你的DataTable初始化有9或10个字段......如果你想将调整后的html连接到一行,你需要一个渲染功能,从你的描述中它应该可能看起来像这样:

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

我无法看到您在PHPs JSON创建中设置了row.id的位置,因此我不确定unique_id应该来自何处。基本上你需要为你的用例改变这个,但是如果用这个替换你注释掉的行,它应该有所帮助。

希望有所帮助。