Tuesday 15 April 2014

javascript - durandaljs - how to query a DOM element from a widget after ready -


I want to be ready when asking an element in a Durandaljs widget. If I use the selector directly in data binding, then the element will not be found:

html (no adjacent views):

  & lt; Button ID = "myButton" & gt; & Lt; / Button & gt; & Lt; Div data-bind = "widget: {sort: 'myWidget', option: {btn: $ ('# myButton')}}" & gt; & Lt; / Div & gt;   

Controller Js:

  define (function (requirement) {var ctor = function (element, settings) {var btn = settings.options.btn; // btn = $ ('# myButton') ; // This will work, but I'm not sure if the DOM // is currently constructor in BTN.On ("click", function () {console is ready ("I have to be removed")}) ;}; Return ctor;});   

What is the best way to query a DOM element when starting with the Durandall widget?

I'm not sure where the html fragment is related, so there are two different answers.

Firstly, I recommend that you have jquery objects ( {btn: $ ('myButton')} as btn , when you are sure It is not that it is already present in the selector {BTN: '#mbutton}' and the widget will know how to deal with it.

Is your widget your own view HTML and buttons defined inside? If so, you should take a look at the ViewAntend callback.

  var ctor = function (element, settings) {this.btn = settings.options. Btn; }; Ctor.prototype.view Attach = function (see) {var btn = $ (this.btn, view); If (btn.length & gt; 0) {btn.on. ("click", function () {console.log ("I want to expel");}); }}   

If your widget does not have its own view, you should give the widget to the settings object with the value of the herd by adding visible assets.

Here is the paragraph which states that.

Note: In some cases, your widget may not actually require a view, maybe it's just adding some jQuery behavior or implementing an existing jQuery plugin in a DOM element. Used to be. To tell Durandal that there is no view to load and bind, add a visual property with the false value inside the settings widget within the constructor of your widget. In that example you can only access elements which are already in the DOM when the widget is instant eg.

  var ctor = function (element, settings) {settings.view = false; This.btn = $ (settings.options.btn); If (this.btn.length & gt; 0) {this.btn.on ("click", function () {console.log ("I have to be removed");}); }};    

No comments:

Post a Comment