2012年10月15日星期一

Asp.net MVC 限制一个方法到指定的Submit按钮

Asp.net MVC 限制一个方法到指定的Submit按钮

        在Asp.net Web Form 中，每个单独的 HTML Form 有时会包含多个Submit的button. 那么用户最后点击那一个Button. 我们通常需要借助Javascript来帮助我们，先看下面的Html代码： 

    <form name="myform" id="myform" method="post">
    <input type="text" id="username" />
    <input type="text" id="password" />
    <br />
    <input type="submit" value="Update" name="updateaction" onclick="setAction('update')" />
    <input type="submit" value="Delete" name="deleteaction" onclick="setAction('delete')" />
    </form>

那么这时需要这样的Javascript，定义一个setAction的function，如果您熟悉Javascript不难看懂：

    <script type="text/javascript">
        function setAction(action) {
            document.getElementById("myform").action = action;
        }
    </script>

 

在 Asp.net MVC 应用程序中，我们不能这样一直到处添加上面这样的代码。那么我们实现一个自定义的Attribute：

    /// <summary>
    /// OnlyIfPostedFromButtonAttribute
    /// </summary>
    public class OnlyIfPostedFromButtonAttribute : ActionMethodSelectorAttribute
    {
        public String SubmitButton { get; set; }
        public String ViewModelSubmitButton { get; set; }
 
        public override Boolean IsValidForRequest(ControllerContext controllerContext, MethodInfo methodInfo)
        {
            var buttonName = controllerContext.HttpContext.Request[SubmitButton];
            if (buttonName == null)
            {
                //This is neccessary to support the RemoteAttribute that appears to intercepted the form post 
                //and removes the submit button from the Request (normally detected in the code above) 
                var viewModelSubmitButton = controllerContext.HttpContext.Request[ViewModelSubmitButton];
                if ((viewModelSubmitButton == null) || (viewModelSubmitButton != SubmitButton))
                    return false;
            }
 
            // Modify the requested action to the name of the method the attribute is attached to 
            controllerContext.RouteData.Values["action"] = methodInfo.Name;
            return true;
        }
    }


对应的我们假设有这样的Model与Controller:

    public class PeterLiuViewModel
    {
        [Remote("UserAlreadyRegistered", "PeterLiu", AdditionalFields = "Version", ErrorMessage = "This Username is already registered with the agency.")]
        public string UserName { get; set; }
 
        public int Version { get; set; }
        public string SubmitButtonName { get; set; }
    }


在当前上下文Controller中的Action中增加这样的方法, 你可以看到OnlyIfPostedFromButton的Attribute指定每个Action，需要对应的Submit的button。这里还有增加ActionName

        [HttpPost]
        [ActionName("Details")]
        [OnlyIfPostedFromButton(SubmitButton = "editUser", ViewModelSubmitButton = "SubmitButtonName")]
        public ActionResult DetailsEditUser(PeterLiuViewModel nom)
        {
            return RedirectToAction("Edit", "Home", new { id = nom.UserName });
        }
   
        [HttpPost]
        [ActionName("Details")]
        [OnlyIfPostedFromButton(SubmitButton = "sendActivationEmail", ViewModelSubmitButton = "SubmitButtonName")]
        public ActionResult DetailsSendActivationEmail(PeterLiuViewModel nom)
        {
            return RedirectToAction("SendActivationEmail", "Home", new { id = nom.UserName });
        }

 

好的，让我们来看View的Razor语法的代码：

@using (Html.BeginForm("Details","Home"))
{
    <p>
        @Html.LabelFor(m => m.UserName)
        @Html.DisplayFor(m => m.UserName)
    </p> 
 
    <input type="submit" name="editUser" value="Edit" data-action="editUser" /> 
    <input type="submit" name="sendActivationEmail" value="SendActivationEmail" data-action="sendActivationEmail" /> 
    @Html.HiddenFor(m => m.SubmitButtonName)
}
<script type="text/javascript">
    $(document).ready(function () {
        $("input[type=submit][data-action]").click(function (e) {
            var action = $(this).attr('data-action');
            $("#SubmitButtonName").val(action);
        });
    });
 
</script>


上面的代码可以看出，我们放置了一个Hidden input，然后用JQuery前端取得data-action的特性值把它做为val给SubmitButtonName的Hidden input。代码很简单，希望对您开发有帮助。

您可以感兴趣的文章：

实现Asp.net MVC中AjaxOnly特性
Asp.net MVC3扩展之Ajax异常处理特性

 


作者：Petter Liu
出处：http://www.cnblogs.com/wintersun/
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。
该文章也同时发布在我的独立博客中-Petter Liu Blog。


TAG:
发帖者 时间：