$(function() {
var previous_page = "<?=$_SESSION["previous_page"]?>";
if (previous_page == "bar_settings")
$.club_settings();
$.club_settings = function() {
$(".bar_settings").fadeIn(1000);
$(".bar_photos").hide();
$(".bar_activities").hide();
$(".bar_campaigns").hide();
$(".etkinlik_ekle").hide();
$(".kampanya_ekle").hide();
}
})(jQuery);
I got an error that is $.club_settings is not a function. How can i call $.club_settings in a if condition ?
You're defining the function after you call it. Switch around the code like so:
$(function() {
$.club_settings = function() {
$(".bar_settings").fadeIn(1000);
$(".bar_photos").hide();
$(".bar_activities").hide();
$(".bar_campaigns").hide();
$(".etkinlik_ekle").hide();
$(".kampanya_ekle").hide();
}
var previous_page = "<?=$_SESSION["previous_page"]?>";
if (previous_page == "bar_settings")
$.club_settings();
})(jQuery);
JavaScript only hoists declarations, not initializations.
The reference above displays how variables are hoisted but it works for functions too.
$(function() {
var previous_page = "<?=$_SESSION["previous_page"]?>";
if (previous_page == "bar_settings")
club_settings();
function club_settings() {
$(".bar_settings").fadeIn(1000);
$(".bar_photos").hide();
$(".bar_activities").hide();
$(".bar_campaigns").hide();
$(".etkinlik_ekle").hide();
$(".kampanya_ekle").hide();
}
})(jQuery);
The drawback would be is that it would be found in your $ variable which may lead to codes elsewhere breaking. But that could be another question.
Trying to resolve this by doing $.club_settings() = function club_settings() { ... will not work unless you reorder your codes as suggested by Mike
Related
Im trying to make my first jquery plugin.. but actually i dont know what im doing wrong here.
$(document.ready(function()
{
var plugin = (function()
{
//this function is not accessible from the outside
function privateFunction()
{
}
//these functions are
return
{
alert1: function()
{
alert('Hallo');
},
alert2: function()
{
alert("hi");
}
}
})()
//but it is not working :/
plugin.alert1();
});
it is not executing one of the alerts. Am i putting some semicolons wrong?
i checked if all were closed
Javascript's automatic semicolon insertion will add a semicolon after return and undefined is returned.
Your code will look like
return;
{...
Replace
return
{
Should be
return {
You're also missing the ) after document in the first line of code.
Demo
$(document).ready(function() {
var plugin = (function() {
//this function is not accessible from the outside
function privateFunction() {
// Code Here
}
//these functions are
return {
alert1: function() {
alert('Hallo');
},
alert2: function() {
alert("hi");
}
};
}());
//but it is not working :/
plugin.alert1();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Hello I have some code in which I take user input through in html and assign it to,two global variables
var spursscoref = document.getElementById("spursscore").value;
var livscoref = document.getElementById("livscore").value;
Which next show up in this addeventlistener function as parameters of the whowon function
var d = document.querySelector("#gut2");
d.addEventListener("click", function () {
whowon(spursscoref, livscoref, spurs, liverpool)
}, false);
The click event is meant to trigger the whowon function and pass in the parameters
function whowon(FirstScore, SecondScore, FirstTeam, SecondTeam) {
if (FirstScore > SecondScore) {
FirstTeam.win();
SecondTeam.lose();
} else if (FirstScore < SecondScore) {
SecondTeam.win();
} else {
FirstTeam.draw();
SecondTeam.draw();
}
}
However the values are null,as I get a cannot read properties of null error on this line
var spursscoref = document.getElementById("spursscore").value;
I am pretty sure the problem is coming from the addlistener function,any help would be appreciated
Well you could do something like this -
$( document ).ready(function() {
var d = document.querySelector("#gut2");
d.addEventListener("click", function () {
var spursscoref = document.getElementById("spursscore").value;
var livscoref = document.getElementById("livscore").value;
whowon(spursscoref, livscoref, spurs, liverpool)
}, false);
});
Wrap your code in $(document).ready(function(){}). This will ensure that all of your DOM elements are loaded prior to executing your Javascript code.
Try putting all of your code inside this
document.addEventListener("DOMContentLoaded", function(event) {
//Your code here
});
My guess is that your code is executed before the html actually finished loading, causing it to return null.
i have the following code. here i am declaring all the element id's to variables as global before all the functions declared. but those variables are taken by the functions
below is the sample:
var ddlpf=document.getElementById('<%=ddlpf.ClientID%>');
var disp_msg=document.getElementById('<%=disp_msg.ClientID%>');
function btn_proceed_Click()
{
var ses='<%=Session("hcur").toString %>';
if(pos_valid()==true)
alert('success');
}
function pos_valid()
{
var pos_valid=false;
var ses;
var ccy;
var ccy1;
var ccy2;
var as11costbud;
ses='<%=Session("hcur").toString %>';
var bm='<%=Session("benchmark").toString %>';
var dtsheet='<%=Session("dtsheet").toString %>';
var ratedis='<%=Session("ratedis").toString %>';
if(ddlpf.selectedIndex <= 0)
{
message("Please select the Portfolio");
return;
}
pos_valid=true;
return pos_valid;
}
function message(msg)
{
disp_msg.innerHTML=msg;
var modalPopupBehaviorCtrl = $find('modalpop');
modalPopupBehaviorCtrl.set_PopupControlID("poppan");
modalPopupBehaviorCtrl.show();
}
If i declare the variable "ddlpf" inside the pos_valid() and "disp_masg" inside the message(), it works.
the code is like this:
function pos_valid()
{
var ddlpf=document.getElementById('<%=ddlpf.ClientID%>');
//code
}
function message()
{
var disp_msg=document.getElementById('<%=disp_msg.ClientID%>');
//code
}
but these id's are common to 5 functions. not only this two. i have 20 id's which are common to 5 big functions. thats why i have declared them outside the functions.
what change should i make?
I am guessing you are putting the script at the top of the HTML page. So the page has not finished loading yet and you are trying to access the document.getElementById even before the document.body is ready. So when you access them in your functions, the variables value will be undefined => your problem
Try it this way,
var ddlpf;
var disp_msg;
window.onload = function(){
ddlpf=document.getElementById('<%=ddlpf.ClientID%>');
disp_msg=document.getElementById('<%=disp_msg.ClientID%>');
}
This way, you can put the code anywhere.
As far as i understood your question and with the code provided you are wondering
why your global variables appear not to work ddlpf and disp_msg is not working inside pos_valid and message functions
You have to make sure that the global variables are declared before any function is using them. Another option would be to pass in the variables.
In my demo on codepen you can see that it works. This html
<h2>Element id is not accessible</h2>
<select id="ddlpf">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<button onclick=btn_proceed_Click()>proceed</button>
<div id="disp_msg">
</div>
and this javascript
var ddlpf=document.getElementById('ddlpf');
var disp_msg=document.getElementById('disp_msg');
function btn_proceed_Click()
{
if(pos_valid()==true)
{
var btn = document.getElementById('btn');
btn.innerHTML='success';
};
}
function pos_valid()
{
var pos_valid=false;
var ses, ccy, ccy1, ccy2, as11costbud;
var selectedIndex = ddlpf.selectedIndex
if(selectedIndex <= 0)
{
message("Please select the Portfolio. Your selection:" + selectedIndex);
return;
}
message("Your selection" + selectedIndex);
pos_valid=true;
return pos_valid;
}
function message(msg)
{
disp_msg.innerHTML=msg;
}
If you provide more information erromessages from chrome dev tools we can help better.
Here's how I'm calling my JS:
"#item.OwnerID#" is a variable from a loop containing an ID. So the element I want to change the CSS for should look like: "cwa123" or some other number for the id...
Here's my JS:
$(document).ready(function() {
function toggleChatControl(id){
var wnd = document.getElementById(id);
if (wnd.style.marginBottom == '-1px') {
wnd.style.marginBottom = '-236px';
} else {
wnd.style.marginBottom = '-1px';
}
}
});
I ain't got a clue, it gives me the "not defined" error...
Out of scope, remove the document ready wrapper
function toggleChatControl(id){
var wnd = document.getElementById(id);
if (wnd.style.marginBottom == '-1px') {
wnd.style.marginBottom = '-236px';
} else {
wnd.style.marginBottom = '-1px';
}
}
Every function creates a new scope, the global scope is window, and that's the scope used for inline javascript.
Inside $(document).ready(function() { ... }); the scope is changed (to document) so the function is out of scope for the inline handler.
An even better approach would be to use a proper event handler
$('.FCChatControl').on('click', function() {
toggleChatControl('cwa#item.OwnerID#');
});
This is a snippet from a puzzle game I'm trying to develop. The problem is it stops working after each() of jquery is called. Please help me figure out the problem. Thanks in advance.
function setTotalInPositionPieces()
{
$("#board").children('div').each(function(index, element) {
if(testInPosition(element))
{
++totalInPositionPieces;
$(element).attr("data-inPositionStatus", '1');
}
});
/* The script does not from here, onward. Please tell
me what is the problem.*/
if(totalInPositionPieces == totalPieces)
{
$("#messageBox").text("Puzzle Solved!");
}
}
totalInPositionPieces and totalPieces are global variables.
you should define the var totalInPositionPieces outside the each function to be reachable in the scope of any other function or outside of it.
same for totalPieces. Where do you define it?
Explore this stuff too: http://api.jquery.com/jQuery.data/
function setTotalInPositionPieces()
{
var list = $("#board").children('div');
var totalInPositionPieces = 0;
$.each(list, function(index, element) {
if(testInPosition(element))
{
++totalInPositionPieces;
$(element).attr("data-inPositionStatus", '1');
}
});
if(totalInPositionPieces == totalPieces)
{
$("#messageBox").text("Puzzle Solved!");
}
}