Ajax.BeginForm,用户控件和更新的东西

时间:2009-02-08 00:47:41

标签: asp.net-mvc

我的用户控件有点问题。基本上我想要完成的是以下内容:

  1. 我有一个编辑发票的视图。
  2. 在此视图中,我有一个带有发票项目列表的用户控件
  3. 我还有一个用jQuery激活的div,用于添加新的发票项目
  4. 当我添加发票项目时,我想只刷新带有项目列表的用户控件
  5. 如果没有黑客,我该怎么做?我想到的是以下内容:

    [AcceptVerbs(HttpVerbs.Post), ValidateAntiForgeryToken]
    public ActionResult Create(InvoiceLine line)
    {
    if (Request.IsAjaxRequest())
    {
        if (!ModelState.IsValid)
        {
            return PartialView("CreateLineControl", product);
        }
    }           
    return PartialView("DisplayLinesControl", product);
    }
    

1 个答案:

答案 0 :(得分:0)

首先你要调用带有jQuery的aspx页面(我们将使用一个http处理程序,我们将在下面的web.config中进行映射,稍后会详细介绍)

基本思想是我们希望服务器端将用户控件呈现为xhtml,并在我们的成功方法(客户端)中将此“更新”标记转储回DOM

$.ajax({
    type: "GET",
    url: "UserDetails.aspx?id=" + id,
    dataType: "html",
    error: function(XMLHttpRequest, textStatus, errorThrown)
    {
        alert(XMLHttpRequest.responseText);
    },
    success: function(xhtml)
    {
        var container = document.createElement('div');

        container.innerHTML = xhtml;

        document.getElementById('someElement').appendChild(container);
    }
});

下面的技术是我通过HttpHandler利用用户控件来重用控件的方法 对于ajax和.net工作

以下是用.NET 1.1完成的(但我相信你可以在.NET 2.0+中完成) 下面的类实现了IHttpHandler,真正的工作在进程请求子中,如下所示

我当时唯一的问题是asp.net控件不会渲染出用户的表单标签 控制,所以我使用普通的HTML,一切都很好

Public Class AJAXHandler

    Implements IHttpHandler

    Public ReadOnly Property IsReusable() As Boolean Implements System.Web.IHttpHandler.IsReusable
        Get
            Return False
        End Get
    End Property

    Public Sub ProcessRequest(ByVal context As System.Web.HttpContext) Implements System.Web.IHttpHandler.ProcessRequest
        Dim Request As System.Web.HttpRequest = context.Request
        Dim path As String = Request.ApplicationPath
        Dim newHtml As String
        Dim pg As New System.Web.UI.Page

        context.Response.Cache.SetCacheability(HttpCacheability.NoCache)
        context.Response.ContentType = "text/html"

                                Dim uc As New UserDetail
                                uc = CType(pg.UserControl(path + "/Controls/UserDetail.ascx"), UserDetail)
                                Dim sb As New System.Text.StringBuilder
                                Dim sw As New System.IO.StringWriter(sb)
                                Dim htmlTW As New HtmlTextWriter(sw)

                                uc.LoadPage(custid, CType(pro, Integer))
                                uc.RenderControl(htmlTW)
                                context.Response.Write(sb.ToString())
                                context.Response.End()

    End Sub


End Class

最后在你的web.config中你需要定义处理程序并将其映射到你在ajax调用中列出的aspx路径

  <system.web>
    <httpHandlers>
        <add verb="*" path="UserDetails.aspx" type="project.AJAXHandler, project" />
    </httpHandlers>
  </system.web>

现在,您可以使用UserDetails.aspx调用用户控件,并将用户控件呈现为html。然后在渲染之后它将返回html(在调用response.end之后)

然后在javascript中你可以找到你的用户控件的父DOM元素,删除它并追加或者innerHTML这个新的html

<强>更新

以上是我在webforms中使用的解决方案,但是使用MVC,下面的内容会产生相同的结果而且工作量会少得多。

jQuery函数将是相同的,但在服务器端,您只需创建一个新的控制器操作+ PartialView w /您想要的标记(基本上是用户控件)

Function Edit(ByVal id As Integer) As ActionResult
    Dim User As User = UserService.GetUserById(id)

    Return PartialView("User", User)
End Function

现在在我的ascx里面,我只是渲染了html,这就是将它发送回浏览器以获取container.innerHTML的工作原理(在这种情况下,客户端代码对于MVC和Webforms都是相同的)

<%@ Control Language="VB" Inherits="System.Web.Mvc.ViewUserControl(Of User)" %>
<% Dim User As User = DirectCast(Model, User)%>
<div id="innerDetail">
    <label for='username'>Username</label>
    <input type="text" id='username' name='username' value="<%= User.Username %>" /><br />

    <a id='lnkUpdate' href='/Application/User.aspx/Edit/<%= User.ID %>' onclick='UpdateUser(this); return false;'>Update User Information</a>
    <span id='lblUpdateStatus' style='display: inline;'></span>
    </div>
</div>

在MVC中使用更少代码的原因是我们不必解决webforms中普通aspx文件所需的页面生命周期。