时间戳

首页 > 解决方案 > 如何防止提交按钮在 ASP.NET MVC 中出现？

html - 如何防止提交按钮在 ASP.NET MVC 中出现？

问题描述

例如，我正在使用 HTML、CSS 和 JS 在 MVC 中编写我自己的作品集，而我的网站是一页的，有（按顺序）：主页、技能、项目、关于、联系方式，我必须滚动才能查看每个部分。问题是当我单击提交按钮（联系部分）时，页面刷新并从头开始，我必须再次向下滚动才能查看验证错误或模型是否成功提交。

这就是我所拥有的：

看法

<section class=" sect-container habilis">
<div class="container contac">
    <h2><img src="~/Content/images/0QLAF5.png" /></h2>
    <hr />
    @using (Html.BeginForm())
    {
        // the rest of forms code

        <button type="submit" class="btn btn-danger btn-md">Enviar</button>
    }
</div>
</section>

控制器

public ActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public ActionResult Index(Contact viewModel)
    {
        if (ModelState.IsValid)
        {
            _contact.Add(viewModel); // adds and saves model to database
            TempData["Message"] = "¡Su formulario se ha enviado con éxito!";
        }
        return View(viewModel);
    }

试过这个并且工作但没有用于检查错误或提交到数据库：

   $(document).ready(function () {
        $("form").submit(function (e) {
            e.preventDefault();
        });
     });

标签： htmlrazormodel-view-controller

解决方案

你可以这样使用

@using (Html.BeginForm("anotherAction", "anotherController", FormMethod.Post, new { id="frmRegister", @class = "form-horizontal", role = "form", target = "nulframe" }))

其次，您可以像这样在控制器端分开

[HttpPost]
public void Index(Contact viewModel)
{
    if (ModelState.IsValid)
    {
       // to do  :Save 
      return RedirectToAction("SuccesfullyRegistered","Account");
      // here is redirect page  
    }
    return View(viewModel);
}

此外，如果你使用jQuery你可以处理当你点击提交按钮然后发送 ajax 请求另一个控制器另一个动作

我为这个问题写了一个例子，当我在 Home 控制器上发布操作时，我有 2 个控制器 Home 和 Demo，就像这样重定向到演示控制器

 public ActionResult About()
    {
        ViewBag.Message = "Your application description page.";

        return View();
    }

    [HttpPost]
    public ActionResult About(string id)
    {
        if(id != "")
        {
            return RedirectToAction("Index", "Demo");
        }

        return View();
    }

在关于页面

<form method="post" action="/Home/About">
  <input type="text"  placeholder="id" name="id" class="form-control "/>
  <button class="btn btn-default">Send Post</button>

它对我有用

推荐阅读