I am using Range Slider from the AngularJs Slider in my application. As per the documentation, I have used the on-change event which is not firing up.
Below is my code in HTML
<rzslider rz-slider-floor="editor.slider.min" rz-slider-ceil="editor.slider.max" rz-slider-model="editor.slider.selectedMin" rz-slider-high="editor.slider.selectedMax" rz-slider-step="1" rz-slider-on-change="onSliderChange()">
</rzslider>
Below is the controller code
editor.onSliderChange = function () {
console.log(editor.slider.selectedMin);
}
Can someone help me on this regarding where I might have gone wrong?
Thanks in advance
You forget to add editor. prefix.
rz-slider-on-change="editor.onSliderChange()"
Related
I am using the angular-ui-swiper and I want to set the active slide depending on the URL-Parameter. I have an angular controller, where the data is loaded for the swiper. This works fine, the buttons are working (prev, next). I call the method slideTo to set the activeslider after link click in the navigation. But it is not working if I load the page with the special parameter. The swiper-instance is not defined. So I have to call the correct page lifecycle event. I used the load, init-events, an equivalent to document ready, but without any success. It is only working if I put my setActiveSlide-Method to the scroll-event :D
Do you have any idea?
Thanks in advance
Maybe you need to make the set the activeslider in this kind of block:
angular.element(document).ready(function () {
//code here
});
Can you make a jsfiddle so we can see your code?
I am fairly new to AngularJS and the TinyMCE editor. I was fiddling around with the keyup event available in TinyMCE when I came across this issue. In the keyup handler, I am accessing one of the controller's ng-model. Here's where things start to get odd. I printed out the ng-model value and the editor's content for comparison purposes and it would seem that the ng-model is lagging by 1 key/character behind i.e. the editor's content is the most up to date. I have a hunch that the model is updated only after the keyup event is finished. That would explain why I am seeing two values here. Perhaps I am going about this the wrong way? Speaking of which, what would be the best/correct way to access the editor's contents? Through angular or TinyMCE?
If it helps, the code looks something like this (They are placed under a single controller):-
...
this.text = "";
var viewModel = this;
this.tinymceOptions = {
setup: function (editor) {
editor.on('keyup', function (e) {
console.log(editor.getContent());
console.log(viewModel.text);
});
},
...
};
Has anyone encountered this problem before?
Thanks for the help in advance!
scope.$watch('[apps, date]', function() {
...
...
...
}
Now I know that the above works, but what I need is it to display nothing unless an app is selected first and THEN after that when an app or a date is changed, the code must re-run.
Perhaps this isn't possible.
Any help would be greatly appreciated. :)
**Context:
What happens is I get a UI grid returned with no data(as no app has been selected) until I eventually select an app.
If your intent is to watch a group or a collection you just have to scroll down this page:
https://docs.angularjs.org/api/ng/type/$rootScope.Scope
Search for example: $watchGroup inside the page
I'm trying to detect if a user has focus on md-contact-chips.
On all other controls it can easily be detected inside a form via formName.controlName.$touched
Here is the CodePen
Thanks in advance.
I think the md-contact-chips are not a form element or a link, and thus don't have the ability to gain / lose focus. (source: AngularJS docs on ngFocus) You could bind ng-click on md-contact-chips though.
Example CodePen which binds ng-click and receives the model value of the clicked md-contact-chips.
As you can see I added a ng-click to the md-contact-chips element:
<md-contact-chips ng-click='ctrl.chipFocus(ctrl.contacts)'
And I added the chipFocus method to the AngularJS controller:
self.chipFocus = function(contact) {
alert('focus gained');
console.log(contact);
//you could do something with contact here
};
This might be the answer to your question, but if you want the chips input to add on loseFocus, or tab, you can add this:
md-add-on-blur="true"
Reference: https://github.com/angular/material/pull/9095
I have a button with id of btnAdd and I want to disable it when some event is fired. The event occurs when some window is closed. So I tried the following code and it does not work.
Ext.create('Ext.window.Window', {
// Some initialization code goes here...
listeners: {
close: function(panel, eOpts){
Ext.get('btnAdd').disable(); // this does not work;
Ext.get('btnAdd').setDisabled(); // this one does not either
Ext.get('btnAdd').disabled = true; // And this one also seems to do nothing
}
}
});
How can I do that? This may seem to be pretty easy question but don't judge me bad. I'm quite new to Ext JS. I could not find the answer in the API Documentation either.
Ext.get('btnAdd').setDisabled(true);
http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.button.Button-method-setDisabled
IF the button is Extjs component then use
Ext.getCmp('btnAdd').disable();
If it is not Ext js Component then use
Ext.get('btnAdd').setDisabled(true);
I hope this will help.
Ext.get('btnid').disable();
Ext.get('btnid').setDisabled(true);
both return errors, the best way that work without issues is
Ext.getCmp('btnid').setDisabled(true)
and you can set a text when the button is disabled to notify the user.
Example:
Ext.getCmp('btnid').setText("Button has been disabled")
Ext.get('btnid').disable();
Ext.get('btnid').setDisabled(true);