how to fetch data from json action into view

Question

[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

You just need to create td in your loop, appending the value of the property in to it - that hard part is already done. — Rory McCrossan
– Rory McCrossan, Commented Dec 22, 2014 at 10:16
Do you already have a table with a blank row that you can clone? Other wise you need to generate the html for the table. — user3559349
– user3559349, Commented Dec 22, 2014 at 10:16
I had created the table in html,but unable to get the object properties. How can I extract data or attributes from function(data)? — Umair
– Umair, Commented Dec 22, 2014 at 10:22
don't use document.write it will wipe out the whole page when used after onload has occured. Log to console instead using console.log(data) — charlietfl
– charlietfl, Commented Dec 22, 2014 at 10:23

charlietfl · Accepted Answer · 2014-12-22 10:44:47Z

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 */
});

Collectives™ on Stack Overflow

how to fetch data from json action into view

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