Jquery / Javascript数据表:如何在行选择中将行数据显示到html文本字段中

时间:2016-02-28 10:38:38

标签: javascript php jquery html datatable

我在项目中使用了以下datatable。我已成功将所有数据填充到datatable

我只需要将行选择的特定行数据填充到同一页面上的文本字段中,然后更新这些数据,然后将这些数据保存在数据库中。

使用的数据表链接:https://datatables.net/examples/api/select_single_row.html

jsfiddle:https://jsfiddle.net/o92g9goL/2/

1 个答案:

答案 0 :(得分:0)

<强>更新

  var name = $(this).children('td[name="name"]').text();
  var position = $(this).children('td[name="position"]').text();
  var office = $(this).children('td[name="office"]').text();
  var age = $(this).children('td[name="age"]').text();
  var startdate = $(this).children('td[name="startdate"]').text();
  var salary = $(this).children('td[name="salary"]').text();

  var nameInp = $('input[name="name"]');
  var positionInp = $('input[name="position"]');
  var officeInp = $('input[name="office"]');
  var ageInp = $('input[name="age"]');
  var startdateInp = $('input[name="start"]');
  var salaryInp = $('input[name="salary"]');

  $(nameInp).attr('value',name);
  $(positionInp).attr('value',position);
  $(officeInp).attr('value',office);
  $(ageInp).attr('value',age);
  $(startdateInp).attr('value',startdate);
  $(salaryInp).attr('value',salary);

<强> JSFiddle

这就是您想要的,您应该使用Simple inline editing中的dataTables.editor.min.js

 $('#example').on( 'click', 'tbody td:not(:first-child)', function (e) {
        editor.inline( this );
    } );

<强> JSFiddle

并检查出来:

Simple inline editing

Bubble editing with in table row controls