Форум программистов, компьютерный форум CyberForum.ru Форум программистов | Компьютерный форум | Форум web-программистов | Форум по электронике и бытовой технике | Форум о софте | Научный форум | Карьера и бизнес
CyberForum.ru - форум программистов и сисадминов > Форум Форум web-программистов > Форум JavaScript > Форум jQuery
Восстановить пароль Регистрация

Ответ Создать новую тему
 
10.10.2013, 17:13   #1
Rommek
Новичок
Регистрация: 07.07.2013
Сообщений: 7
Репутация: 0 (0)
cannot call methods on dialog prior to initialization; attempted to call method 'close' / jQuery

Добрый день!
Я пытаюсь перенести вот этот пример в ASP MVC4 проект: http://jsfiddle.net/rniemeyer/WpnTU/
Поставил те же библиотеки jquery, которые используются в JSFIDDLE, но dialog так и не открывается. Консоль показывает ошибку: cannot call methods on dialog prior to initialization; attempted to call method 'close'.
Помогите плз. решить проблему, код в проекте выглядит вот так:

Код JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
@section scripts
{
    <script src="~/Scripts/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="~/Scripts/jquery-ui-1.9.2.custom.min.js"></script>
    <script src="~/Scripts/knockout-2.3.0.js" type="text/javascript"></script>
 
    
    <script type="text/javascript">
        
        //custom binding to initialize a jQuery UI dialog
        $(document).ready(function () {
            ko.bindingHandlers.jqDialog = {
                init: function (element, valueAccessor) {
                    var options = ko.utils.unwrapObservable(valueAccessor()) || {};
 
                    //handle disposal
                    ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
                        $(element).dialog("destroy");
                    });
 
                    //dialog is moved to the bottom of the page by jQuery UI. Prevent initial pass of ko.applyBindings from hitting it
                    setTimeout(function () {
                        $(element).dialog(options);
                    }, 0);
                }
            };
 
            //custom binding handler that opens/closes the dialog
            ko.bindingHandlers.openDialog = {
                update: function(element, valueAccessor) {
                    var value = ko.utils.unwrapObservable(valueAccessor());
                    if (value) {
                        $(element).dialog("open");
                    } else {
                        $(element).dialog("close");
                    }
                }
            };
 
            //custom binding to initialize a jQuery UI button
            ko.bindingHandlers.jqButton = {
                init: function (element, valueAccessor) {
                    var options = ko.utils.unwrapObservable(valueAccessor()) || {};
 
                    //handle disposal
                    ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
                        $(element).button("destroy");
                    });
 
                    $(element).button(options);
                }
            };
 
            var Product = function(id, name, isNew) {
                this.id = ko.observable(id);
                this.name = ko.observable(name);
                this.isNew = isNew;
                this.editId = ko.observable(id);
                this.editName = ko.observable(name);
 
                //persist edits to real values on accept
                this.accept = function() {
                    this.id(this.editId()).name(this.editName());
                }.bind(this);
 
                //reset to originals on cancel
                this.cancel = function() {
                    this.editId(this.id()).editName(this.name());
                }.bind(this);
            };
 
            var ViewModel = function () {
                var self = this;
                this.productList = ko.observableArray([
                    new Product(1, "one"),
                    new Product(2, "two"),
                    new Product(3, "three"),
                    new Product(4, "four")
                ]);
 
                this.selectedProduct = ko.observable();
                this.editProduct = function (productToEdit) {
                    self.selectedProduct(productToEdit);
                };
                this.addProduct = function () {
                    self.selectedProduct(new Product(0, "", true));
                },
                this.removeProduct = function (product) {
                    self.productList.remove(product);
                },
                this.accept = function () {
                    var selected = self.selectedProduct();
                    selected.accept();
 
                    if (selected.isNew) {
                        self.productList.push(new Product(selected.id(), selected.name()));
                    }
 
                    self.selectedProduct("");
                },
                this.cancel = function () {
                    self.selectedProduct().cancel();
                    self.selectedProduct("");
                };
            };
 
            ko.applyBindings(new ViewModel());
        })
    </script>
        }
<table>
    <tr>
        <th>Id</th>
        <th>Name</th>
        <th></th>
        <th></th>
    </tr>
    <tbody data-bind="foreach: productList">
        <tr>
            <td data-bind="text: id"></td>
            <td data-bind="text: name"></td> 
            <td>
                <button data-bind="click: $root.editProduct">Edit</button>
            </td>
            <td>
                <button data-bind="click: $root.removeProduct">Delete</button>
            </td>
        </tr>    
    </tbody>
</table>
 
<button data-bind="click: addProduct">Add Product</button>
 
 
<hr />
 
<div id="details" data-bind="jqDialog: { autoOpen: false, resizable: false, modal: true }, 
    template: { name: 'editTmpl', data: selectedProduct, if: selectedProduct }, openDialog: selectedProduct"> 
</div>
 
<script id="editTmpl" type="text/html">
    <p>
        <label>ID: </label>
        <input data-bind="value: editId"  />
    </p>
    <p>
        <label>Name: </label>
        <input data-bind="value: editName"  />
    </p>        
    <button data-bind="jqButton: {}, click: $root.accept">Accept</button>
    <button data-bind="jqButton: {}, click: $root.cancel">Cancel</button>
</script>
10.10.2013, 17:13
AdAgent
Объявления
10.10.2013, 21:19   #2
Donald28
странник
Регистрация: 28.05.2012
Сообщений: 1,263
Репутация: 714 (396)
Лучшие ответы: 10
cannot call methods on dialog prior to initialization; attempted to call method 'close'

вот вы подключаете библиотеку, например эту:
Код HTML5
1
<script src="~/Scripts/jquery-1.9.1.js" type="text/javascript"></script>
почему знак "~", впереди?

Мой диагноз следующий: библиотеки не подключены, т.к. браузер не нашел их по указанному пути.

Добавлено через 1 минуту
P.S. А вот это что за конструкция:
Код HTML5
1
2
3
4
5
6
7
8
9
10
11
12
<script id="editTmpl" type="text/html">
    <p>
        <label>ID: </label>
        <input data-bind="value: editId"  />
    </p>
    <p>
        <label>Name: </label>
        <input data-bind="value: editName"  />
    </p>        
    <button data-bind="jqButton: {}, click: $root.accept">Accept</button>
    <button data-bind="jqButton: {}, click: $root.cancel">Cancel</button>
</script>
где это такое видано, что внутри тэгов script используются HTML теги?
Другие темы раздела
Не работает анимацтя jQuery
Пишу уже 4 раз, все предыдущие проблемы были решены, и вот осталась последняя. Никак не могу понять, как расположить блоки с контентом. Они скрыты под меню внизу экрана, при нажатии на одну кнопку появляется один блок(анимация поднимает их вместе вверх), если они в верхнем положении и нажать на...
jQuery Скрыть блок
Ребят подскажите, я что то разобраться не могу. Есть html код <ul> <li>текст и кнопка 1</li> <li>текст и кнопка 2 <a href="#" id="44" class="del">удалить</a></li> </ul> При клике по кнопке нужно скрыть все что находится между li который обрамляет именно эту кнопку Сейчас код выглядит так
10.10.2013, 22:37  [ТС]   #3
Rommek
Новичок
Регистрация: 07.07.2013
Сообщений: 7
Репутация: 0 (0)
cannot call methods on dialog prior to initialization; attempted to call method 'close' / jQuery

Donald28, спасибо за ответ!
Библиотеки подключены, в .net asp mvc4 проектах такой синтаксис норм работает + я проверял через FireBug, все ок, ошибок нет. На данный момент ошибку о которой я писал в первом посте поборол путем подключения других библиотек: jquery-1.7.1.js и jquery ui-1.8.18.js.
Все работает, осталось решить такую проблему: $(element).dialog("open") не открывает новое окно, информация отображается ниже на той же странице.
Что я еще пропустил, кто сможет подсказать?
10.10.2013, 22:37
Yandex
Объявления
После регистрации реклама в сообщениях будет скрыта и будут доступны все возможности форума.
Ответ Создать новую тему

Похожие темы
Тема Раздел Автор Дата
PHP: Call to undefined method DOMElement::createElement()
Здравствуйте. Подскажите пожалуйста, почему может возникать эта ошибка.
PHP для начинающих mazy113 12.04.2014 09:51
Delphi: This form of method call only allowed for class methods :(
Ошибка в строчке TIdHTTP.Get('http://advance-rp.ru/captcha.php', FS); и в CaptchaID := RecognizeAG('captcha.png', Edit4, s); procedure TForm1.Button6Click(Sender: TObject); var FS:TFileStream; CaptchaID: Integer; begin png:=TPngObject.Create; ...
Delphi для начинающих Dosyk 06.09.2013 17:42
Delphi: [Error]: This form of method call only allowed for class methods end
Не могу разобраться с применением методов класса не знаю как это все правильно описать, подскажите пожалуйста! unit Unit1; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms, Dialogs, StdCtrls; type TForm1 = class(TForm)
Delphi для начинающих den_vrn 06.05.2013 16:41
Delphi: This form of method call only allowed for class methods
Здравствуйте, делаю в Delphi 7 чат (пока сервер) на ServerSocket1 в блокирующем режиме. Делаю не с нуля, а собирая по частям из различных программ(так как сам не разбираюсь). Необходимо по нажатию кнопки, сделать рассылку сообщения из мемо всем клиентам. Основа сервера из этой статьи. Программа...
Delphi для начинающих Reistl 02.10.2011 23:13
Delphi: E2076 This form of method call only allowed for class methods
Доброго всем времени. Прошу Вашей помощи в сложившейся ситуации и прошу сильно не критиковать, я только разбираюсь с классами. Есть класс в в отдельном Unit-е: TMDIForm = class(TForm) private MDIToolBarPopupMenu: TAdvPopupMenu; MDIPanel:TAdvDockPanel; ...
Delphi для начинающих vasabi 19.09.2011 00:22
Опции темы

Текущее время: 03:36. Часовой пояс GMT +4.

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.7 PL3
Copyright ©2000 - 2014, vBulletin Solutions, Inc.