I am using Angular-UI Bootstrap tabs and would like to prevent tab selection during the select event handler. I have tried setting the tab.active to false and setting another tab.active to true, but that doesn't appear to work while in the context of the select event handler.
You can try 'disabled' instead.
Something similar to:
ng-click="tabs.disabled = ! tabs.disabled"
that should disable or enable the tab.
It turns out that I was trying to set the status to a primitive scope value when it seems to require an object with a property that holds the boolean value.
Related
I have a checkbox defined as below:
<mx:CheckBox id="chkUseAmountDue" change="useAmountDue(event)>
What I want is that it should be displayed, but user should not be able to select or deselect the checkbox.
Please suggest.
Use the enabled attribute inherited from UIComponent:
<mx:CheckBox id="chkUseAmountDue" change="useAmountDue(event)" enabled="false">
Typically, instead of 'false' you could use a boolean variable that depends on the state of the app.
I am using angularui bootstrap typeahead module for my project.
I am unable to pre-populate the drop-down with predefined value.
Whenever user click on input text of typeahead, it should automatically show the typeahead suggestion dropdown(from a static JSON).
Whenever user starts typing, then the behaviour should be normal.
I tried this solution but unfortunately it stopped working when I upgraded my angularjs to version 1.3
So I essentially accomplished this by making a custom directive and making a minor modification to the ui bootstrap typeahead code. You have to trick the typeahead into thinking someone has typed something in it. I placed a little pulldown arrow to the right of the field so essentially it looked like a pulldown and clicking on that arrow would show ALL choices. You should be able to do it using onfocus.
Basically find the code in the bootstrap typeahead that binds to the key events and I changed it to check for a keydown event of 40
if(scope.matches.length === 0 && evt.which === 40) { // Added
// COMMENT OUT modelCtrl.$setViewValue(modelCtrl.$viewValue);
modelCtrl.$setViewValue(''); // Added
}
You'll also need to make sure the typeaheadMinLength is set to 0. Note in the code above it checks for the case of the user NOT having typed anything AND the special keydown event that I trigger. You should be able to change this to trigger on onfocus. I copied the bootstrap typeahead to mytypeahead.js and then modified it as above, along with a few other minor mods that you may or may not need depending on if the field is "required" or not.
I have an ng-grid that utilizes the showSelectionCheckbox: true property with a custom checkboxCellTemplate.
If I remove checkboxCellTemplate I get the functionality I want where only one checkbox can be clicked at a time and clicking another checkbox will remove the selection from the previous one.
I need the template to call a specific function so my question comes down to what property to I have to pass in the template so it can be aware of the multiselect property?
The plunker can be found at http://plnkr.co/edit/nULoI4?p=preview.
So to clarify you're wondering if you can get all the values that are selected when you call a function? Don't you already have this setup in the $scope.selections. You could pass this in the function of the template by doing something like this ng-click="getDeliveryLocation({{selections}})".
Another thought is that you use afterSelectionChange:function(){} and add in whatever you need instead of the ng-click on the checkmarks. This will remove some of the odd issues you have between the different selects.
Team,
I am having one problem where I donot want to expand combo box on certain flag and want to display the alert message.
there is no event like onClick in EXTJS so I tried with focus event but still combo box is expanding.
code
focus:function() {
if(this.store.baseParams.donotExpandFlag) {
alert("I should not expand this combo");
// What to do here and out side of IF block so that there is conditional expansion
}
}
You need to specifiy your ExtJS version and please format your code.
Here is what you can do for ExtJS4.x
Manually set/unset the isExpanded property. That should work (untested)
for ExtJS3.x you will have to override the the isExpanded() method and in additon apply a custom flag which indicates blocked/auto and get checked before the default code gets executed.
You may try this (untested)
_isExpanded: true, // true means block, false auto
isExpanded: function(){
return this._isExpanded || (this.list && this.list.isVisible());
},
No, this works. See the JSFiddle for ExtJS3.4
Second JSFiddle for ExtJS3.4 with a form
I disable my jqueryui button in its click event like this
$('#btn').button().click(function(){
$(this).button('disable');
});
and it seems that the button always stays in hover state when I enable it in another place later. I have tried to add $('#btn').button('refresh'), but it's not work.
How can I restore its state to default when it's been enabled?
You can use .trigger('mouseout').
Demo here
When you use the jQuery UI, usually you also use the embedded CSS. When you disable an element the library add the relative class. Maybe you can disable this behaviour when you declare the button.
Try http://jqueryui.com/demos/button/