I am trying to apply an enhancement on below code line. If anyone knows solution, please help me!
loaderMask = new CQ.Ext.LoadMask(CQ.Ext.getBody(), { msg:"Loading... Please wait"})
loaderMask.show();
This loader mask is fixed in the page position and I like to fix it on the user screen while user scrolls up or down on the page.
Thankyou!
That would be:
scrollPanel.getScrollable().on('scrollstart', function(){
scrollPanel.mask({message: 'scrolling'});
});
scrollPanel.getScrollable().on('scrollend', function(){
scrollPanel.unmask();
});
But it sounds more like, you are loading data and while loading you want to mask the container. If so you might want to listen to the beforeLoad and load event of the store and mask and unmask while it is loading.
The alternative is to use databinding to the store.loading.
If you want to know more about that, please setup a fiddle (fiddle.sencha.com).
Related
Searching for this, but found no answer. I wanted to have a condition in Ionic/AngularJS that checked if it was the very first screen that opened, on application launch.
On a registerBackButtonAction action, I wanted to check for a specific state if it was the very first screen, or if it was an other moment of the lifecycle of the application.
Other suggestions for approaching the problem are welcome.
Thank you in advance.
You can use $ionicView.enter
$ionicView.enter : The view has fully entered and is now the active view. This event will fire, whether it was the first load or a cached view.
$scope.$on("$ionicView.enter", function(event, data){
// handle event or check state or whatever here
console.log("State Params: ", data.stateParams);
});
Hope it helps
I have a protractor test looking for a record in my infinite scroller component like this.
searchPage.searchEntitlement('search criteria');
var myHiddenElementInScroller = element(by.repeater('result in ctrl.results track by $index').row(12));
browser.driver.executeScript(function () { arguments[0].scrollIntoView(); }, myHiddenElementInScroller .getWebElement());
myHiddenElementInScroller.click();
This is supposed to scroll to the element and click it. Instead its throwing me element not visible error.
Has anyone come across this situation? Any help greatly appreciated.
You might need to explicitly wait for the scrolling into view actually happen:
browser.driver.executeScript("arguments[0].scrollIntoView()", myHiddenElementInScroller.getWebElement()).then(function () {
myHiddenElementInScroller.click();
});
Or, with browser.actions():
browser.actions().mouseMove(myHiddenElementInScroller).click().perform();
In few scenarios the element which we are looking for will be covered with some other element from DOM.when protractor tries to click it,the click will be received by the element that covers the actual element. So in such situation you need to use native javascript click event. Look at the below code.
browser.executeScript("arguments[0].click()", myHiddenElementInScroller.getWebElement())
The above code will send a click event directly to the mentioned webElement even if it is visible or not.
NOTE: this is not the recommended way for clicking an element. but you can you this in scenarios where you have no other workaround to achieve the click event.
Thanks for all the responses. I was able to resolve this issue by using element(by.CssContainingText(cssSelector, searchText)) locator.
I am attempting to use $mdToast.updateTextContent() to update a toast and am unsuccessful. The docs don't go into detail on how to call it with a new message. My desire result would have the first toast display 'Adding account' then change to 'account successfully added'. Any help would be greatly appreciated.
I think the correct way to approach this using material design standards would be to only use the toast once the account has been added. The loading could be a spinner or maybe a loading bar (maybe like this http://materializecss.com/preloader.html)
Once the $mdToast is open, you're able to call updateTextContent (as you stated)
$scope.onAccountAdded = function() {
$mdToast.updateTextContent('Account successfully added')
};
We're watching the variable for changes and update the view automatically, once the value has changed.
https://github.com/angular/material/blob/master/src/components/toast/toast.js#L299
Here is a demo, which shows how it works.
http://codepen.io/DevVersion/pen/qNWewJ
Is there a way to disable the pagination/pager buttons while data is asynchronously loaded by the data service? I have a temporary solution including jquery which goes like this
$(".ng-table-pager button").attr("disabled", true);
and then on data loaded i turn it back to false but I find it's a poor solution so I will be thankful if someone would nudge me to the right direction.
You have to create one Boolean variable in your controller, for example -
var isLoading = false;
Then set it's value true before calling your API (service) and false after finish calling your API from your controller.
Now in your view you have to do something like this:
div ng-disabled="isloading"> !--your pagination/pager buttons --> /div>
I hope you are clear with the idea.
I am using ExtJs mask while executing Ajax call.
var tmpMask = new Ext.LoadMask(Ext.getBody(), { msg: "Loading please wait..." });
tmpMask.show();
When request is finished I am hiding the mask
tmpMask.hide();
I would like to insert instead of text, div that includes image.
Please advice .
LoadMask msg is actually html, so you could put anything you want inside.
I also recommend tring ExtJs templates techniques, like XTemplate for example.
Check it out:
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.XTemplate
EDIT: example
http://jsfiddle.net/nW3Bv/1/