I have a jQuery function that uses ajax to get data, then displays it, I want to use an if statement to determine if the function has already been run, if it has, a certain section of the function doesn't run again, for some reason, the if statement is being ignored.
This is my code:
<script type="text/javascript">
var a = 1;
$(function() {
if(a<2) {
$('.notifications').click(function() {
$('#notifications2').show();
$('#loader').show();
$.get('/getnotifications.php', function(data) {
$(".getnot").append(data);
$('#loader').hide();
a++;
});
});
}
});
</script>
Any idea why this is failing to work?
You're placing the if statement at the wrong point, try this:
<script type="text/javascript">
var a = 1;
$(function() {
$('.notifications').click(function() {
if(a<2) {
$('#notifications2').show();
$('#loader').show();
$.get('/getnotifications.php', function(data) {
$(".getnot").append(data);
$('#loader').hide();
a++;
});
}
});
});
</script>
You're current code is simply checking that a is less than 2 when the document first loads, not every time you click on .notifications.
Related
Sorry if the question is really dumb, however, I couldn't find how to solve it.
I have a very simple methid in a controller:
public string ExactSeconds()
{
string str = DateTime.Now.Second.ToString();
return str;
}
The view is simpler than the method:
<p id="rData"></p>
<p id="qqqqq">click me!</p>
JavaScriptCode:
<script type="text/javascript">
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
var url = "/Home/ExactSeconds";
$.get(url, null, function (data) {
$("#rData").html(data);
});
});
});
});
However, When I click at id="qqqqq", then it just uploads data(seconds) just for the first time. Then if I click the second time and the next times, then alert('') works perfectly, however it is not called method ExactSeconds, that is I cannot see updated seconds at the view.
How to call method ExactSeconds() always when I click at #qqqqq?
When I remove your AJAX calls, this works fine.
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
$("#rData").html(Date.now);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="rData"></p>
<p id="qqqqq">click me!</p>
Secondly, why do you have nested one AJAX get call inside another. How about just one call?
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
var url = "/Home/ProverbPartialView";
$.get(url, null, function (data) {
$("#rData").html(data);
});
});
});
<script type="text/javascript">
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
var url = "/Home/ProverbPartialView";
$.get(url, null, function (data) {
$.get(url, null, function (data) {
$("#rData").empty();
$("#rData").html(data);
});
});
});
});
Try this by adding $("#rData")..empty(); in the code
I want when I click in the image I get the new but after 1 second I want to get the default.
I added the function setTimeout(), but after one second I still have the same image (pressed.svg)
This is all my code :
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script language='Javascript'>
$(document).ready(function(){
$("#myImage").on("click",function() {
$(this).attr("src","images/pressed.svg");
setTimeout(function() {
$(this).attr("src","images/normal.svg");
},1000);
});
});
</script>
</head>
<body>
<img src="images/normal.svg" id="myImage">
</body>
</html>
The problem is that this in your anonymous function call refers to the wrong this. You need to assign the value of this in your handler to a temporary that will be used by the anonymous function:
$(document).ready(function() {
$("#myImage").on("click",function() {
var me = this;
$(me).attr("src", "images/pressed.svg");
setTimeout(function() {
$(me).attr("src", "images/normal.svg");
}, 1000);
});
});
You could accomplish the same thing using just the DOM, since you aren't doing anything jQuery specific:
$(document).ready(function() {
$("#myImage").on("click", function() {
var me = this;
me.src = "images/pressed.svg";
setTimeout(function() {
me.src = "images/normal.svg";
}, 1000);
});
});
Demo : http://jsfiddle.net/
JS Fix :
$(document).ready(function(){
$("#myImage").on("click",function() {
var $img = $(this);
$img.attr("src","images/pressed.svg");
setTimeout(function() {
$img.attr("src","images/normal.svg");
},1000);
});
});
when you do $(this) in setTimeout, it wont work as there is no reference in settime out function. cache the element first and then use it in settimeout.
I need a script thats redirects the user to a second side, when the mainpage need to long to load.
I did this:
<script type='text/javascript'>
$(document).ready(function() {
setTimeout("location.replace('contact.html')",10000);
});
</script>
To sametime a preloader opens an get hided on on body onload, when that happens i need to kill the functon above?
Anybody an idea?
Try this:
var redirect = setTimeout(function(){
window.location = 'somewhere'
}, 10000)
$(document).ready(function() { // or $(window).load(function() {
clearTimeout(redirect);
});
setTimeout("location.replace('contact.html')",10000);
Instead, you can try
setTimeout(function(){window.location='contact.html'},10000);
You Can try Following
var Ispreloader=false;
<script type='text/javascript'>
$(document).ready(function() {
if(!Ispreloader)
{
myfunction();
}
});
function myfunction()
{
setTimeout("location.replace('contact.html')",10000);
}
//------------Whenever preploadeer loads on bodu unload set the variable to true
Ispreloader=true;
</script>
We have code that spits out several script blocks which add identical functions to the queue that gets called when the document is ready. For example:
$(document).ready(function(){
alert('hey');
});
$(document).ready(function(){
alert('hey');
});
$(document).ready(function(){
alert('hey');
});
This is not causing any problems but of course its unnecessary to call the same code several times.
Without changing the code that generates the repeated blocks, is there a way to make jquery only run the first code block and skip the rest?
Keep in mind that there is the possibility that the ready queue has other functions before and after the repeated code.
I would use an object literal to wrap duplicate code, and set a boolean when it has been called once so it will not be run again:
$(document).ready(function(){
DuplicateHelper.SomeMethod1();
});
$(document).ready(function(){
DuplicateHelper.SomeMethod1();
});
$(document).ready(function(){
DuplicateHelper.SomeMethod1();
});
var DuplicateHelper = {
HasMethod1Run: false,
SomeMethod1: function() {
if (!this.HasMethod1Run) {
// do logic
this.HasMethod1Run = true;
}
}
}
EDIT
You don't have to use the object literal for the code if you are generating the code dynamically, but you can use the same principle with the boolean:
var runCode = true;
$(document).ready(function(){
if (runCode) {
DuplicateHelper.SomeMethod1();
runCode = false;
}
});
$(document).ready(function(){
if (runCode) {
DuplicateHelper.SomeMethod1();
runCode = false;
}
});
$(document).ready(function(){
if (runCode) {
DuplicateHelper.SomeMethod1();
runCode = false;
}
});
However, I agree with netbrain that this situation is indicative of problems elsewhere in the architecture of your solution.
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$("a").click(function() {
$("#myDiv").load( "job_board_data.php", { pageNo: $(this).text()} );
return false;
});
});
</script>
1
How can I pass variables to my job_board_data.php script???? I want to pass variables such as page, sort by .. anyone?
$(document).ready(function() {
$("a").click(function() {
$("#myDiv").load("job_board_data.php", { pageNo: $(this).text()} );
return false;
});
});
In that code, when a user clicks on a link, you are loading the contents of the response for "job_board_data.php?pageNo=1" into a div.
job_board_data.php sees this as a regular HTML url call, so it would put the parameters (that you specified in the second parameter of $.load.
for example, using your above .load statement:
$_POST['pageNo']
will return
"1"
$('a').click(function () {
$('#myDiv').load($(this).attr('href'));
}