can we call a function outside the document.ready in jquery - php

I have tried doing various things but no luck. My idea is to call a function in between the php code like this sample(); if this gets success. Can any one help me.
<p id="test"></p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
jquery_test = function() {
$('#test').text('jquery test');
}
jquery_test(); // this function works
});
try {
jquery_test(); // this function doesn't
} catch(e){
console.log(e.message); // throws "jquery_test is not defined"
}
</script>

Define the function on the window object to make it global.
$(document).ready(function(){
window.jquery_test = function(){
$('#test').text('jquery test');
}
});
See that : How to call a function within $(document).ready from outside it

Related

How to add JQUERY function to phpfox?

I'm a newbie to php fox. i want to add jquery function to phpfox but no success. please suggest me proper way of adding jquery function to phpfox.
<script type="text/javascript" >
$Behaviour.onLoadEvents = function(){
}
$Behavior.onClickEvents = function() {
};
$(document).ready(function() {
$("div").click(function() {
alert("Hello, world!");
});
});
no success with all of these three functions.
and getting an error
SyntaxError: missing { before function body
on console window

Jquery loginAlert is not defined

I'm trying to call a jquery function via php.
In my PHP Pages head section I have :
<script src="login.js" type="text/javascript"></script>
this file contains:
$(document).ready(function() {
function loginAlert() {
alert ('Message when logging in');
}
});
Below this in the php pages head section I have:
<script type="text/javascript">
$(document).ready(function() {
<?php if ($login === 1) { ?>
loginAlert();
<?php } ?>
});
</script>
When I load the page the chrome console shows:
jQuery.Deferred exception: loginAlert is not defined ReferenceError: loginAlert is not defined
Uncaught ReferenceError: loginAlert is not defined
What am I doing wrong ?
How can I call this function ?
Define the Function outside of document.ready or You can use Function expression.
$(document).ready(function() {
// Function expression
var loginAlert = function() {
alert ('Message when logging in');
}
});
See below code may it helps !!
PHP
<?php
$login = 1;
if ($login === 1) {
echo "<script type='text/javascript'>$(document).ready(function() { loginAlert(); });</script>";
}
?>
jQuery
<script type="text/javascript">
function loginAlert() {
alert ('Message when logging in');
}
</script>
Note : Do not forget to include jQuery CDN.
Define your function outside document.ready as it is not accessible
as
<script>
function loginAlert() {
alert ('Message when logging in');
}
$(document).ready(function(){
});
</script>

Call jquery function from php page

I created a jquery function in a js file that is included in a php page.
Js file
$( function() {
function disab(){
$('input#idname').attr('disabled', 'disabled');
}
});
In my php file I tried to call the disab function in this way but with no success.
echo "<script>";
echo "$(function(){";
echo "disab();";
echo "});";
echo "</script>";
How can I do this? thanks
first of all put your funciton outside the document.ready function in your js file...so that it is global and can be accessed from anywhere.
function disab(){
$('input#idname').attr('disabled', 'disabled');
}
$( function() { .. }); //use if needed..
and call the function inside <script> tag in php file
<?php
//all you php related codes
...
?>
<script>
$(function(){
disab();
});
</script>
and most important, use prop() instead of attr() ... if you are using latest version of jquery (jquery 1.6+ )
$('input#idname').prop('disabled', true);

jQuery&php fire function when page is loaded

I have a php page with jQuery, with range sliders.
When the sliders are changed the jQuery code sums the values.
I also want this code to be fired when the page is loaded. But it doesn't happen when I trigger the function inside $(window).load(function() {}); or directly in $(document).ready(function() {});.
Here's the jQuery code:
$(document).ready(function() {
$(window).load(function() {
countSilders();
});
function countSliders(){
var SliderValue = parseInt($("#slider0").val())+parseInt($("#slider1").val())+parseInt($("#slider2").val());
if (SliderValue==10)
$("#submit_next").button("enable");
else
$("#submit_next").button("disable");
$("#lblsum_scores").text(SliderValue+"/10");
}
$(document).on("change","#sliders", function(){
countSliders();
});
});
Try this:
// First define your function
function countSliders() {
var SliderValue = parseInt($("#slider0").val()) + parseInt($("#slider1").val()) + parseInt($("#slider2").val());
if (SliderValue == 10) $("#submit_next").button("enable");
else $("#submit_next").button("disable");
$("#lblsum_scores").text(SliderValue + "/10");
}
// Run on ready, don't use ready and then on load, that will never happen
// And i changed the on() to change()
$(document).ready(function(){
countSilders();
$("#sliders").change(function(){
countSliders();
});
});
You should be able to do:
function countSliders(){
...
}
$(document).ready(function() {
countSilders(); // fire it on load
// bind it to sliders
$(document).on("change","#sliders", function(){
countSliders();
});
});

Load javascript function and when its loaded load it again in a specified number of seconds

He guys,
Maybe you can help me, i need a code when the page is loaded a function (below)
function update() {
$('#animation').load('/Stream/readLevel');
}
needs to execute, when this action is complete (so the content of the page /Stream/readLevel has been fully loaded the function must be loaded again in a number of seconds (2 seconds).
How can i accomplish this?
Thanks in advance!
As you only want to reload after the contents has been fully loaded you have to set the timer in success callback of $.load function like following, otherwise it will send request to server every two seconds irrespect of if the previous ajax request has been completed or not.
function update() {
$('#animation').load('/Stream/readLevel',function(){
var timer = setTimeout(update,2000);
});
}
$(function(){
update();
});
you can do it like this.
$(function(){
update();
});
function update() {
$('#animation').load('/Stream/readLevel', function(){
alert("after two seconds of load");
setTimeout('update()', 2000);
});
}
​
<script>
function update() {
$("#animation").load('/Stream/readLevel',"",function(){
setTimeout(update,2000);
});
}
</script>
<body onload="update()">
// HTML CODE
</body>
Try
function update(){
$('#animation').load('/Stream/readLevel',function(){
setTimeout(update,2000); });
}
var c = 2;
function update() {
$('#animation').load('/Stream/readLevel');
}
function startTimer(){
if(c< 0){
c=2;
}
if(c==2){
update();
}
timer = setTimeout('startTimer()',1000);
c=c-1;
}
$(document).ready(function(){
startTimer();
});

Categories