Question

我使用datatable jQuery插件从MySQL数据库渲染多个连接表。我能够根据需要渲染表格。但是有两个问题。

第一：我想让一个字段（StudentID）有超链接，点击它我想将该值作为URL变量传递给另一个页面（如ViewDetails.php?StudentID=21）。目前我能够将超链接添加到字段（StudentID），但字段的文本显示＆＃34; Undefined＆＃34;而不是StudentID，并且在点击它时，变量（StudentID）不会传递给URL。

第二：搜索无法正常运行。

我提供了两个文件的代码，（1） Index.php （带有表的文件和将响应请求发送到response.php文件的js）。（2） response.php （包含sql和搜索代码的文件，它将json编码数据发送到index.php）。我使用的是数据表版本1.10.10。我正在关注此tutorial

以下是我的代码：

的index.php

<head>
...
    <link href="css/bootstrap.css" rel="stylesheet" type="text/css">
    <link href="css/customize.css" rel="stylesheet" type="text/css" media="screen">
    <link rel="stylesheet" type="text/css" href="css/font-awesome.css">
    <link rel="stylesheet" type="text/css" href="css/dataTables.bootstrap.css">
    <link rel="stylesheet" type="text/css" href="css/jquery.dataTables.css">
...
</head>
<body>
...
  <div class="row">
    <div id="" class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
      <table id="employee_grid" class="display table-bordered">
        <thead>
          <tr>
             <th class="col-lg-2 col-md-2 col-sm-2 col-xs-2">Student Name</th>
             <th class="col-lg-1 col-md-1 col-sm-1 col-xs-1">Gender</th>
             <th class="col-lg-1 col-md-1 col-sm-1 col-xs-1">City</th>
             <th class="col-lg-3 col-md-3 col-sm-3 col-xs-3">Course Description</th>
             <th class="col-lg-2 col-md-2 col-sm-2 col-xs-2">Subject</th>
             <th class="col-lg-1 col-md-1 col-sm-1 col-xs-1 text-right">Scholarship</th>
             <th class="col-lg-2 col-md-2 col-sm-2 col-xs-2">View Details</th>
          </tr>
        </thead>
       </table>
     </div>
   </div>
...
<script>
$( document ).ready(function() {
    $('#employee_grid').DataTable({
        "bProcessing": true,
        "serverSide": true,
        "autoWidth": true,
        "stateSave": true,
        "lengthMenu": [ 10, 25, 50, 100 ],
        "ajax":{
                url :"response_b.php", // json datasource
                type: "post",  // type of method,GET/POST/DELETE
                error: function(){
                $("#employee_grid_processing").css("display","none");
                }
            },
        "columnDefs": [ {
        "targets": 6,
        "data": "StudentID",
        "render": function ( data, type, full, meta ) {
        return '<a href="beneficiary.php?StudentID="'+data+'">'+data+'</a>';
        }
     }]
  });   
});
</script>
</body>

response.php

<?php
    //include connection file 
    include_once("connection.php");

    // initilize all variable
    $params = $columns = $totalRecords = $data = array();

    $params = $_REQUEST;

    //define index of column
    $columns = array( 
        0 => '`Full Name`',
        1 => 'Gender', 
        2 => 'CityName',
        3 => 'CourseDescriptionLong',
        4 => '`Subject`',
        5 => 'ScholarshipAwarded',
        6 => 'StudentID'
    );

    $where = $sqlTot = $sqlRec = "";

    // check search value exist
    if( !empty($params['search']['value']) ) {   
        $where .=" WHERE ";
        $where .=" (`Full Name` LIKE '".$params['search']['value']."%' ";    
        $where .=" OR CityName LIKE '".$params['search']['value']."%' ";

        $where .=" OR CourseDescriptionLong LIKE '".$params['search']['value']."%' )";
    }

    // getting total number records without any search
    $sql = "SELECT fullnames.`Full Name`, studentdetails.Gender, lt_cities.CityName, lt_coursedescription.CourseDescriptionLong, lt_coursesubject.`Subject`, Sum(scholarshipdetails.ScholarshipAwarded), studentdetails.StudentID, coursedetails.CourseType, lt_coursedescription.CourseDescriptionShort, scholarshipdetails.ScholarshipYear FROM studentdetails INNER JOIN scholarshipdetails ON studentdetails.StudentID = scholarshipdetails.StudentID INNER JOIN coursedetails ON studentdetails.StudentID = coursedetails.StudentID AND scholarshipdetails.ScholarshipYear = coursedetails.Scholarshipyear LEFT JOIN lt_coursedescription ON coursedetails.CourseID = lt_coursedescription.CourseID INNER JOIN tuitionfeedetails ON studentdetails.StudentID = tuitionfeedetails.StudentID AND scholarshipdetails.ScholarshipYear = tuitionfeedetails.ScholarshipYear INNER JOIN fullnames ON studentdetails.StudentID = fullnames.StudentID INNER JOIN lt_cities ON lt_cities.CityID = studentdetails.City LEFT JOIN lt_coursesubject ON lt_coursesubject.CourseID = lt_coursedescription.CourseID AND lt_coursesubject.SubjectID = coursedetails.CourseSubject GROUP BY studentdetails.StudentID";
    $sqlTot .= $sql;
    $sqlRec .= $sql;
    //concatenate search sql if value exist
    if(isset($where) && $where != '') {

        $sqlTot .= $where;
        $sqlRec .= $where;
    }


    $sqlRec .=  " ORDER BY ". $columns[$params['order'][0]['column']]."   ".$params['order'][0]['dir']."  LIMIT ".$params['start']." ,".$params['length']." ";

    $queryTot = mysqli_query($conn, $sqlTot) or die("database error:". mysqli_error($conn));


    $totalRecords = mysqli_num_rows($queryTot);

    $queryRecords = mysqli_query($conn, $sqlRec) or die("error to fetch employees data");

    //iterate on results row and create new index array of data
    while( $row = mysqli_fetch_row($queryRecords) ) { 
        $data[] = $row;
    }   

    $json_data = array(
            "draw"            => intval( $params['draw'] ),   
            "recordsTotal"    => intval( $totalRecords ),  
            "recordsFiltered" => intval($totalRecords),
            "data"            => $data   // total data array
            );

    echo json_encode($json_data);  // send data as json format
?>

我已经在Stack Overflow上研究了这类问题，并且答案中有很多问题，但它们似乎都不适合我。

任何人都可以指导我吗？

Answer 1

将您的DataTables初始化代码更改为：

$('#employee_grid').DataTable({
    "stateSave": true,
    "ajax": {
       "url": "response_b.php",
       "type": "POST"
    },
    "columnDefs": [ {
       "targets": 6,
       "render": function ( data, type, full, meta ) {
          return '<a href="beneficiary.php?StudentID='+data+'">'+data+'</a>';
        }
    }]
});

将带有URL变量的超链接添加到datatable（jQuery）+搜索无法正常工作

1 个答案: