3

我有一个简单的控制器和视图:

我只想Index.cshtml用新数据重新加载视图页面。我已经彻底调试了代码。"ul"事实上,当控件转到模型对象填充新数据的方法时单击Index(string value),即使在 cshtml 页面中,模型也在调试器中显示新列表,但视图没有刷新。我真的不知道为什么..有人可以帮我吗?如果我在某个地方出现了可怕的错误,请原谅我的无知,因为我是 MVC 的新手。在此先感谢...控制器:

namespace MVCTestApp1.Controllers
{
    public class TestController : Controller
    {
        //
        // GET: /Test/

        public ActionResult Index()
        {
            ModelState.Clear();
            List<string> ll = new List<string>();
            ll.Add("qq");
            ll.Add("aa");
            ll.Add("zz");
            return View(ll);
        }

        [HttpPost]
        public ActionResult Index(string value)
        {
            ModelState.Clear();
            List<string> ll = new List<string>();
            ll.Add("kkk");
            ll.Add("qq");
            ll.Add("aa");
            ll.Add("zz");
            return View(ll);
        }    
    }
}

View:


@model IEnumerable<string>
@{
    ViewBag.Title = "Index";
}

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)

    <h2>Index</h2>
    <ul id="bb">
        @foreach (var i in Model)
        {
           <li>@Html.DisplayFor(ir=>i)</li>
        }
    </ul>
}
4

1 回答 1

3

我想您编写了一些 javascript 代码,以便当用户单击您的<li>元素时<ul>触发 AJAX 调用,以[HttpPost]将所选值发送到服务器。您的代码的问题可能是您可能忘记使用success回调中的新内容更新 DOM。因此,要使其工作,您可以首先将<ul>内容放在局部视图中:

List.cshtml

@model IEnumerable<string>
@foreach (var i in Model)
{
   <li>@Html.DisplayFor(ir=>i)</li>
}

然后在主视图中包含这个部分:

@model IEnumerable<string>
@{
    ViewBag.Title = "Index";
}

@using (Html.BeginForm()) 
{
    @Html.ValidationSummary(true)

    <h2>Index</h2>
    <ul id="bb">
        @Html.Partial("_List", Model)
    </ul>
}

好的,现在在您的 POST 操作中,您可以返回部分内容:

[HttpPost]
public ActionResult Index(string value)
{
    List<string> ll = new List<string>();
    ll.Add("kkk");
    ll.Add("qq");
    ll.Add("aa");
    ll.Add("zz");
    return PartialView("_List", ll);
}

最后一点是javascript代码:

$(function() {
    $('#bb').on('click', 'li', function() {
        var value = $(this).html();
        $.ajax({
            url: $(this).closest('form').attr('action'),
            type: 'POST',
            data: { value: value },
            success: function(partialView) {
                $('#bb').html(partialView);
            }
        });
    });
});
于 2013-09-14T08:04:00.440 回答