I am very New to AngularJS and I have an web Application that calls an ng-click when a button is clicked. I would like to add code to call this function on page load.
This is the where the function is called in the code. Is there anyway to do this?
When element is loaded you can fire ng-init
<div ng-init="zoom.fit()">
some code
</div>
ng-init documentation
Use this in your controller
$scope.$on('$viewContentLoaded', function() {
$scope.zoo.fit();
});
Related
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 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 add this JS into a link:
Im in page1.php;
I need click in some link Link
And when i go to page2.php some code load this JS:
javascript:void(lz_chat_change_state(true,false));
Any help?
It seems to be simple but not for me......
Solved !
If page1 has ?chat i execute the javascript in page2;
Link in page1.php?chat
In page2.php
if (isset($_GET['chat'])) {
include_once("js-externo.php");
}else{
// Fallback behaviour goes here
}
In file js-externo.php i put:
window.onload = function() {
void(lz_chat_change_state(true,false));
}
Do you mean you want to call that function when you click on the link?
If yes
Make javascript file seperate.
Inside the link you put a "onclick" event and call the javascript function as:
<a href="page2.php" onclick = "lz_chat_change_state('true','false')">
If you want things to change after going to page2.php particularly then you need to use sessions. Pass a value from page1 to page2. But looking at your function (which I assume is being used as a toggle) it's not necessary.
im using jquery tab as example
i have an index.php
<div id="content"></div>
and the custom.js : load page.php only after navigation click, by default the #content is blank
$(function() {
$('#tabs').tabs();
});
// clicked event below
$('#content').load(page.php) // load only when clicked
page.php : the page.php load successfully but the tabs inside the page is not displaying correctly and all the function not working because im using .load()
<div id="tabs">
tabs data etc..
</div>
so my question is:
1. is there a way to reload the custom.js(file) after using .load() function? or
2. is there a way without writing the bunch of jquery code into script tag on the page.php? or
3. is there any better way doing this?
You could trigger an event in the load callback and listen for that in document ready.
$(function(){
$(document).on('ContentsLoadedEvent', function(){
$('#tabs').tabs();
});
});
$('#contents').load('http://localhost/page.php', function() {
$(document).trigger($.Event('ContentsLoadedEvent'));
});
Currently you are initializing jquery tabs when page is full loaded(but your html is not available that time because you are loading content via ajax after page is loaded),so you have to initialize jquery tabs plugin after html is rendered on page by load call, you have to use load success callback:
$('#content').load("page.php",function(){
$('#tabs').tabs();
});
I've asp.net web site , i used master page for the design. I've many child pages which are placed in the contentplaceholder. I want to call the javascript function on the page load event of the child page. And there are different javascript functions on each child page.
thanks
try creating a
<script>
(function yourFunc() {
....your code ....
})();
</script>
in the child page and there you can use the function