Html.RenderAction using AJAX

Question

Is it possible to use HTMl.RenderAction using ajax to provide the parameter?

I have a controller action like this

[ChildActionOnly]
Public ActionResult EmployeeData(string id)
{
    Employee employee = new Employee();
    //do work to get data

    Return PartialView(employee);
}

The partial view is just a small table with some employee data (name, address, etc)

I then have a page with a drop down list of employees with the data field being the id needed for EmployeeData(string id)

I would like to use ajax so when a employee is selected from a drop down list the EmployeeData partial view will appear below it without refreshing the page. Then again if another employee is selected.

Though i am not sure how to do this, if it is possible.

As was recommended here is what I have now. (please don't mind that this is not the employee data example i mentioned above, that data is not ready in the DB and I have multiple areas that will do this same thing so I decided to work on this one today)

here is my the JS in my view

  $("#repList").change(function () {
    var id = $("#repList").val();
    $.ajax({
        url: '/Reporting/GetSalesTargets/' + id,
        success: function (result) {

              $("#partialdiv").html(result);
        },
        error: function () {
            alert("error");
            }
    });
});

I am getting to the controller action that will return the view, here is it.

public ActionResult GetSalesTargets(string id)
{
    int month = DateTime.Now.Month;
    SalesMarketingReportingService mktSrv = new SalesMarketingReportingService();

    SalesTargetModel model = mktSrv.GetRSMSalesTargetModel(id, month);

    return PartialView(model);
}

Darin Dimitrov · Accepted Answer · 2010-09-13 18:45:09Z

17

It is possible but you have to remove the [ChildActionOnly] attribute. The it becomes a normal action that returns a partial view the you could invoke using AJAX:

$.ajax({
    url: '/home/employeedata/123',
    success: function(result) {
        $('#somedivid').html(result);
    }
});

answered Sep 13, 2010 at 18:45

Darin Dimitrov

1.0m275 gold badges3.3k silver badges3k bronze badges

Sign up to request clarification or add additional context in comments.

10 Comments

twal Over a year ago

How do I display the partial though in the success function?

Darin Dimitrov Over a year ago

$('#somedivid').html(result); where somedivid is the id of a DOM element that will harbor the result.

twal Over a year ago

Oh I see, I am sorry I missed the $('#somedivid'). Thank you I will try this!

twal Over a year ago

ok so I am doing this but I am not getting into the success function, I added an error function and I am getting there. How can I display what the thrown error is? I updated my question with the code I am working on now.

Darin Dimitrov Over a year ago

Try stepping through the code. Probably there's an exception thrown inside the controller action. Also using FireBug could help you see what's sent and received from the server.

|

Collectives™ on Stack Overflow

Html.RenderAction using AJAX

1 Answer 1

10 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

10 Comments

Your Answer

Sign up or log in

Post as a guest

Related