zoukankan      html  css  js  c++  java
  • 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

  • 相关阅读:
    atom无法安装插件的解决方法之一
    css3伪类温故知新
    flex 布局笔记
    NPM 无法下载任何包的原因,解决方法
    flex align-content中的描述的“多根轴线的对齐方式”中的“多根轴线”到底是什么
    nodejs express 静态文件的路径
    当函数传入参数是引用类型的几种情况和现象。
    关于NODE NPM 输入命令后没反应的问题
    no input file specified
    获取form提交的返回值
  • 原文地址:https://www.cnblogs.com/wintersun/p/2724060.html
Copyright © 2011-2022 走看看