【问题标题】:.subscribe is not working in my ASP.NET MVC application.subscribe 在我的 ASP.NET MVC 应用程序中不起作用
【发布时间】:2015-05-29 02:03:30
【问题描述】:

我是 ASP.NET MVC 开发人员。我是 Knockout js 的新手,目前我在我的应用程序中使用 KO js。下拉列表选择更改 (.subcribe) 无法正常工作。请在下面找到我的代码:

我的任务是:有三个下拉列表,我必须在第一个下拉列表的更改事件时将数据绑定到下一个下拉列表。 脚本:

    var array_BankNames = JSON.parse(@Html.Raw(ViewBag.Banks));


    var Bank = function () {
        var self = this;
        self.BankName = ko.observableArray(array_BankNames);
        self.SelectedBank = ko.observable();

        self.BankLocation = ko.observableArray();
        self.SelectedLocation = ko.observable();

        self.BankBranch = ko.observableArray();
        self.SelectedBranch = ko.observable();

         self.SelectedBank.subscribe = function () {
            alert("Hi");               
            $.ajax({
                url: '@Url.Action("GetBankLocations_Data")',
                data: { Bankname: selectedValue },
                type: 'GET',
                success: function (data) {
                    self.BankLocation(data);
                }
            });
        }.bind(self);
    };

    var BanksModel = function () {
        var self = this;
        self.Banks = ko.observableArray([new Bank()]);

        self.addBank = function () {
            self.Banks.push(new Bank());
        };

        self.removeBank = function (Bank) {
            self.Banks.remove(Bank);
        };
    };
    ko.applyBindings(new BanksModel());

HTML:

                        <div class="col-sm-9 col-md-8 controls">                              
                              <select data-bind="
                                    options: BankName,
                                    optionsValue: 'ID',
                                    optionsText: 'Name',
                                    value: SelectedBank">
                            </select>
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="form-group">
                        @Html.LabelFor(model => model.BankLocation, new { @class = "col-sm-3 col-md-4 control-label" })
                        <div class="col-sm-9 col-md-8 controls">

                            <select data-bind="options: BankLocation,
                            optionsValue: 'ID', optionsText: 'Name', value: $root.SelectedLocation">
                            </select>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-12">
                <div class="col-md-6">
                    <div class="form-group">
                        @Html.LabelFor(model => model.BankBranch, new { @class = "col-sm-3 col-md-4 control-label" })
                        <div class="col-sm-9 col-md-8 controls">

                            <select data-bind="options: BankBranch,
                                    optionsValue: 'ID', optionsText: 'Name', value: SelectedBranch">
                             </select>
                        </div>
                    </div>
                </div>

【问题讨论】:

  • .subscribe 应该可以正常工作。控制台中的任何错误?让我们知道。干杯
  • 这个参考显示错误。所以删除了它。删除该引用后,控制台中没有错误。
  • 由于没有错误,现在订阅触发了吗?如果不删除所有引用(暂时),只需将 jquery 1.9.js 放在 start 和 next knockout-3.2.0.js 并执行。希望它有效
  • 我照你说的做了,还是没有运气:(。它仍然没有触发。
  • 好吧 ko.validation.js 显示错误(可能是),因为它之前提到过 knockout 3.2.js 。加载顺序很重要。

标签: c# asp.net-mvc knockout.js


【解决方案1】:

从 AJAX 回调的上下文来看,模型不是BanksModel,而是self...所以:

 self.SelectedBank.subscribe = function () {
    alert("Hi");
    $.ajax({
        url: '@Url.Action("GetBankLocations_Data")',
        data: { Bankname: SelectedBank() },
        type: 'GET',
        success: function (data) {
            self.BankLocation(data);
        }
    });
    $.getJSON('@Url.Action("GetBankLocations_Data")', SelectedBank, function (data) {
        self.BankLocation(data);
    })

【讨论】:

  • 感谢您的回复。这里的情况是我的屏幕类似于购物卡屏幕(参考:knockoutjs.com/examples/cartEditor.html)。所以我只需要使用self,因为在同一个屏幕内会有多个同名但不同frame的控件。
  • spender 是正确的,需要使用 self 。 @MVCDeveloper self.SelectedBank.subscribe=function(selectedValue){ //inside ajax data: { Bankname: selectedValue }} 。干杯
  • 感谢您帮助我。我的问题是 .subscribe 甚至没有触发。如果缺少任何参考,请告诉我。 ,这些是我保留的参考资料。这是参考问题还是其他问题。请告诉我。
【解决方案2】:

我的问题得到了答案:

self.LoadLocations = ko.computed(function () {
                var tempreview = self.SelectedBank();
                return tempreview;
            }),
            self.LoadLocations.subscribe(function (newValue) {
                $.ajax({
                    url: '@Url.Action("GetBankLocations_Data")',
                    data: { Bankname: newValue },
                    type: 'GET',
                    success: function (data) {
                        self.BankLocation(data);
                    }
                });
            });

这是在我的项目中级联下拉列表的脚本。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2012-06-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-01-16
    • 2020-04-22
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多