i have json file i want show the json data in list

Question

i have json file i want show the json data in list and this data always be present in list i want to get this data via ajax and store in local JSON object. *There should be fab button on which if user clicks 'Add Task' modal appears to add new task. *Fields necessary for a task to be entered are Username( dropdown - populate via static array,not null),Description(not null), and bucket point count(numeric, not null, 0 [ { 'values': { 'bucket': 0.5, 'taskName': 'Done some work', 'userName': 'Sam', 'taskCreateTimestamp': 1495534511750 } }, { 'values': { 'bucket': 0.5, 'taskName': 'Debugged some issues', 'userName': 'Alley', 'taskCreateTimestamp': 1495534910750 } }]

Sumit Chaudhary · Answer

You should try this ajax success function success: function (response) { $( "#ID" ).append( " " ) $.each(JSON.parse(response.d), function (i, v) { $( "#ID" ).append( " " + V.taskName+ " " ) $( "#ID" ).append( " " + V.userName + " " ) $( "#ID" ).append( " " + V.taskCreateTimestamp + " " ) }); $( "#ID" ).append( " " ) }

Manav Pandya · Answer

Hello I have developed this demo , but do some modification as per your method variables and other requirements Snippet is : $(document).ready(function(){ $( "MyButton" ).click(function(){ $.ajax({ type: 'GET' , url: '@Url.Action("Your_method_name")' , datatype: JSON, // Provide all variables that binds requested data data: { bucket : $( "#bucket" ).val(), taskName : $( "#taskName" ).text(), userName : $( "#userName" ).text(), taskCreateTimestamp : $( "#taskCreateTimestamp" ).val() }, success: function(data) { $.each(data, function(i, rows) { var AddRow = " " + " " + rows.bucket + " " + " " + rows.taskName + " " + " " + rows.userName + " " + " " + rows.taskCreateTimestamp + " " + " " ; $( '#MyTable' ).append(AddRow); }); }, error: function(data) {} }); }); }); "MyTable" > Bucket Task Name User Name Task Create Timestamp I hope your most of doubt will be solved Thanks

Debasis Saha · Answer

You use below code to read data from Json File and store into a local objects - Hope this will help you. "text/javascript" charset= "utf-8" > function loadJson() { $(document).ready( function () { $.getJSON( 'filepath/route_menu.json' , function (json) { var data = json; }); }); }

Nikunj Satasiya · Answer

Hi Sonali, Try this way $( document ).ready( function () { $.ajax({ url: 'students.json' , type: 'get' , dataType: 'json' , error: function (data){ }, success: function (data){ var tr = $( '' ); tr.append( '' + data.fname + '' ); tr.append( '' + data.lname + '' ); tr.append( '' + data.startDate + '' ); tr.append( '' + data.city + '' ); tr.append( '' + data.state + '' ); tr.append( '' + data.zip + '' ); tr.append( '' + data.phone + '' ); tr.append( '' + data.year + '' ); $( '#table' ).append(tr); } }); }); For better explanation you also can follow this given link https://www.c-sharpcorner.com/article/showing-data-using-jquery-ajax-call-json-in-Asp-Net-mvc/

sonali borikar · Answer

@Debasis Saha how can i get json data via ajax call and how i display it in table

i have json file i want show the json data in list

Insert Link

Embed YouTube Video

Table Options

Insert Image

Answers (5)