[ACCEPTED]-AJAX call on OnChange event in MVC-asp.net-mvc

Accepted answer

Score: 12

Here is a general idea how you'd implement 3 this.

<script type="text/javascript">
    // assuming you're using jQuery
    $("#ddlAjax").change( function (event) {
        $.ajax({
            url: "Controller/GetPartialGraph/" + $(this).val(),
            data: { id = $(this).val() /* add other additional parameters */ },
            cache: false,
            type: "POST",
            dataType: "html",

            success: function (data, textStatus, XMLHttpRequest) {
                $("#divPartialView").html( data ); // HTML DOM replace
            }
        });
    });
</script>

<select id="ddlAjax">
    ... list of options
</select>


<div id="divPartialView">
    <!-- something like this in your ASP.NET View -->
    <%= Html.RenderPartial("MyPartialView", Model) %>
</div>

Here is your controller action method.

[HttpPost]
public PartialViewResult GetPartialGraph(int id /* drop down value */)
{
    // do calculations whatever you need to do
    // instantiate Model object
    var model = myBusinessLogicService.DoCalculations(id);

    return PartialView("MyPartialView", model);
}

I 2 think this is the answer you are looking 1 for.

Score: 2

Ok, if what you want ia a way to call a 5 onchange event when a dropdownlist change 4 this can be helpful:

@Html.DropDownListFor(
                        model => model.SelectedId,
                        new SelectList(ViewBag.Ids, "Id", "Name"),
                        "[All]",
                        new { onchange = "onChangeId();", @id ="municipalityDropDown" }
                        )

then you can have this 3 javascript code and you ajax code. And here 2 is an example of a jax code to call a action 1 method.

function onChangeId() {
      jQuery.ajax({
            url: '@Url.Action("Action Method Name", "Controller Name")',
            type: 'POST',
            contentType: 'application/json',
            data: JSON.stringify({ data: data2 }),
            success: function (result) { }
        });  
    }

Score: 1

Look into using a partial view. There are 2 many links if you google ASP.Net MVC Partial 1 View but here is one I found intestering

http://blog.stevensanderson.com/2008/10/14/partial-requests-in-aspnet-mvc/

Score: 0

I'm not sure I completely understand what 11 you're trying to do, but in MVC the way 10 I would likely handle it is to chain together 9 a couple of AJAX calls. The first updates 8 the category ratings based on the selection. This 7 likely returns JSON so that you can easily 6 extract the ratings scores. The second takes 5 the ratings scores returned by the first 4 and calls an action that renders the chart 3 as HTML -- i.e., it renders a partial view 2 that is returned and inserted into the proper 1 place in the document.

Score: 0

Yes, that’s right – only change is replacing:

onchange = “this.form.submit();”

with:

onchange = “$(this.form).submit();”

found 1 it in this post

Source: stackoverflow.com

[ACCEPTED]-AJAX call on OnChange event in MVC-asp.net-mvc

Set selected value in SelectList after instantiation

How can I get this ASP.NET MVC SelectList to work?

Redirecting unauthorized controller in ASP.NET MVC

Working example for JavaScriptResult in asp.net mvc

How do I limit the length of characters in a textbox in MVC?

Implementing Audit Log / Change History with MVC & Entity Framework

Viewbag check to see if item exists and write out html and value error

ASP.NET MVC Url.Action and route name value

Render Partial View from other controller

How to get the Null Coalesce operator to work in ASP.NET MVC Razor?