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

Question

我需要一些帮助。我使用 ASP.NET MVC4 以及 JavaScript 和 Knockout 编写了一个小应用程序，但我无法将数据从 javascript 发送到 MVC 控制器，反之亦然。例如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 Home Controller 中，我通过 ID 获取雇主并将其作为 Json 返回：

C＃

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

我的视图返回另一个控制器（Home/KnockOutView）。我的视图还获取另一个对象，并且根据接收的对象，具有不同的外观：

超文本标记语言

...
<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 始终保持不变！但当我收到职位空缺或雇主信息时，我想随时更改网址。 例如，如果我想使用 GetEmployer 方法获取 Employer，URL 应该如下所示： ~/Home/GetEmployer?id=3 如果我更改 URLUrl.Action("GetEmployer", "Home")中的此代码字符串url: window.location.href = "/home/GetEmployer?id=" + id将会更改，但控制器会返回一个 Json 对象并且以 Json 格式在窗口中显示它。请帮助我更改 URL 并从 URL 获取控制器中的信息。谢谢。

Answer 1

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

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

超文本标记语言

<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);
}