Question

我正在获取单个实体的详细信息，我想将其显示在表格中。我为此使用DataTable，到目前为止我已经获得了如下所示的单一实体JSON：

$CxRecordsTable.delegate('form', 'submit', function(event) {
    event.preventDefault();
    var $form = $(this);
    var quizId = $form.attr('id');

    $.post('<?php echo $this->CxHelper->Route('eb-admin-get-evaluation-quiz-by-id')?>', {
        id: quizId
    }).done(function(data, textStatus, jqXHR){
        quizDetail = jqXHR.responseText;
    });

现在我希望quizDetail是一个单一的Entity JSON String，可以在dataTable中显示它。简单来说，我希望这个实体在DataTable中显示，我尝试的是下面的内容：

var jsonString = JSON.stringify(quizDetail) //for testing
//Load  datatable
var table = $("#cx-evaluation-quiz-details-table");
table.DataTable ({
    data : jsonString,
    "columns" : [
        { "first_name" : "first_name" },
        { "gender" : "gender" },
        { "email" : "email" },
        { "phone" : "phone" },
        { "age" : "age" },
        { "version" : "version" },
        { "date" : "date" }
    ]}
);

我的HTML表格代码：

<table id="cx-evaluation-quiz-details-table" class="table table-striped table-bordered" width="100%">
    <thead>
        <tr>
            <th></th>
            <th class="hasinput">
                <input type="text" class="form-control filter" placeholder="First Name">
            </th>
            <th class="hasinput">
                <input type="text" class="form-control filter" placeholder="Gender" />
            </th>
            <th class="hasinput">
                <input type="text" class="form-control filter" placeholder="Email" />
            </th>
            <th class="hasinput">
                 <input type="text" class="form-control filter" placeholder="Phone" />
            </th>
            <th class="hasinput">
                <input type="text" class="form-control filter" placeholder="Age" />
            </th>
            <th class="hasinput">
                <input type="text" class="form-control filter" placeholder="Version" />
            </th>

            <th class="hasinput">
                <input type="text" class="form-control filter" placeholder="Date" />
            </th>
        </tr>
        <tr>
            <th></th>
            <th class="all">First Name</th>
            <th class="all">Gender</th>
            <th class="all">Email</th>
            <th class="all">Phone</th>
            <th class="all">Age</th>
            <th class="all">Version</th>
            <th class="all">Date</th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>

后端GetQuizBYId代码：

public function getEvaluationQuizByIdAction() {
    // Get the clicked evaluation quiz id
    $id = $this->request->get('id', null);

    // Return Evaluation Quiz record
    $cxEbEvaluation = CxEbEvaluation::getEvaluationByIdForDataTable($id);

    // Return data array
    return array('data' => $cxEbEvaluation);
}

在Click jQuery上使用JSON数据填充DataTable

0 个答案: