在视图中调用控制器的按钮操作而不重定向到任何视图

时间:2021-09-21 09:32:47

I wanted to add a button to my ASP .NET MVC WebApplication's view which will invoke a method:

我想在我的asp.net MVC的视图中添加一个按钮,它将调用一个方法:

 public void  UpdateDatabase(int personId, int surveyId) {
          //updating,modifying database
        }

but besides that nothing at all will happen so user will not see any visible changes. The user will not be redirected, visible content of the site will not change, page will not be reloaded.

但是除此之外,什么也不会发生,所以用户不会看到任何可见的变化。用户将不会被重定向,站点的可见内容不会改变,页面不会被重新加载。

Just like you click a button with no listener associated with it.

就像你点击一个没有监听器的按钮一样。

I have tried

我有试过

 <p> @Html.ActionLink("Update database", "UpdateDatabase", new { personId = Model.Item1.Id, surveyId = survey.Id }, new { @class = "btn btn-default" })</p>

but I am redirected to site:

但我被重定向到site:

http://localhost:17697/Person/SubmitSurvey?personId=6&surveyId=6

which is empty.

这是空的。

I would like to achieve only invoking UpdateDatabase method.

我只希望实现调用UpdateDatabase方法。

EDIT:

编辑:

在视图中调用控制器的按钮操作而不重定向到任何视图

EDIT2:

EDIT2:

The view looks like this:

视图是这样的:

@using WebApplication2.Models
@model   System.Tuple<Person, List<Survey>>

<hr />
<h1>Surveys</h1>

<input type="button" id="Coll" value="Collapse" onclick="javascript:CollapseDiv()" />
@*<p>
        Number of Surveys: @Html.DisplayFor(x => Model.Item2.Count)
    </p>*@

@{int i = 1;}
@foreach (var survey in Model.Item2) {
    using (Html.BeginForm()) {
        <h2>Survey @(i)</h2>
        <p />
        @Html.EditorFor(x => survey.Questions)
        <p> @Html.ActionLink("Submit", "SubmitSurvey", new { personId = Model.Item1.Id, surveyId = survey.Id }, new { @class = "btn btn-default" })</p>
        <button id='mybutton'>Click Me</button>
        <script>
            $('#mybutton').click(function(){
                $.post("Person/SubmitSurvey", { personId: {@Model.Item1.Id }, surveyId: {@survey.Id } }, function (data) {
                    alert('updated');
                });
            });
        </script>
    }
    i++;
    <hr style="background-color:rgb(126, 126, 126);height: 5px" />
}
<hr />

and the controllers action:

和控制器动作:

PersonController:

PersonController:

 public void SubmitSurvey(int personId, int surveyId) {
            System.Diagnostics.Debug.WriteLine("TEXT");
        }

and the result after clicking the button:

点击按钮后的结果:

在视图中调用控制器的按钮操作而不重定向到任何视图

EDIT 3

编辑3

My RouteConfig:

我的RouteConfig:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Routing;

namespace WebApplication2 {
    public class RouteConfig {
        public static void RegisterRoutes(RouteCollection routes) {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

            routes.MapRoute(
                name: "Default",
                url: "{controller}/{action}/{id}",
                defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
            );
        }
    }

}

EDIT 4

I tried also this:

我也试过这样的:

@using WebApplication2.Models
@model   System.Tuple<Person, List<Survey>>

<hr />
<h1>Surveys</h1>

<input type="button" id="Coll" value="Collapse" onclick="javascript:CollapseDiv()" />
@*<p>
        Number of Surveys: @Html.DisplayFor(x => Model.Item2.Count)
    </p>*@

@{int i = 1;}
@foreach (var survey in Model.Item2) {
    using (Html.BeginForm()) {
        <h2>Survey @(i)</h2>
        <p />
        @Html.EditorFor(x => survey.Questions)
        <p> @Html.ActionLink("Submit", "SubmitSurvey", new { personId = Model.Item1.Id, surveyId = survey.Id }, new { @class = "btn btn-default" })</p>
        <script>
            function BtnOnclick1() {
                $.ajax({
                    type: 'POST',
                    url: '@Url.Content("~/Person/SubmitSurvey")',
                    data: {
                        personId: '@Model.Item1.Id',
                        surveyId: '@survey.Id'
                    },
                    success: function (data) {

                    }
                });
            }
        </script>
        <input type="button" value="Save" onclick="javascript:BtnOnclick1();" />

    }
    i++;
    <hr style="background-color:rgb(126, 126, 126);height: 5px" />
}
<hr />

but I get runtime exception: `There is no definition of „BtnOnclick1”.

但我得到运行时异常:“没有定义„BtnOnclick1”。

Unhandled exception at line 47, column 12 in script block

在脚本块中的第47行、第12列中未处理的异常。

0x800a1391 - Błąd czasu wykonywania kodu JavaScript: Brak definicji „BtnOnclick1”

0 x800a1391 - Błąd czasu wykonywania kodu JavaScript:Brak definicji„BtnOnclick1”

1 个解决方案

#1


2  

Have you tried jQuery's $.get (http://api.jquery.com/jquery.get/) or $.post (http://api.jquery.com/jquery.post/). After including reference to jQuery, you can do something like this:

你试过jQuery的$吗?(http://api.jquery.com/jquery.get/)或美元。文章(http://api.jquery.com/jquery.post/)。在包括对jQuery的引用之后,您可以这样做:

<button id='mybutton'>Click Me</button>

<script>
$('#mybutton').click(function(){
    $.post( "mysite/UpdateDatabase", {personId: "@Model.Item1.Id", surveyId: "@survey.Id"}, function( data ) {
        alert('updated');
    });
});
</script>

#1


2  

Have you tried jQuery's $.get (http://api.jquery.com/jquery.get/) or $.post (http://api.jquery.com/jquery.post/). After including reference to jQuery, you can do something like this:

你试过jQuery的$吗?(http://api.jquery.com/jquery.get/)或美元。文章(http://api.jquery.com/jquery.post/)。在包括对jQuery的引用之后,您可以这样做:

<button id='mybutton'>Click Me</button>

<script>
$('#mybutton').click(function(){
    $.post( "mysite/UpdateDatabase", {personId: "@Model.Item1.Id", surveyId: "@survey.Id"}, function( data ) {
        alert('updated');
    });
});
</script>