CODEWITHSUNDEEP
jqueryjsonajaxasp.net-mvcasp.net-ajax
marco debala
marco debala

Reputation: 109

Display Data from Json To <ul> Tag MVC Javascript

I have This JavaScript Function

function GetAll()
     {
         $.ajax
             ({
                 type: method,
                 url: "/dash/GetMemebers",
                 dataType: 'JSON',
                 contentType: "application/Json; Charset= Utf-8"
             })
     }

IN My Conrtoller I do this Methode

public ActionResult GetMemebers()
        {
            var members = db.t_m.ToList();
            return Json(new { data = members }, JsonRequestBehavior.AllowGet);
        }

I need To Diplay This Data To Tag

this HTML Code

 <div class="row">
        <div class="col-3">
            <ul class="list-unstyled" id="list">
            </ul>
        </div>
    </div>

Upvotes: 0

Views: 90

Answers (1)

Mohammed Sajid
Mohammed Sajid

Reputation: 4903

If I understood correctly, you want display <li>..</li> inside ul tag. Change litle the code like the following :
1 - GetAll js function

 $.ajax({
        url: "Home/GetMemebers",
        type: "GET",
        success: function (data) {
            var lis = "";
            $.each(data.data, function (index, value) {
                lis += "<li>" + value + "</li>";
            });
            $("#list").html(lis);
        },
        error: function (response) {
            alert(response);
        }
    });

2 - Controller

public ActionResult GetMemebers()
{
    var members = new List<string> { "1", "2", "3" };
    return Json(new { data = members }, JsonRequestBehavior.AllowGet);
}

3 - Result

<ul class="list-unstyled" id="list">
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>

You could choose just what you want to display in the GetMemebers Action.

I hope you find this helpful.

Upvotes: 1

Related Questions