ASP。NET MVC加载页面使用AJAX

I have this situation:

我有这种情况:

A page with an accordion with 2 tabs, one has a list of paymentmethods, the second has a summary of the order with orderlines, amounts and totals (rendered as partialview). Selecting a paymentmethod causes the order totals to be recalculated, extra costs etc might apply.

一个有2个标签的手风琴的页面，一个有付款方法的列表，第二个有订单、金额和总数的汇总(以partialview表示)。选择支付方法会导致重新计算订单总数，可能需要额外的成本等。

What is the recommended way to display the new ordersummary after a paymentmethod is selected, using AJAX?

使用AJAX选择paymentmethod后显示新ordersummary的推荐方式是什么?

Doing an AJAX call and getting all the new amounts, orderlines, etc and setting these values using JS seems inefficient to me. Ideal situation would be if I could make an AJAX call with the selected payement method and this call would return the HTML which I can use to replace the old summary.

在我看来，使用JS执行AJAX调用并获取所有新的数量、订单等等并设置这些值是低效的。理想的情况是，如果我可以使用所选的payement方法进行AJAX调用，这个调用将返回HTML，我可以使用它替换旧的摘要。

Is it bad to render a partialview to HTML on the server and return it using JSON? What is best practice for this situation?

在服务器上将partialview呈现给HTML并使用JSON返回，这不好吗?在这种情况下，最佳实践是什么?

2 个解决方案

#1

In your action method return a PartialView([view name]).

在操作方法中返回一个PartialView([view name])。

Then you can do this with jquery:

然后你可以使用jquery:

var req = $.ajax({
  type:"GET",//or "POST" or whatever
  url:"[action method url]"
  }).success(function(responseData){
    $('targetelement').append($(responseData));});

Where 'targetelement' is a selector for the element into which you want to inject the content.

其中'targetelement'是要将内容注入的元素的选择器。

You might want to do $('targetelement').html(''); first before appending the response to the target element.

您可能想要做$('targetelement').html(");首先，在将响应附加到目标元素之前。

Update

更新

Or, better yet, use .load from Rick's answer.

或者，更好的是，使用里克的答案。load。

#2

I have an example here:

我举个例子:

Javascript

$("#divForPartialView").load("/HelloWorld/GetAwesomePartialView",
   { param1: "hello", param2: 22}, function () {
   //do other cool client side stuff
});

Controller Action

控制器动作

public ActionResult GetAwesomePartialView(string param1, int param2)
{
    //do some database magic
    CustomDTO dto = DAL.GetData(param1, param2);

    return PartialView("AwesomePartialView",dto);
}

#1