ExtJS controller actions - javascript

I would like to execute Controller code when a Tab is close.
For that I used Controller action with a ControlQuery.
The query seems to be right but the action never fired...
Here is my fiddle: http://jsfiddle.net/charlesbourasseau/sU7Me/
What am I doing wrong ?

Related

How to disable $window.alert function in AngularJS controller from coming on the page?

I want to stop the alert coming in my dashboard any suggestions?
Thank you!
I tried to override the function alert empty in my controller but still, I'm getting the window alert when I execute my page.
$window.alert = function() {};
I even deleted the $window.alert(); from the controller.js but no use.
It would help if you can replicate your problem, but try to use $event.stopPropagation() where you need to stop even actions.

AngularJs $broadcast not working on load

This HTML button code is in controller:
On click of a button, trying to call this function:
<button ng-click="vm.openpopup()" ng-if="!vm.data.length"
uib-tooltip="Add Business Value Chain"
class="btn btn-default `enter code here`ti-form-action-btn" id="add-bvc-btn">
<em class="glyphicon glyphicon-plus-sign"></em>
Add
</button>
function openpopup() {
$scope.$broadcast('popup');
}
Below is the broadcast listener code which is inside component under the same controller mentioned above:
$scope.$on('popup', function () {
openModalPopup();
});
The button is displayed only when there is no data present.
Function call is absolutely fine, but broadcast works only once if there is data and if those data are deleted manually, then button gets displayed and broadcast works. But for on page load, if no data present. Broadcast not getting triggered.
Tried using $rootScope.broadcast, still no luck.
Also checking with some other answers, binded the block of code inside $timeout, still no results.
So this is a communication between controller and component using broadcast. How to handle this on load?
I think the issue in your case you have controlled the visibility of your button with ng-if, try it using ng-show instead of ng-if. In case of ng-if there is a chance that the template not to load. I hope that will solve your problem.

In AngularJs When i call function not able to get $scope

In angularjs when i click on button,then it will call function of Controller but in that function i am not able to get $scope or $rootScope.
Here is link :
https://plnkr.co/edit/rFDGLPMdvW4BeTBdu5s8?p=preview
when you click on Go To Store.. store page will open.. and click on Add to Cart.. then $scope function will call..but not getting $scope in that functionenter code here
You have a top-level controller called 'MainController'. The Store.html view uses this controller, but the AddToCart function is located in the StoreController. You need to add the Store controller to the store view (top line of store.html):
<div ng-controller="StoreController">
Updated plunkr
Your app is working fine and if you open Developer tools you will see that the debugger breakpoint is being hit. The issue that I found is that you don't have the route defined for Cart. Also the $scope.cartItemCount won't be auto-updated

How can I get a partial view to load on button click?

I have a scenario where I’m using Ajax.ActionLink() to call and load a child view in a parent view. I have a button on the child view that calls another child view. I would like for this child view to also show on the parent view.
I could load the child view into the calling child view if I use Ajax.ActionLink and it would look as if it’s in the parent view which is fine but the button offers me more benefits including sending stuff in the beginform and checking the field before submitting.
When the user clicks on the button it sends selected data from two drowdown lists as well as other data in BeginForm like:
#using (Html.BeginForm("Action", "Controller", new { courseID = 1001 }, FormMethod.Post, new { #id = "formName", #name = "formName" }))
However when the view returns it opens in a new window not in the parent view or the child view that called it.
How can I get the partial view to show in the child view that calls it or on the parent. Meaning parent calls child A and child A calls child B.
Reason #2,343,657 why I despise the Ajax.* family of helpers. They hide functionality, such that when something doesn't work as you expect, you don't know why. Write your own AJAX; you'll never be sorry you did.
Anyways, your problem here is that Ajax.ActionLink writes JavaScript to the page that wires all this functionality up for you. You didn't write that JavaScript (and apparently didn't even know it was there), but it was there, nonetheless.
Now that you've switched to using Html.BeginForm, that JavaScript has gone away, leaving nothing but a standard HTML form, that causes a page reload on submit. If you want the same functionality, you could use Ajax.BeginForm instead. But, before you run off and do that, take the opportunity to improve your code and write the JavaScript yourself. Then, things are very explicit, and you (or another developer) never have to wonder how it works, because it's right there.
All you need to do is attach a handler to the form's submit event, serialize the form, then post it over AJAX, and then do something with the response. I'm going to use jQuery for this example because 1) AJAX is one of those things you should use some sort of framework for to avoid a bunch of repetitive boilerplate code and 2) since it comes with an MVC project by default, there's a fair chance you already have to there and available to use.
$(document).ready(function () {
$('#YourForm').on('submit', function (e) {
e.preventDefault();
$.post('/url/to/post/to', $(this).serializeArray(), function (result) {
// do something with `result`
// For example, if `result` is a string of HTML, you can just
// write it out to some element:
$('#ResultDiv').html(result);
});
});
});

How to handle history.pushState with content change

While Mozilla has an easy to understand documentation on history.pushState and history.replaceState it doesn't show me how to deal with the content when the back button is pressed and content is changed dynamically.
Suppose foo.html has a form and executes an AJAX call to replace its content on submit, then pushState looks like below:
history.pushState({content:$('#content').html()}, '', 'bar.html');
When the user clicks on the back button the URL changes back to foo.html but the page doesn't display the form. How can I display the form? I had a look at popState but couldn't get it to work properly.
so this is what I have done to solve it:
When foo.html loads, I execute history.replaceState({container:$(#container').html()},'', window.location);
Then after ajax call to replace content, I execute this: history.pushState({container:$(#container').html()},'', 'bar.html');
On page load, I bind the popstate to check if event has state object which contains the container like this:
$(window).bind("popstate", function(event) {
if (event.state != null){
if ('container' in event.state){
$(#container').html(event.state.container);
}
}
});
You need to store all of the state you need to re-render the old content, then use that state to re-create the previous page on popstate.
Model-binding techniques such as Knockout.js (or full MVC frameworks) can make this much easier.

Categories