Click here to Skip to main content
15,887,938 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
I need an idea on how I can GET my MVC Json result and populate it inside my view table using Ajax,

this is my json result

C#
public JsonResult GetAllContacts()
    {

        var User = GetLoggedInUserID();

        var getContact = _contactService.GetUserContacts(User).Select(x => new
        {
            Id = x.Id,
            Name = x.Name,
            MobileNumber = x.MobileNumber
        });

        return Json(getContact, JsonRequestBehavior.AllowGet);

    }


Please how can I archieve this?

Secondly My Table has Checkboxs that I will be able to pick the Mobile number and populate them inside a Listbox

this is my table view

HTML
<table class="table table-striped table-hover table-bordered" id="contacts">
                            <thead>
                                <tr>
                                    <th><input type="checkbox" name="chooseAllRecipient" id="chooseAllRecipient" /></th>
                                    <th class="center">Contact Name(s)</th>
                                    <th class="center">Mobile Number(s)</th>
                                </tr>
                            </thead>

                            <tbody>
                                <tr>
                                    <td><input type="checkbox" name="chooseRecipient" class="my_chkBox"></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                            </tbody>
                        </table>


and this is my Script
JavaScript
function GetContact() {

$.ajax({
    url: table.data('/Contact/GetAllContacts'),
    type: 'GET',
    contentType: 'application/json',
    data: JSON.stringify(),
    cache: false,
    context: table,
    success: function (contact) {
        var tableBody = this.find('tbody');
        tableBody.empty();
        $.each(contact, function (index, contact) {
            $('<tr/>', {
                html: $('<td/>', {
                    html: contact.Name
                }).after($('<td/>', {
                    html: contact.MobileNumber
                }))
            }).appendTo(tableBody);
        });
    },
    error: function () { alert("error"); }
});
}

$('#getContacts').click(function () {

GetContact();
});


please I need some help on how to get this working with jQuery and AJAX because I can't figure out were the problem is coming form please thank you very mush...
Posted
Comments
SRS(The Coder) 26-Jun-14 3:02am    
What issue are you facing or what error are you getting ?
Please tell in descriptively.

1 solution

you need to parse json string in function GetContact().
C#
success: function (contact) {

         if (contact.d != null && contact.d.length > 0) {
             var data = JSON.parse(contact.d);
         }
     }
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900