在MVC OnChange事件AJAX调用 [英] AJAX call on OnChange event in MVC

问题描述

我必须做出一个DropDownList这是一个视图的一部分的onchange事件AJAX调用。在更改事件，我需要调用数据库，做一些计算显示UI，然后用计算来填充图表控件。
UI显示是在这个序列。
图表
下拉列表类
子类别与等级评分表
所以你我需要显示对变化的事件DIV3类别收视率，用收视率成绩来填充图。
在.NET中很容易做到，但如何在MVC？我能想到的唯一的选择是创建具有背后code用户控件但违背了使用MVC的目的。
任何帮助是AP preciated。

I have to make an AJAX call on the onchange event of a dropdownlist which is part of a view. On the change event i need to call the database, do some calculations display the UI and then use the calculations to populate a chart control. The UI display is in this sequence. Chart Dropdown categories list list of sub categories with rating score So as you can I need to display the categories ratings in div3 on the change event, use the ratings score to populate chart. Easily done in .NET but how to in MVC?? The only option i can think of is create user control with code behind but that defeats the purpose of using MVC. Any help is appreciated.

推荐答案

下面是你将怎样实现这个总体思路。

Here is a general idea how you'd implement 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 think this is the answer you are looking for.

这篇关于在MVC OnChange事件AJAX调用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！