|
JavaScript - Square Brackets - What For? [0]
What is the [0] for? And even better if you can tell me what they're called, in this context; I want to find a tutorial.
Tryit Editor v2.1 PHP Code: var a=document.getElementsByTagName("a")[0]; Thanks! Similar TutorialsAll, I have the following code: Code: function createSquare(event) {
var x = parseInt(event.clientX);
var y = parseInt(event.clientY);
var left = x - 50;
var top = y - 50;
var d = document;
var div = event.target.parentNode.lastChild;
//alert(div.nodeType)
if (div.nodeType != 1)
div = d.createElement('div');
div.style.width = "100px";
div.style.height = "100px";
div.style.position = "absolute";
div.style.left = left + "px";
div.style.top = top + "px";
div.style.zIndex = 5;
div.style.border = "10pt solid black";
var leftbox = x - 80;
alert(x);
alert(leftbox);
divselect = d.createElement('select');
divselect.style.position = "absolute";
divselect.style.top = top + "px";
divselect.style.left = leftbox + "px";
var sel = d.getElementById('tagged_person');
sel.style.display = 'block' //or block if you have a hidden div
var tagged_user = d.tag.tagged_person;
tagged_user = tagged_user.value;
var picture_id = d.tag.picture_id;
picture_id = picture_id.value;
divselect.appendChild(sel);
event.target.parentNode.appendChild(div);
event.target.parentNode.appendChild(divselect);
This shows me a square and a select but the select isn't populated with anything. i do have a form later on down the page. The form code is (which I try and pull in the info from the select in the form in the select in the createSqua PHP Code: <form action="" name="tag" method="post"> <input type="hidden" name="picture_id" value="4"> <select name="tagged_person" id="tagged_person"> <?php $qryfav = "Select * from favorites where user_name='creep'"; $resultfav = mysql_query($qryfav); while($resultsetfav = mysql_fetch_array($resultfav)){ echo "<option value=\"$resultsetfav[favorite_user]\">$resultsetfav[favorite_user]</option>"; } ?> </select> </form> Thanks for the help in advance. Hello wise javascript programers I come to you for help with some programming assignment Im not quite getting the assignment it self is based on the use of the getElementsByClassName() method. Basically I have a 3x3 table with some outer cells that at this point dont do much. there is a loop that iterates through all the inner cells checking for errors. inside the cells, are input boxes. the loop checks to see if the inner cells are empty, contain a non-numeric value, or a zero. if any of this instances is true, a message is displayed explaining the situation. those cells that DON'T have a number will be colored in yellow indicating that numbers should go in there. I got as far as testing all the conditions and generating the appropriate messages, I wrote additional code that supposedly colors the cells that have other than a number in but the code does not execute this is the code if you would like to take a peek at it and help a newbe out. thanks Code: <html>
<head>
<title>Magic Square</title>
<script type="text/javascript">
function checkit()
{
var j;
var inputelement = document.getElementsByClassName("inner");
var colorcells = document.getElementsByClassName("in");
for(j=0;j<inputelement.length;j++)
{
if(inputelement[j].value=="")
{
alert(" you must enter a number cells cannot be empty");
for(r=0;r<colorcells.lenght;r++)
{
colorcells[r].style.backgroundColor="yellow";
return false;
}
}
else if (isNaN(inputelement[j].value))
{
alert(" you must enter a number cells cannot be a letter");
for(r=0;r<colorcells.lenght;r++)
{
colorcells[r].style.backgroundColor="yellow";
return false;
}
}
else if(inputelement[j].value <= 0)
{
alert(" you must enter a number cells cannot be zero");
for(r=0;r<colorcells.lenght;r++)
{
colorcells[r].style.backgroundColor="yellow";
return false;
}
} //end else if
} //end first for loop
} //end function
</script>
</head>
<body>
<table align="center">
<tr><td></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td><input type="text" size="1" maxlength="1" readonly class="outer" /></td></tr>
<tr><td></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td class><input type="text" size="1" maxlength="1" readonly class="outer" /></td></tr>
<tr><td></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td><input type="text" size="1" maxlength="1" readonly class="outer" /></td></tr>
<tr><td></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td class="in"><input type="text" size="1" maxlength="1" class="inner" /></td><td><input type="text" size="1" maxlength="1" readonly class="outer" /></td></tr>
<tr><td><input type="text" size="1" maxlength="1" readonly class="outer" /></td><td><input type="text" size="1" maxlength="1" readonly class="outer" /></td><td><input type="text" size="1" maxlength="1" readonly class="outer" /></td><td><input type="text" size="1" maxlength="1" readonly class="outer" /></td><td><input type="text" size="1" maxlength="1" readonly class="outer"/></td></tr>
<tr><td colspan="5"><input type="button" value="Check The Magic Square" onclick="checkit()" /></td></tr>
<tr><td colspan="5"><input type="button" value="Clear The Magic Square" onclick="clearit()" /></td></tr>
</table>
</body>
</html>
I know very little about javascript, but was wondering if something like this can be done? Would it be possible (with mootools or jquery) to have homepage that will rotate its home page content forwards and backwards based on either triangle or square? ie, you can rotate through 3, 4, etch home pages? Sort of like a slider, but it rotates off a center axis of the triangle or square? Hey, hoping someone can help. As this is my first post and I have a very very very small understanding of Javascript you have permission to mock me! Anyway, here goes... I am using a third party shopping cart system. One of the dropdown menus uses an array as the 'name'. <select name="product[]"> I'm pretty sure it has to stay this way or the cart won't work. I have a function which runs to make sure it can't be left on the first option when submitted, however it won't work with the 'name' containing square brackets! function validate_form_acflgotmt ( ) { valid = true; if ( document.acftshirt.product[].selectedIndex == 0 ) { alert ( "Neigh! Whoa boy, don't forget to choose a t-shirt size!" ); valid = false; } return valid; } If anyone can help please do and I will shed a single tear of joy. Thanks! Jake Code: <form>
<input type="button" value="Click!" id="001" />
</form>
function one() {
window.alert('Hello');
window.alert('World!');
}
var varname=document.getElementById("001");
varname.onclick=one;
I am not sure if the last line is this example is correct. Should it not be: varname.onclick=one(); Or is it ok to write it either way? Thanks. With March madness right around the corner I am hoping to go paper less on my office pool. I have created a simple NFL pick sheet in html in the past but this is a bit out of my league as far as advancing teams as you pick them. I have found a thread here that has helped a me a bunch. I am not familer with java or how values work. My problem at this point is (having used a script from another thread here) http://www.codingforums.com/showthre...425#post895425 What are the values I change when I move to a new region? as well as keep moving the selected team to the final four and so on. Here is what I have Code: <html>
<head>
<style>
* { font-family: arial; font-size: 12px; }
th { border: red 3px; background-color: red; color: black; font-size: 16px; }
.team { border: red 2px; background-color: white; width: 120px; height: 24px; }
.team2 { border: black 2px; background-color: wheat; width: 120px; height: 24px; }
.team3 { border: black 2px; background-color: pink; width: 120px; height: 24px; }
</style>
Head I understand, the scripting I am thinking is what I need to change for each region YES/NO
<script>
function win(winner)
{
var team = winner.value;
var levels = winner.name.substring(3).split("_");
var curlevel = parseInt(levels[0]);
var curgame = parseInt(levels[1]);
var nextlevel = curlevel + 1;
var nextgame = Math.floor( (curgame+1) / 2 );
var curteam = winner.form.elements["WIN"+nextlevel+"_"+nextgame].value;
var winnerButton = winner.form.elements["WIN"+nextlevel+"_"+nextgame];
if ( winnerButton == null ) return;
++nextlevel;
nextgame = Math.floor( (nextgame+1) / 2 );
var nextButton = winner.form.elements["WIN"+nextlevel+"_"+nextgame];
var forward = ( nextButton != null && nextButton.value == winnerButton.value );
winnerButton.value = team;
while ( forward ) {
nextButton.value = " ";
++nextlevel;
nextgame = Math.floor( (nextgame+1) / 2 );
nextButton = winner.form.elements["WIN"+nextlevel+"_"+nextgame];
forward = ( nextButton != null && nextButton.value == curteam );
}
}
</script>
</head>
<body>
<form>
<table border=0 cellpadding=0>
<tr>
<th colspan=4 style="font-size: x-large;">West Region</th>
<th colspan=3 style="font-size: x-large;">Final Four</th>
</tr>
<tr>
<th colspan=2>Sub-Regional </th>
<th colspan=2 style="background-color: wheat;">Regional Final</th>
</tr>
td = the tables or boxes through out the brackets, but what or how do you establish the name = "WIN0_1? these numbers change for each bracket and I am not sure how there figured?
<tr>
<td><input type=button class="team" name="WIN0_1" onclick="win(this)" value="#1 Seed"></td>
</tr>
<tr>
<td></td>
<td><input type=button class="team" name="WIN1_1" onclick="win(this)" value=""></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_2" onclick="win(this)" value="#16 Seed"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td><input type=button class="team2" name="WIN2_1" onclick="win(this)" value=""></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_3" onclick="win(this)" value="#8 Seed"></td>
</tr>
<tr>
<td></td>
<td><input type=button class="team" name="WIN1_2" onclick="win(this)" value=""></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_4" onclick="win(this)" value="#9 Seed"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td><input type=button class="team2" name="WIN3_1" onclick="win(this)" value=""></td>
</tr>
<tr>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_5" onclick="win(this)" value="#4 Seed"></td>
</tr>
<tr>
<td></td>
<td><input type=button class="team" name="WIN1_3" onclick="win(this)" value=""></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_6" onclick="win(this)" value="#13 Seed"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td><input type=button class="team2" name="WIN2_2" onclick="win(this)" value=""></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_7" onclick="win(this)" value="#5 Seed"></td>
</tr>
<tr>
<td></td>
<td><input type=button class="team" name="WIN1_4" onclick="win(this)" value=""></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_8" onclick="win(this)" value="#12 Seed"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td><input type=button class="team3" name="WIN4_1" onclick="win(this)" value=""></td>
</tr>
<tr>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_9" onclick="win(this)" value="#3 Seed" ></td>
</tr>
<tr>
<td></td>
<td><input type=button class="team" name="WIN1_5" onclick="win(this)" value="" ></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_10" onclick="win(this)" value="#14 Seed" ></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td><input type=button class="team2" name="WIN2_3" onclick="win(this)" value="" ></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_11" onclick="win(this)" value="#6 Seed" ></td>
</tr>
<tr>
<td></td>
<td><input type=button class="team" name="WIN1_6" onclick="win(this)" value="" ></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_12" onclick="win(this)" value="#11 Seed" ></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td><input type=button class="team2" name="WIN3_2" onclick="win(this)" value="" ></td>
</tr>
<tr>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_13" onclick="win(this)" value="#2 Seed" ></td>
</tr>
<tr>
<td></td>
<td><input type=button class="team" name="WIN1_7" onclick="win(this)" value="" ></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_14" onclick="win(this)" value="#15 Seed" ></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td><input type=button class="team2" name="WIN2_4" onclick="win(this)" value="" ></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_15" onclick="win(this)" value="#7 Seed" ></td>
</tr>
<tr>
<td></td>
<td><input type=button class="team" name="WIN1_8" onclick="win(this)" value="" ></td>
</tr>
<tr>
<td><input type=button class="team" name="WIN0_16" onclick="win(this)" value="#10 Seed" ></td>
</tr>
<tr>
<td colspan=8>and the other 3 regions...each with a regional winner</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td><input type=button class="team3" name="WIN5_1" onclick="win(this)" value=""></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td><input type=button class="team3" name="WIN4_2" onclick="win(this)" value="region #2 winner"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td colspan=2 style="font-size: 20px; text-align: right;">CHAMPION: </td>
<td><input type=button class="team"
style="width: 160px; font-size: 20px; background-color: orange; height: 32px;"
name="WIN6_1" onclick="win(this)" value=""></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td><input type=button class="team3" name="WIN4_3" onclick="win(this)" value="region #3 winner"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td><input type=button class="team3" name="WIN5_2" onclick="win(this)" value=""></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td><input type=button class="team3" name="WIN4_4" onclick="win(this)" value="region #4 winner"></td>
</tr>
</table>
</form>
</body>
...Help me Obi-Wan Kenobi your my only hope... |
|||||||