Onload Javascript/jQuery Not Working In HTML - javascript

Java script in Html is as follows.
$(document).ready(function () {
var found = {{.found}}
window.alert("hiiii");
if (foundRecords==true) {
document.getElementById("abc").style.display = "block";
}
return
});
This should get loaded during the time of html loading. But it's not at all loading. I didn't find anything wrong in this simple peace of code.

if you want to get elements with class found {{.found}}
window.onload = function()
{
var found = document.getElementsByClassName("found");
if (found) {
document.getElementById("abc").style.display = "block";
}
}

If you use jQuery to load that function it will take a slight change:
$(document).ready(function () {
// get the class found and assign it to a variable found
var found = $('.found') // it was {{.found}} producing an error
window.alert("hiiii");
// where does foundRecords come from? it is up to you to clear this
if ( foundRecords == true ) {
document.getElementById("abc").style.display = "block";
}
// what is the return good for?
// it would be better to return true or false
// or leave it away
return;
});
Check the jsFiddle:
http://jsfiddle.net/bx0e18L4/
Now it alerts the message, but still has the problem with the variable foundRecords. Take care for that.
EDIT:
According to your comments above the variable foundRecords should be found, so the critical line should be:
if ( found == true ) { // processing }

Related

code after else not fully working with jquery, javascript. I'm so confused :(

I am very new to javascript and jquery. I can't even figure out how to debug and view log files like I can with php :( So I am hoping someone here will help.
I have this simple code which for the most part works. Its just the if / else
The problem is that if chklogin == 1 as shown below $('#myModal').show(); does what i expect it to do.
However if its not = to 1, $('#myModal').show(); does not work. I also know I am in the else part of my code because I stuck the alert in there that actually displays the message. Its just the other statements don't work when they do otherwise.
$("[id^='mod_']").click( function(event) {
event.preventDefault();
var url = this.href;
var chklogin = $(this).attr("data-modalchklogin");
var h2 = $(this).attr("data-modalh2");
var h3 = "Thanks!";
var line1 = $(this).attr("data-modaltext1");
var line2 = $(this).attr("data-modaltext2");
if ( chklogin == 1 ) {
$.post("ajaxqueries.php", {"checkloggedin": ''}, function(data) {
var loggedin = data;
if ( loggedin == 0 ) {
$('#myModal').show();
$('#ModalH2').text(h2);
$('#ModalH3').text(h3);
$('#ModalLineOne').html(line1);
$('#ModalLineTwo').html(line2);
} else {
window.location = url;
}
});
} else {
alert('I am here');
$('#myModal').show();
$('#ModalH2').text(h2);
$('#ModalH3').text(h3);
$('#ModalLineOne').html(line1);
$('#ModalLineTwo').html(line2);
}
});
Thanks for looking !!!
You should console.log($('#myModal')); before $('#myModal').show();
and see what it is. Then console.log('whatever') after $('#myModal').show();.
After that you might know the answer.
First, make sure that your code has a node (< >) with id = "myModal".
If so, open your browser debug tools (in Chrome: Ctrl + Shift + l) and check if any error occurred.

slideUp command being ignored, but works in console?

Below is my snippet of code, intended to show the comments of a certain thread that's selected.
$('.comments-count').click(function(){
if(!commentsDown){
$(this).parent().parent().siblings('.comments').stop().slideDown();
commentsDown = true;
currentlyDown = $(this).parent().parent().siblings('.comments');
}else{
$(currentlyDown).stop().slideUp();
var newDown = $(this).parent().parent().siblings('.comments');
if(newDown != currentlyDown){
$(this).parent().parent().siblings('.comments').stop().slideDown();
commentsDown = true;
currentlyDown = $(this).parent().parent().siblings('.comments');
}else{
commentsDown = false;
currentlyDown = null;
}
}
})
The line $(currentlyDown).stop().slideUp(); works if you post it into the console, but for some reason it's ignored in this script. I put in console.log() commands and it showed that it definitely should execute it.
commentsDown and currentlyDown are global variables, initially set to false and null respectively.
Here's a JSFiddle. The threads are currently static HTML. As you can see, if you open a thread and then open a different one it works fine, but it doesn't work to close a thread.
You should be able to reduce your whole block of code to:
$(document).ready(function () {
$('.comments-count').click(function () {
$('.comments-count').not($(this)).parent().parent().siblings('.comments').stop().slideUp();
$(this).parent().parent().siblings('.comments').stop().slideToggle();
})
//Log colour pattern
$('div.event-log-entry:even').addClass('evens');
$('div.event-log-entry:even .comments-count').addClass('evens');
})
jsFiddle example
Add your function inside document.ready tags;
$(document).ready(function () {
//insert your code here
});
For more info. go on this site:
http://learn.jquery.com/using-jquery-core/document-ready/
Hope it helps :)

$(document).ready(function(){ code }); not getting called

I know this has been asked multiple times, but neither of the answers seem to help me.
I've been almost two days trying to get around this but I haven't been able to figure out what's going on.
I have the following code:
alert('Before document.ready');
$(document).ready(function () {
alert('Actual document.ready');
addNumberValidation($("#quantity"), $("#quantityError"));
addNumberValidation($("#price"), $("#priceError"));
$("#form").submit(function(){
var quantityValid = validar( $("#quantity"), $("#quantityError") );
var priceValid= validar( $("#price"), $("#priceError"));
var formValid = quantityValid && priceValid;
return formValid ;
});
});
function addNumberValidation(mainElement, errorElement) {
mainElement.keyup(function () {
validate($(this), errorElement);
});
}
function validate( mainElement, errorElement) {
var regex = /^[0-9]+$/;
var result = false;
if ( mainElement.val().match(regex)) {
errorElement.text('');
result = true;
} else {
errorElement.text('Must be a number');
result = true;
}
return result;
}
The script is getting loaded correctly because the "Before document.ready" alert is getting called correctly. Also, jQuery is getting loaded as well because other js code is executing properly.
My console shows no error whatsoever and the script under the sources tab in Chrome is complete.
I documented the functions to see if there was something wrong with that and it still didn't work.
Any insights of what could be going on?
Found the issue. Another library was making a conflict that avoided the document.ready to get called

Javascript indexOf condition not behaving as expected

I have a javascript function that runs on window.onload:
if(window.onload) {
var curronload = window.onload;
var newonload = function() {
curronload();
formatICCID_IMEI();
};
window.onload = newonload;
} else {
window.onload = formatICCID_IMEI;
function formatICCID_IMEI() {
var IMEI = $find("<%=cbIMEI.ClientID %>");
alert(IMEI.get_textBoxControl().value);
alert(IMEI.get_textBoxControl().value.indexOf("."));
if (IMEI.get_textBoxControl().value.indexOf(".") > -1) {
alert("Hi!");
}
}
I'm using this more elaborate way of calling my function from this link because if I just use window.onload or document.onload, my control (cbIMEI) is not found. Using this more elaborate method, I don't have that problem. However, my function formatICCID_IMEI is acting strangely. I don't know if it's due to the way I'm calling formatICCID_IMEI, or just something in formatICCID_IMEI that I'm not seeing. If I comment out
if (IMEI.get_textBoxControl().value.indexOf(".") > -1) {
alert("Hi!");
the first and second alerts tell me that
IMEI.get_textBoxControl().value = 351937.04.230880.7
and that
IMEI.get_textBoxControl().value.indexOf = 6
all as expected. HOWEVER, if I comment out the two above alert lines and uncomment the IF condition, the line
alert("Hi!");
never runs. If I uncomment all lines, none of the alerts run. The same behavior holds true if I'm in debug mode. If the condition is uncommented, my cursor never gets to my function at all. What the heck?
You have no close bracket for the if(window.onload) condition - is that intentional?
Since you're using jQuery, why are you not just using the standard $(document).ready stuff?
function formatICCID_IMEI() {
var IMEI = $find("<%=cbIMEI.ClientID %>");
alert(IMEI.get_textBoxControl().value);
alert(IMEI.get_textBoxControl().value.indexOf("."));
if (IMEI.get_textBoxControl().value.indexOf(".") > -1) {
alert("Hi!");
}
}
$(document).ready(formatICCID_IMEI);

$(document).ready has stopped working

<script type="text/javascript">
$(document).ready(function() {
alert("test");
document.getElementById("currentemp").onclick = disableThem;
});
function disableThem(){
if (document.getElementById("currentemp").checked) {
document.getElementById("edate_m").disabled = true;
document.getElementById("edate_y").disabled = true;
}
else {
document.getElementById("edate_m").disabled = false;
document.getElementById("edate_y").disabled = false;
}
}
$(function(){
alert("test2");
if (document.getElementById("currentemp").checked) {
document.getElementById("edate_m").disabled = true;
document.getElementById("edate_y").disabled = true;
}
else {
document.getElementById("edate_m").disabled = false;
document.getElementById("edate_y").disabled = false;
}
});
</script>
Hello. This script was working a few weeks ago. Now I noticed it stopped working even though I havent changed it. Usually when my javascript stops working its because I have tons of javascript and sometimes the functions cross over each other. But I've put in alert boxes and it seems it doesnt even load as it should.
Any ideas for debugging?
Put your custom function before document.ready, just in case.
You do not need two ready functions.
Make sure the elements are available in your page and the selectors are valid.
Here is your simplified code:
function disableThem() {
var state = $("#currentemp").is(":checked");
$("#edate_m").attr("disabled", state);
$("#edate_y").attr("disabled", state);
}
$(function() {
disableThem();
$("#currentemp").onclick = disableThem;
});
you example works for me see: http://jsfiddle.net/manuel/KXCM3/
Are you sure that jquery is loaded? Is the following code true?
alert(jQuery !== undefined);

Categories