Data Table: Inserting Json array Data into Data Table dynamically.

[nmvvskb]

Controller ................... public dataTableBean loadUserDetails(HttpServletRequest request) { dataTableBean bean = new dataTableBean(); JSONArray array = null; array = new JSONArray(); JSONObject object = new JSONObject(); JSONObject object2 = new JSONObject(); object.put("id", "1"); object.put("firstName", "Nsk"); object.put("pNumber", "1234567890"); object2.put("id", "2"); object2.put("firstName", "Pss"); object2.put("pNumber", "9638520147"); array.add(object); array.add(object2); bean.setStatus("Success"); String data = array.toString(); // bean.setJson(array); bean.setData(data); return bean; }

JQuery .............. var data=$("#dataTable1").DataTable({//loadUserDetails.do ajax:'json', data: ShowData(), "access": [], "columns": [ { "title": "S.No", "data": "id" }, { "title": "fstName", "data": "firstName" }, { "title": "phNumber", "data": "pNumber" } ] }//data table end ); var jsonArray=new array(); function ShowData(){ $.ajax({ type: "POST", url: "loadUserDetails.do", data: '{m_date: "1" }', contentType: "application/json",////; charset=utf-8 success: function (response) { alert("in Success Of Ajax: "+response.data) alert("in Success Of Json "+response) jsonArray=response.data; alert("jsonArray: "+jsonArray); var result = $.parseJSON(jsonArray); alert("result :"+result); setData(response.data); if (response.data) { $.each(response.data, function (index, data) { alert("In response.data Function") }); } $.each(result, function(k, v) { //display the key and value pair alert(k + ' is ' + v); }); // var MyRows = $('table#dataTable1').find('tbody').find('tr'); $.each(function(index, value) {

                        alert("In each Function")

}, failure: function (response) { //

} });

//////Html script..

var data=$("#dataTable1").DataTable({//loadUserDetails.do ajax:'json', data: ShowData(), "access": [], "columns": [ { "title": "S.No", "data": "id" }, { "title": "fstName", "data": "firstName" }, { "title": "phNumber", "data": "pNumber" } ] }//data table end ); var jsonArray=new array(); function ShowData(){ $.ajax({ type: "POST", url: "loadUserDetails.do", data: '{m_date: "1" }', contentType: "application/json",////; charset=utf-8 success: function (response) { alert("in Success Of Ajax: "+response.data) alert("in Success Of Json "+response) jsonArray=response.data; alert("jsonArray: "+jsonArray); var result = $.parseJSON(jsonArray); alert("result :"+result); setData(response.data); if (response.data) { $.each(response.data, function (index, data) { alert("In response.data Function") }); } $.each(result, function(k, v) { //display the key and value pair alert(k + ' is ' + v); }); // var MyRows = $('table#dataTable1').find('tbody').find('tr'); $.each(function(index, value) {

                        alert("In each Function")

}, failure: function (response) { //

} });

//////Html script..

S.No fstName phNumber