JQuery UI: Làm thế nào để gọi một chức năng widget với namespace của nó

Question

Tôi tạo ra hai tùy chỉnh JQuery UI widget với cùng một tên nhưng với không gian tên khác nhau như đưa ra dưới đây: phụ tùng đầu tiên:

$.widget('finance.dialog',{....}); // this was created in the file jquery.finance.dialog.js 

Second phụ tùng:

$.widget('hr.dialog',{.....}); // this was created in the file jquery.hr.dialog.js 

Ngoài hai trường hợp này, giao diện người dùng JQuery có tiện ích hộp thoại riêng (ui.dialog) trong không gian tên ui.

Câu hỏi của tôi là: Tiện ích hộp thoại nào sẽ được gọi khi tôi gọi những điều sau đây trong trang web như được đưa ra dưới đây?

$('div#something').dialog(); 

Xin lưu ý tôi bao gồm tất cả ba biến thể tiện ích con trên trang web.

Tôi hiểu có xung đột trong trường hợp trên. Làm thế nào chúng ta có thể gọi một hàm widget với không gian tên của nó sao cho sẽ không có bất kỳ xung đột nào?

Answer 1

Tôi đã có cùng một câu hỏi, nhưng tôi không nghĩ rằng có thể gọi một widget jqu jquery với không gian tên.

Nếu tôi hiểu chính xác điều này: http://bugs.jqueryui.com/ticket/7489 Bằng cách xác định tiện ích con có cùng tên, nó được thiết kế để ghi đè các định nghĩa trước đó. Bởi vì bất kể không gian tên, các widget được ánh xạ với tên của chúng thành $ .fn.

Như được đề xuất trong vé lỗi, bạn có thể sử dụng chức năng cầu để tạo ánh xạ duy nhất cho tiện ích con tên cụ thể và gọi nó bằng tên duy nhất.

Trong trường hợp của bạn, nó có thể là như thế này:

$.widget.bridge("finance_dialog", $.finance.dialog); 
$.widget.bridge("hr_dialog", $.hr.dialog); 

// then call it with... 
$("div#something").hr_dialog(); 

Tôi cho rằng một cách khác sẽ được tạo tên phụ tùng độc đáo ở nơi đầu tiên.

Answer 2

Bạn có thể gọi một widget jQuery UI bởi namespace của nó như thế này:

$.ui.dialog(null, $('div#something')); // Default jQ UI dialog 
$.finance.dialog(null, $('div#something')); // Your first custom dialog 
$.hr.dialog(null, $('div#something')); // Your second custom dialog 

Sử dụng tham số đầu tiên, đó là rỗng trong ví dụ trên, để gửi bất kỳ tùy chọn để các phụ tùng.

Answer 3

Tôi nghĩ rằng hai chức năng này có thể trợ giúp trong trường hợp như vậy. Việc tải đầu tiên một widget bằng cách trỏ đến hàm được tạo bởi JQ trên đối tượng vùng tên. Thứ hai sử dụng tên trực tiếp mà tôi nghĩ sẽ không xung đột miễn là tên là duy nhất.

 /** 
 
     * Apply the JQuery UI widget on an element with the given selector 
 
     * @param {String} emSelector selector 
 
     * @param {String} namespace widget namespace 
 
     * @param {String} widgetName widget name 
 
     * @param {Object}[options] options options object or null 
 
     */ 
 
     jqUIWidgetByNSAndName:function(emSelector, namespace, widgetName, options) { 
 
      var em = $(emSelector); 
 
      $[namespace][widgetName].call(em, options, em); 
 
     }, 
 

 

 
     /** 
 
     * Apply the JQuery UI widget on an element with the given selector 
 
     * @param {String} emSelector selector 
 
     * @param {String} widgetName widget name 
 
     * @param {Object}[options] options options object or null 
 
     */ 
 
     jqUIWidgetByName:function (emSelector, widgetName, options) { 
 
      var em = $(emSelector); 
 
      $.fn[widgetName].call(em, options); 
 
     } 
 

 
     //Example1 - with namespace 
 
     this.jqUIWidgetByNSAndName("#abc", "cg", "WebsiteGlass", options); 
 

 
     //Example2 - without namespace 
 
     this.jqUIWidgetByName("#abc", "WebsiteGlass", options);