scope.resetall = function () {
$scope.website.forEach(function (web) {
web.CouponID = false;
});
};
i try to reset radio button using forEach.Its working fine in all browser except IE8.
I am using angular js 1.2.17
After a quick research, I found out that forEach doesn't work well on IE8, try using a good old for loop:
for(var i=0; i < $scope.website.length; i++){
$scope.website[i].CouponID = false;
}
Related
We are working on an application in which we are using Angularjs + webapi and making a Single Page App.
We have quite few Modal Pop-ups from Bootstrap used in the app, but we are facing an issue
-> on click of the modal button, the backdrop initializes and then is stuck with no modal. and we have to force refresh the browser. We are pulling the templates from other files into the modals.
initially for closing the modal, I've used $(".modal.in").hide(); and the close is fine with out the "Stuck" on grey screen.
then later for init the modal itself it started to appear then I removed the fade class and removed the animations from the css but didn't help much.
Really need a promising fix.
$.support.transition = (function () {
var thisBody = document.body || document.documentElement
, thisStyle = thisBody.style
, support = thisStyle.transition !== undefined || thisStyle.WebkitTransition !== undefined || thisStyle.MozTransition !== undefined || thisStyle.OTransition !== undefined
return support
})()
// set CSS transition event type
if ( $.support.transition ) {
transitionEnd = "TransitionEnd"
if ( $.browser.webkit ) {
transitionEnd = "webkitTransitionEnd"
} else if ( $.browser.mozilla || $.browser.msie ) {
transitionEnd = "transitionend"
} else if ( $.browser.opera ) {
transitionEnd = "oTransitionEnd"
}
}
The above code snippet was advised in some forums.
But in the Bootstrap.js Bootstrap v3.2.0 (http://getbootstrap.com)
function transitionEnd() {
var el = document.createElement('bootstrap')
var transEndEventNames = {
WebkitTransition : 'webkitTransitionEnd',
MozTransition : 'transitionend',
OTransition : 'oTransitionEnd otransitionend',
transition : 'transitionend'
}
for (var name in transEndEventNames) {
if (el.style[name] !== undefined) {
return { end: transEndEventNames[name] }
}
}
return false // explicit for ie8 ( ._.)
}
You can create a directive that includes the templates you want and launch and then control the boostrap modals from with in that directive. the external communication can be achieved in many ways my favorite using custom events watched by the directive to know when to hide or show the modals that way you can use all the bootstrap code you already have from INSIDE your directive. this can also be done through a service, not my favorite solution, but is also accepted. for more ideas look at the angular-ui project and the modal service
http://angular-ui.github.io/bootstrap/
I m trying to set value to combobox in extjs, this is working in chrome but not in firefox. I used the following code:
function callFromController(comboitemid,itemvalue) {
Ext.ComponentQuery.query(comboitemid)[0].setValue(itemvalue);
};
AS a general guidence I would use:
function callFromController(comboitemid,itemvalue) {
// make sure you add a # to your Id string or use Ext.getCmp insted.
var foundComponents = comboitemid && Ext.ComponentQuery.query(comboitemid);
if (foundComponents.length) {
// I would add to see in your console.log('foundComponents[0]=%o',foundComponents[0])
// to check the value of the found component
foundComponents[0].setValue(itemvalue);
}
};
this not work for me (i use v2.0.0-beta.4)
var popover = document.body.querySelector('.popover');
angular.element(popover).scope().$destroy();
here my full code:
angular.element(document.body).bind('click', function(e){
if (e.target.classList.contains('popover-link')) {
return;
}
var popover = document.body.querySelector('.popover');
if (!popover) {
return;
}
popover = angular.element(popover);
if (popover.find(e.target).length) {
return;
}
popover.scope().$destroy();
});
what i need todo? how i must close the popover?
This is a duplicate of Close AngularStrap popover
Here is my answer over there :
There is an issue in the angular-strap github project which asks
exactly the feature you want.
Nevertheless, at the moment I'm writing this answer, it's still open.
I am using iscroll4 in my application. I am facing problem with iScroll that made drop down lists(combo box) unusable when used at the same time.
I tried how they mentioned here
( http://groups.google.com/group/iscroll/browse_thread/thread/5b2fbad6aa667907# )
$(document).ready(function() {
var destinations_scroll, accounts_scroll;
function loadingIscroll() {
accounts_scroll = new iScroll('accounts_container');
destinations_scroll = new iScroll('destinations_container', {
checkDOMChanges: true
});
setTimeout(function() {
destinations_scroll.refresh();
}, 0);
}
document.addEventListener('touchmove', function(e) {
if (e.target.tagName != "SELECT") {
e.preventDefault();
e.stopPropagation();
}
}, false);
addEventListener('DOMContentLoaded', loadingIscroll, false);
});
But still select box (combo box/drop down) not working. Any suggestions?
Hi I got an answer from iScroll 4 not working with form <select> element iPhone Safari and Android browser. Thanks to #comonitos. I used his solution.
A very stripped down example here.
Code:
function changeBackground() {
var testDiv = Ext.get("test");
var allStyleDivs = testDiv.select("*[style*='background-color'], *[style*='BACKGROUND-COLOR']");
allStyleDivs.each(replaceBackground);
}
function replaceBackground(element) {
element.setStyle('background-color','blue');
}
In FF, IE8, Chrome this page works fine. IE7 says Object doesn't support this property or method. What's the dealy yo?
See this post on the ExtJs Forum