how to fetch data from json action into view

debugcn Published at Dev

Umair

[HttpPost] 
public JsonResult searchByName(string name)
{
    dbCRMEntities dbx = new dbCRMEntities();
    var test = name;             
    var names = dbx.CONTACTS.Where(chk => name == chk.NAME);
    return this.Json(names, JsonRequestBehavior.AllowGet);    
}

This method is returning the data in this format:

[
    {
        "CONTACT_ID": 37,
        "NAME": "umair",
        "JOB_TITLE": "internee",
        "COMPANY": "fastservices",
        "PHONE": "244",
        "EMAIL": "[email protected]",
        "WEB": "alskdjg",
        "ADDRESS": "lahore",
        "STATUS": "Inactive",
        "TAGS": "sdf",
        "LEAD_SOURCE": "partner",
        "BACKGROUND": "skldjga",
        "OWNER": "a",
        "BIRTHDAY": "2014-12-18",
        "EntityState": 2,
        "EntityKey": {
            "EntitySetName": "CONTACTS",
            "EntityContainerName": "dbCRMEntities",
            "EntityKeyValues": [
                {
                    "Key": "CONTACT_ID",
                    "Value": 37
                }
            ],
            "IsTemporary": false
        }
    }
]

and my jquery method is:

$(document).ready(function () {
    $("#btn1").click(function () {
        var name = $("#search").val();
        //name = "ali";
        alert(name);

        $.post("/Status/searchByName", { name: name }, function (data) {
            document.write(data);
            $.each(data, function (key, value) {
            });
        }, "text");
    });
});

I want to obtain data in tabular form in the view. Please guide me

charlietfl

Need to change dataType of $.post to 'json'. Then jQuery will return an array of objects as your data argument.

Now within your each the first argument will be index and the second will be the individual objects

$.post("/Status/searchByName", { name: name }, function (data) {

        $.each(data, function (index, item) {               
               var rowData =[];
                rowData.push(item.CONTACT_ID);
                rowData.push(item.COMPANY);
                rowData.push(item.EntityKey.EntitySetName);
                 /* ETC */

                var row ='<tr><td>' + rowData.join('</td><td>') +'</td></tr>';
                $('table').append(row);

        });
    }, "json");
});

You could also loop over each of the properties in each object using $.each and if it is a primitive value push it into the html

$.each(data, function (index, item) { 
     var rowData =[];
    $.each(item, function( key, value){
       if(typeof value !=='object'){
          rowData.push(value);
        }else if( key === 'EntityKey'){
           /* parse to data array*/
        }  
    });
    /* append to table as above */
});

Collected from the Internet

Please contact [email protected] to delete if infringement.