Dữ liệu con dữ liệu cha mẹ Jquery

Question

Tôi đang làm việc với số này Datatables Demo để hiển thị các hàng con. Và tôi đang sử dụng php để trả về một mảng hoặc dữ liệu. Tôi có nó hoạt động khá tốt, nhưng có một vài vấn đề.

Đây là hình ảnh về những gì tôi hiện có.

Như bạn thấy trong hình, có hai hàng chính có cùng câu hỏi và hàng con có các câu trả lời khác nhau.

1. Tôi cần một cách để giới hạn một hàng cha mẹ cho mỗi câu hỏi riêng biệt.

2. Tôi cũng cần một cách để lặp lại và hiển thị nhiều hàng con trong cùng một bảng con.

3. Một tùy chọn khác là cách gán dữ liệu cho hàng gốc và một tập dữ liệu khác cho hàng con.

Tôi biết tôi nên làm điều đó trong truy vấn của mình, nhưng cột câu hỏi là kết quả duy nhất cho nhiều kết quả, trong hai bảng riêng biệt. Cách duy nhất để làm điều đó với các truy vấn sẽ là trả lại một kết quả cho các câu hỏi và sau đó thực hiện một cuộc gọi ajax khác để điền vào các hàng con. Tôi đã giả định điều này sẽ dễ dàng hơn.

Mã sản phẩm:

Bảng:

<table id="car" class="display" cellspacing="0" width="100%"> 
     <thead> 
     <tr> 
      <th class="details-control" style="max-width: 80px;">Expand</th> 
      <th>Question</th> 
     </tr> 
     </thead> 
     <tbody> 
     </tbody> 
     <tfoot> 
      <tr> 
      <th></th> 
      <th>Question</th> 
      </tr> 
     </tfoot> 
     </table> 

Script:

function format(d) { 
     //d is the original data object for the row 
     var tbl = '<table cellpadding="5" cellspacing="0" border="0" style="margin-left:110px; width:100%; font-size:12px;">' + 
       '<tr>' + 
       '<th style="width:60%; color:3383bb;">Answer Choices</th>' + 
       '<th style="width:15%; color:3383bb;"># of Answers</th>' + 
       '<th style="width:15%; color:3383bb;">Percentage</th>' + 
       '</tr>' + '<tr>' + 
       '<td>' + d.Answer + '</td>' + 
       '<td>' + d.NumberOfAnswers + '</td>' + 
       '<td>' + d.Percent + '</td>' + 
       '</tr>' + '</table>'; 
     return tbl; 
    } 


    var table2 = $('#car').DataTable({ 
     "ajax": "/rmsicorp/clientsite/reset/survey/surveyajax.php", 
     "scrollY": "400px", 
     "paging": false, 
     "bAutoWidth": true, 
     "columns": [ 
      { 
       "className": 'details-control', 
       "orderable": false, 
       "data": null, 
       "defaultContent": '' 
      }, 
      { "data": "Question" }, 
     ], 
    }).columns.adjust().draw(); 

kết quả truy vấn:

Cột câu hỏi chỉ lặp lại cho mỗi câu trả lời. Phần còn lại của các cột là khác biệt.

Answer 1

Đó là sự cố thường gặp, bạn có thể giải quyết vấn đề ở phía truy vấn hoặc ngôn ngữ. Với kịch bản này, tôi thích phía ngôn ngữ. Những gì bạn có thể thử làm:

1. Đặt hàng bạn truy vấn bằng văn bản Câu hỏi;
2. Kiểm tra xem Câu hỏi cuối cùng và thực tế có cùng nội dung hay không;
3. Nếu có, hãy thêm câu trả lời vào Câu hỏi thực tế;
4. Nếu không tạo mục Câu hỏi mới.

Bạn sẽ phải chỉnh sửa hàm định dạng để thực hiện điều đó, tôi có thể đề nghị bạn chia nó thành hai phần, một phần với tiêu đề Câu hỏi và một với dữ liệu câu trả lời, sau đó bạn kiểm soát: hiển thị hay không tiêu đề.