JavaScript中的ASP MVC URL操作

Question

I have this on Razor page

Index.cshtml

 @for (int i = 0; i < Model.Count(); i++)
 {
 var cars = Model.ElementAt(i); 
 <a href="@Url.Action("Cars","Home", new { id = cars.Id })">
 }

And I want to replace this in javascript using Jquery Ajax.

$.ajax({
    type: "Get",
    url: '/Cars/Home',
    data: {
        id: $(this).attr("id")
    },
    dataType: "json",
    success: function (data) {             
        for (var i = 0; i < data.length; i++) {

            html1.push("<a href='Cars/Home', new { id = cars.Id })>");
            html1.push("</a>");
        }
        $("#wraps").html(html1.join(""));
    }
})

This give me an error. However, how can I do this thing?

Answer 1

Your ajax call appears odd. You are telling it to get /Cars/Home/{id} , and then when it returns, you are creating a number of links to /Cars/Home/{someId} (based on the length of data ), but you are not really using the content of data .

I assume you want to send an HttpGet to /Cars/Home/ (without passing an id ), and I assume this returns an IEnumerable (list) of a type (eg Car ), and then create all the links to the details page of each of that type, all using js. If so, you could do this:

$.ajax({
    type: 'GET',
    url: '/Cars/Home',
    dataType: 'json',
    success: function (data) {             
        var links = [];
        for (var i = 0; i < data.length; i++) {
            var car = data[i];                
            links.push("<a href='/Cars/Home/" + car.Id + "'>Link to Car Id " + car.Id + "</a>");
        }
        $("#wraps").html(links.join(''));
    }
})