Question

所以，关于这一点的问题太多了，但是对于我的生活我无法找到 SIMPLE 问题的 SIMPLE 答案。

好的，所以我有一个带有剃刀视图项目的ASP MVC（c＃）（由优秀的DevExpress人员创建的布局） - 太棒了！：）

情况

我的<button>和<p>显示在我的视图中 - 一切都很好。

按钮的ID（有趣的是）myButton，段落为myParagraph。

我还有一个HomeController，其中包含一个简单的

方法

        public string updateAlerts()
        {
            return "THIS IS AN IMPORTANT PARAGRAPH";
        }

我的问题是：

使用

的基础知识

<button id="myButton" onclick="myFunction()">This is a button</button>

我需要使用什么来调用此方法？

有许多问题陈述AJAX或JQuery - 但是说实话，我并不是如何使用它们最模糊的想法！（我是个白痴，好吗？）

所以我写了一个script的东西（说实话，我认为＆＃39;

<script>
    function myFunction(){
    //how do I call this method here?
    var myString = ...

    document.getElementById("myButton").innerText = myString;
    }
</script>

有人能告诉我如何以最简单/最容易理解的方式填写这个吗？

干杯

修改

我认为this回答会有所帮助，但要么我只是愚蠢（可能）或者不适合这种情况（悲伤的脸）。

我也不知道它是否会成为一个巨大的＆＃39;交易，但这个＆＃39;段落＆＃39;也位于其中一个＆＃39;面板上。（左侧导航栏被精确化） - 因此将在系统的所有页面上看到

Answer 1

在视图中：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script>
$(document).ready(function(){
$('#myButton').click(function(){
  $.get('<%= Url.Action(ControllerName.updateAlerts()) %>', function (data)
    {
      $('#myParagraph').text(data);
    })
  });
});
</script>

另请注意，如果您使用的是Razor，请将<%= Url.Action(ControllerName.updateAlerts()) %>替换为@Url.Action(ControllerName.updateAlerts())

Answer 2

正如您所猜测的，您将需要使用ajax。

Ajax是一组相互关联的Web开发技术客户端创建异步Web应用程序。

在wiki.

上详细了解相关信息

这意味着不同的技术/框架以不同的方式实现它，jquery就是其中之一。最终结果或多或少相同，与服务器通信，不会阻止用户操作（没有浏览器冻结等）

为了使其有效，您最好的选择是在您的视图中包含jquery：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

然后：

<script>
$(function () {
    ('#mybutton').on('click', function(){
        $.ajax({      
            url: '@Url.Action(HomeController.updateAlerts())'      
        }).done(function(data){
           $('#myParagraph').text(data);
        });
    });
})
</script>

Answer 3

当您尝试修改myButton innerText时，这应该可以正常工作：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script>
$(document).ready(function(){
    $(document).ready(function () {
        $("#myButton").click(function () {
            $("#myParagraph").load("@Url.Action("updateAlerts","Home")");
        });
    });
});
</script>

从MVC中的视图调用控制器方法

3 个答案: