MVC4更新部分观点观点、部分

2023-09-03 08:17:49 作者:一个人孤独终老

我开发一个简单的MVC应用程序。

I am developing a simple MVC application.

我有主视图,局部视图和控制器。

I have main view, partial view and controller.

这是我的主视图

@model partitalViewTest.Models.Qset 
@{

}

<!DOCTYPE html>

<html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>Question</title>
    </head>
    <body>



    <div class="transbox" style="height:inherit;"> 
       @Html.Partial("CheckAnswer",Model.partialModel)
    </div> 

    </body>
</html>

这是我的部分观点:

@model IEnumerable<partitalViewTest.Models.Qset>

@{
    Layout = null;   
}

<h2> </h2>
@foreach (var item in Model)
{
    @item.currpos;
}

@* <input type="button" title="Delete" value="@item.qstuinList[item.currpos].AnsC ;" onclick="changeBtn(this); location.href='@Url.Action("CheckAnswer", "RazerQuestion", new { id = 'A' })    '" />*@
<input id="Button1" type="button" value="button" onclick="location.href='@Url.Action("CheckAnswer", "RazerQuestion", new { id = 'A' })    '" />

这是我的控制器:

 public ActionResult CheckAnswer()
 {
     // Some Code
     return PartialView(qustinb.partialModel);
 }

这是工作正常,但我的问题是没有包装的主视图局部视图的回报。

This is working fine but my question is Partial View returns without wrapping the main view.

请帮我解决这个问题。

Please help me to solve this problem.

推荐答案

您按一下按钮是这样做的:

Your button click is doing this:

location.href='@Url.Action("CheckAnswer", "RazerQuestion", new { id = 'A' })    '"

该导航浏览器的部分页面。

which navigates the browser to the partial page.

我怀疑你希望发生的事情是针对部分页面内容被替换为更新的内容是什么,而无需刷新浏览器或导航走。

I suspect what you want to happen is for the partial page content to be replaced with the updated content without refreshing the browser, or navigating away.

您可以做与jQuery。

You can do with with JQuery.

首先,给你一个ID:

<div id="content" class="transbox" style="height:inherit;"> 
   @Html.Partial("CheckAnswer",Model.partialModel)
</div> 

二,做类似下面的东西响应按钮点击(检查删除错误):

Second, do something similar to the following in response to the button click (error checking removed):

function doWork(){
    $.get('@Url.Action("CheckAnswer", "RazerQuestion", new { id = 'A' }'), function (data) {
        $('#content').html(data);
    });
}

最后,改变按钮做到这一点:

Finally, change the button to do this:

<input id="Button1" type="button" value="button" onclick="doWork()" />

这将现:

在点击按钮... 火的doWork()的功能,这将... 请请求到 CheckAnswer 操作,然后... 以请求的内容,并替换&LT; D​​IV /&GT; 的内容,结果 On click of the button... Fire the doWork() function, which will... Make the request to the CheckAnswer action, and then... Take the content of the request, and replace the <div /> content with the result