Question

我想在jQuery dataTable的多列中添加按钮。我可以在一列中添加多个按钮。但是，我需要单独的列中的单个按钮。我使用AJAX方法（JSON数据）将数据绑定到表。

以下是我在单个列中添加多个按钮的代码。有人可以帮助我，如何将这些按钮分成不同的列。

function loadtable() {
  $.ajax({
    type: "POST",
    url: "../WebMethods/GetData.asmx/getScheduledTests",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (data) {
      var json = JSON.parse(data.d);
      table1 = $('#myTable').DataTable({
        data: json,
        columns: [
          { className: "hide", data: 'TestId' },
          { data: 'TestKey' },
          { data: 'TestType' },
          { data: 'ClassName' },
          { data: 'SubjectName' },
          { data: 'NoOfQuestions' },
          { data: 'TotalQuestions' },
          { mRender: function (data, type, row) {
              return '<input id="btnViewConcepts" class="btn-link lnk" onclick="View(\'' + row.TestId + '\',\'' + row.TestKey + '\');" style="width:100px"  value="View Concept"/> | <a href="QuestionPaper.aspx?TestId=' + row.TestId + '&Mode=Offline" target="_blank" class="btn-link">View Question Paper</a>'
            }
          }
        ]
      });
    }
  });
}

在这里，我添加了2个按钮作为视图概念，并在一列中查看问题文件。我需要将它放在单独的列中。请帮忙。提前致谢

Answer 1

您只需添加其他data column即可添加包含button

的其他列

 table1 = $('#myTable').DataTable({
    data: json,
    columns: [
      { className: "hide", data: 'TestId' },
      { data: 'TestKey' },
      { data: 'TestType' },
      { data: 'ClassName' },
      { data: 'SubjectName' },
      { data: 'NoOfQuestions' },
      { data: 'TotalQuestions' },
      { data: "TotalQuestions", render: function (data, type, row) {
          return '<input id="btnViewConcepts" class="btn-link lnk" onclick="View(\'' + row.TestId + '\',\'' + row.TestKey + '\');" style="width:100px"  value="View Concept"/> | <a href="QuestionPaper.aspx?TestId=' + row.TestId + '&Mode=Offline" target="_blank" class="btn-link">View Question Paper</a>'
        }
      },
      { data: "TotalQuestions", render: function (data, type, row) {
          return '<input id="btnViewConcepts" class="btn-link lnk" onclick="View(\'' + row.TestId + '\',\'' + row.TestKey + '\');" style="width:100px"  value="View Concept"/> | <a href="QuestionPaper.aspx?TestId=' + row.TestId + '&Mode=Offline" target="_blank" class="btn-link">View Question Paper</a>'
        }
      }
    ]
  });

如何在多列jQuery DataTable中添加按钮？

1 个答案: