如何使用URL将数据从javascript发送到 ASP.NET MVC控制器

本文关键字：ASP NET 控制器 MVC javascript URL 何使用 数据 | 更新日期: 2023-09-27 18:32:31

我需要一些帮助。我使用带有JavaScript和Knockout ASP.NET MVC4编写小应用程序，我无法将数据从javascript发送到MVC Controller，反之亦然。例如，JS的部分看起来像这样：

JavaScript

self.Employer = ko.observable();
self.AboutEmployer = function (id) {
            $.ajax({                    
                    Url.Action("GetEmployer", "Home")
                    cache: false,
                    type: 'GET',
                    data: "{id:" + id + "}",
                    contentType: 'application/json; charset=utf-8',
                    dataType: "json",
                    success: function (data) {
                        self.Employer(data);
                    }
                }).fail(
                function () {
                    alert("Fail");
                });
         };

在 ASP.NET MVC家庭控制器中，我通过ID获取雇主并将其返回为Json：

C#

public JsonResult GetEmployer(int id)
    {
        var employer = unit.Repository<Employer>().GetByID(id);
        return Json(employer, JsonRequestBehavior.AllowGet);
    }

我的视图返回另一个控制器(主页/KnockOutView(。我的视图还会获取另一个对象，并且根据接收的内容，具有不同的外观：

.HTML

...
<b>About Company: </b><a href="#" data-bind="click: $root.AboutEmployer.bind($data, Vacancy().EmployerID)">
<span data-bind="    text: Vacancy().Employer"></span></a>
<div data-bind="if: Vacancy">
    <div id="VacancyDescription"><span data-bind="text:DescriptionShort"></span>
    </div>
</div>
<div data-bind="if: Employer">
    <div data-bind="text: Employer().EmployerDescription"></div>
</div>

一切正常，我在JS中接收空缺和雇主对象，并使用Knockout在HTML中显示它，但我的URL始终保持不变!!但是我想在获得职位空缺或雇主时随时更改URL。例如，如果我想使用方法GetEmployer获取Employer，URL应如下所示：~/Home/GetEmployer？id=3如果我更改此代码字符串 Url.Action("GetEmployer", "Home") 在 url: window.location.href = "/home/GetEmployer?id=" + id URL 将被更改，但控制器返回一个 Json 对象并以 Json 格式显示在窗口中。请帮助我更改 URL 并从 URL 获取控制器中的信息。谢谢。

如何使用URL将数据从javascript发送到 ASP.NET MVC控制器

尝试下面的代码，希望对您有所帮助

此代码适用于%100，请根据您的情况更改下面的文本框

.HTML

<input type="text" id="UserName" name="UserName" />
<input type="button" onclick="MyFunction()"value="Send" />
<div id="UpdateDiv"></div>

Javascript：

function MyFunction() {
    var data= {
        UserName: $('#UserName').val(),
    };
    $.ajax({
        url: "/Home/GetEmployer",
        type: "POST",
        dataType: "json",  
        data: JSON.stringify(data),
        success: function (mydata) {
            $("#UpdateDiv").html(mydata);
            history.pushState('', 'New URL: '+href, href); // This Code lets you to change url howyouwant
        });
        return false;
    }
}

控制器：

public JsonResult GetEmployer(string UserName)
{
    var employer = unit.Repository<Employer>().GetByID(id);
    return Json(employer, JsonRequestBehavior.AllowGet);
}
这是我

的控制器操作。

[HttpPost]
    public ActionResult ActionName(string x, string y)
    {
        //do whatever
        //return sth :)
    }

我的帖子行动在这里。

<script type="text/javascript">
        function BayiyeCariEkle(){
           var sth= $(#itemID).text();
           var sth2= $(#itemID2).text();
           $.post("/ControllerName/ActionName", { x: sth, y: sth2});
         }
</script>

使用如下数据参数{id:id, otherPara:otherParaValue} 

 $.ajax({                    
     url:Url.Action("GetEmployer", "Home")
     type: 'GET',
     data: {id:id},
     contentType: 'application/json; charset=utf-8',
     dataType: "json",
     success: function (data) {
         alert(data)
     }
 });

由于 MVC 在处理到同一视图的路由时有点烦人，我成功地做到了这一点：

self.Employer = ko.observable();
self.AboutEmployer = function (id) {
            $.ajax({                    
                    url: "@Url.Action("GetEmployer", "Home", new { id = "PLACEHOLDER"})".replace("PLACEHOLDER", id),
                    cache: false,
                    type: 'GET',
                    contentType: 'application/json; charset=utf-8',
                    dataType: "json",
                    success: function (data) {
                        self.Employer(data);
                    }
                }).fail(
                function () {
                    alert("Fail");
                });
         };

您可以使用标准 url: "@Url.Action("GetEmployer", "Home")/" + id ，但在刷新时，具有现有 ID 的路由将保留在后续调用中，因此它开始附加 id，这显然不起作用。 通过在调用中指定 ID，该行为将不再存在。

在我看来

，最好的导航方法是使用sammy.js。这是一篇关于该 kazimanzurrashid.com 的帖子

相关文章：