How to add data to table dynamically using JQuery

Question

I have 3 dropdowns and a button "Add", when i select the dropdowns and click on add, it has to insert into a table using JQuery and DataTables.How will i add rows dynamically? I have done using a for loop iteratin a list and then adding to the datatable but thisis different.pls help me in this regard,

 function addToTable(){

     var project = document.getElementById("projectId").value;
     var process = document.getElementById("glbProcessId").value;
     var role = document.getElementById("roleId").value;

            var t = $('#example').DataTable();


            $('#addRow').on( 'click', function () {
                t.row.add( [
                   // ##### how do i add the data here???##############
                ] );


            } );

 }

Thanks in advance

Gyrocode.com · Accepted Answer · 2015-06-30 11:50:24Z

3

For example, I have just added static values in it:

$('#addRow').on( 'click', function () {
   t.row.add( [
      "1st Column's data",
      "2nd Column's data",
      "3rd Column's data",
      "4th Column's data",
       //and so on as based on number of your columns
   ]).draw();
});

If you want to add dynamic values, you can add an Ajax function above t.row.add line and then pass those values instead of static values.

For more reference see this example.

edited Jun 30, 2015 at 11:50

Gyrocode.com

59k16 gold badges157 silver badges192 bronze badges

answered Jun 30, 2015 at 10:48

Rohit Arora

2,2622 gold badges28 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to add data to table dynamically using JQuery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related