|
JavaScript - Javascript Array Combination Item & Value
Hi Guys,
i have two different arrays with the same number of element. The 1st array holds the ID's and the 2nd one holds the Items.. i want to use both of them in a Jquery autocomplete plugin.. showing the the 2nd one values but getting the value of the 1st arr. I was wondering if there is a way to combine both in one in Javascript like Arr3 =[arr1, arr2] where i display arr2 elemnt and pass arr1 elements? thanks Similar TutorialsHi Peers, i have a Drop down list with 10 choices (skillset). users must choose one skillset and the corresponding level (beginer/intermediate/master). ( they have to do this 10 times for all the sillsets) what i want is : 1 - i need to show up only one record (dropdowanlist) with level then have a button to add new skill and level if required 2- then when they choose the 1st skill from the dropdown , this one will not show up on the 2nd choice dropdown. is it possible any help ? thanks guys Hi, Well I had lots of scripts so what I did is that I combined all of them into one script file, which contains files like Jquery library too. But now the problem is that it has stopped working, I don't know why did this happen. What I did is that I took every script copied and pasted it and then I gave some space under it by pressing enter a few times and then I used to paste other script, I was told this was the method to combine scripts but now the scripts don't work. Here is the link to combined scripts http://files.cryoffalcon.com/bloghut...NCOMPRESSED.js And the link to a live example is http://bloghutsbeta.blogspot.com/ I created an array, whose entries looks like this: [41, "The bird flew into it's cage"] [33, "He drew fire from Joe"] [33, "Roger asked her her name"] [2, "I am awfully happy"] . I want to pull the sentence item out of some array entries. E.g., in the second entry, namely, arrayName[1], what I thought was the second item (the sentence), I could manage by invoking arrayName[1][1] . But to my dismay, this doesn't do the trick. arrayName[1][1] actually delivers up the second CHARACTER of the entry (the number "3"). I thought the comma between the number and the sentence would separate the items, although I "pushed" each entry into the array as one single entry. How do I "grab" the whole sentence? How do I push both items separately to achieve "one entry"? i have tried searching the forums for help but really am getting no where. i am trying to call an array item from an input box. the input is all numbers. the arrays are v + numbers. i cannot seem to figure out how to get the item from the array. eg Code:
var v00501 = ["HOLTSVILLE,I R S SERVICE CENTER","NY","631","-5","Y"]
var v00544 = ["HOLTSVILLE,IRS SERVICE CENTER","NY","631","-5","Y"]
var v00601 = ["ADJUNTAS,JARD DE ADJUNTAS,URB SAN JOAQUIN","PR","787/939","-4","N"]
function pop() {
var zipv = "v" + myform.Zip.value +"[0]";
alert(zipv);
}
or Code:
function pop() {
alert(pop1());
}
function pop1() {
return "v" + myform.Zip.value +"[0]";
}
so for this if the user typed in 00501 i get v00501[0] no matter what i try. i want HOLTSVILLE,I R S SERVICE CENTER to be returned or whatever item i am calling for. this all has to be on client side as i dont have server access so the zip codes are all set up as arrays in a seperate file. i really dont know alot about javascript but i am learning. any help on how i can accomplish this would be appreciated. Hi there, I would like to do the following: When I click on a button, it will set the item in the listbox to be bold. But this will only happen when the user clicks on the desired item to be bold and presses the button. An alert message will occur when he/she presses the button without clicking on the item, stating that the user will need to click on the item. How shoukld I do it in javascript? I have the following code. I am trying to add an item in the unorderedlist sing javascript when. the new list item is added when the checkbox is checked. And iam trying to remove the corresponding list item when the checkbox is unchecked. Is it possible? Any help from the web gurus will be greatly appretiated. Code: <html>
<head>
<title>Insert title here</title>
<script type="text/javascript" language="JavaScript">
function Addlistitem(list_id) {
var chname = document.getElementById(list_id).name;
if (document.getElementById(list_id).checked == true) {
var element = chname;
var container = document.getElementById('myList');
var new_element = document.createElement('li');
new_element.innerHTML = element;
container.insertBefore(new_element, container.firstChild);
document.getElementById('newElement').value = "";
}
else {
alert("its unchecked");
//need help here to delete the added list item when its corresponding checkbox is unchecked.
}
}
</script>
</head>
<body>
<form name="form1"/>
<input type="checkbox" name="ch1" id="c1" onclick="JavaScript:Addlistitem('c1');"
value="10" />
<input type="checkbox" name="ch2" id="c2" onclick="JavaScript:Addlistitem('c2');"
value="11" />
<input type="checkbox" name="ch3" id="c3" onclick="JavaScript:Addlistitem('c3');"
value="12" />
<input type="checkbox" name="ch4" id="c4" onclick="JavaScript:Addlistitem('c4');"
value="13" />
<input type="checkbox" name="ch5" id="c5" onclick="JavaScript:Addlistitem('c5');"
value="14" />
<input type="checkbox" name="ch6" id="c6" onclick="JavaScript:Addlistitem('c6');"
value="15" />
<input type="checkbox" name="ch7" id="c7" onclick="JavaScript:Addlistitem('c7');"
value="16" />
<ul id="myList">
</ul>
</form>
</body>
</html>
This is my first javascript game and it's pretty much built of code I've gathered over time and cleaned up. Here's a manipulated screenshot of what I'm trying to accomplish. You're an ant and you want those goodies on the map as quickly as possible! click this link to view a bigger manipulated screenshot click this link to view the goodies (items) The ant is the playable character you control by using the arrow keys. Every time you load the page, or click "restart game", three new items will spawn randomly on the level and the time will be reset to 0 seconds. An arrow key must be pressed to start the time counter and the game itself. There are only 5 items so far, cheese, apple, banana, candy and donut. The items are supposed to be collected as quickly as possible, when the last item has been collected (by simply running over it) the game will end, save the time and display a hi-score list. Time limit is 30 seconds, the game will display a classic "GAMER OVER" if the limit is overrided. Problems I'm trying to solve: 1: Fullscreen mode (and make the ant actually STAY on the screen) I want the game level to adapt itself to the computer screen. The game dimensions are 1000x600px at the moment but the ant does not respect the level dimensions. Screenshot: http://i41.tinypic.com/kc1j81.jpg. I have a feeling about that somekind of percental code has to be implented but I've never done this before. (Please note that the size of the ant and the items will remain as they are) 2: Spawning three items randomly on the level I drew 5 items and saved them as 100x100 PNG. Three of these items have to spawn at a random location on the fullscreen level. The LAST item collected must trigger the time counter to stop. The time will later be used on the hi-score list where he/she can type her nickname. This information will be uploaded to a database. 3: 30 second time limit Letting the time counter reach 30 seconds will trigger a "GAME OVER". The only way to try again is page refresh or "restart game". Code: <html>
<head>
<style type="text/css">
div#game {
width:1000px;
height:600px;
position:absolute;
background:#c3c3c3;
}
</style>
<script type='text/javascript'>
// movement vars
var xpos = 100;
var ypos = 100;
var xspeed = 1;
var yspeed =1;
var maxSpeed = 5;
// boundary
var minx = 0;
var miny = 0;
var maxx = 1000; // characters movement field, width
var maxy =600; // characters movement field, height
// controller vars
var upPressed = 0;
var downPressed = 0;
var leftPressed = 0;
var rightPressed = 0;
function slowDownX()
{
if (xspeed > 0)
xspeed = xspeed - 1;
if (xspeed < 0)
xspeed = xspeed + 1;
}
function slowDownY()
{
if (yspeed > 0)
yspeed = yspeed - 1;
if (yspeed < 0)
yspeed = yspeed + 1;
}
function gameLoop()
{
// change position based on speed
xpos = Math.min(Math.max(xpos + xspeed,minx),maxx);
ypos = Math.min(Math.max(ypos + yspeed,miny),maxy);
// or, without boundaries:
// xpos = xpos + xspeed;
// ypos = ypos + yspeed;
// change actual position
document.getElementById('character').style.left = xpos + "px";
document.getElementById('character').style.top = ypos + "px";
// change speed based on keyboard events
if (upPressed == 1)
yspeed = Math.max(yspeed - 1,-1*maxSpeed);
if (downPressed == 1)
yspeed = Math.min(yspeed + 1,1*maxSpeed)
if (rightPressed == 1)
xspeed = Math.min(xspeed + 1,1*maxSpeed);
if (leftPressed == 1)
xspeed = Math.max(xspeed - 1,-1*maxSpeed);
// deceleration
if (upPressed == 0 && downPressed == 0)
slowDownY();
if (leftPressed == 0 && rightPressed == 0)
slowDownX();
// loop
setTimeout("gameLoop()",10);
}
function keyDown(e)
{
var code = e.keyCode ? e.keyCode : e.which;
if (code == 38)
upPressed = 1;
if (code == 40)
downPressed = 1;
if (code == 37)
leftPressed = 1;
if (code == 39)
rightPressed = 1;
}
function keyUp(e)
{
var code = e.keyCode ? e.keyCode : e.which;
if (code == 38)
upPressed = 0;
if (code == 40)
downPressed = 0;
if (code == 37)
leftPressed = 0;
if (code == 39)
rightPressed = 0;
}
</script>
</head>
<body onload="gameLoop()" onkeydown="keyDown(event)" onkeyup="keyUp(event)" bgcolor='gray'>
<!-- level -->
<div id="game"></div>
<!-- ant character -->
<img id='character' src='images/ant.png' style='position:absolute;left:500px;top:500px;height:125px;width:200px;'/>
</body>
</html>
I am very new to javascript. At least when it comes to writing scripts. The only thing I'm trying to do with the following script is make it so when you click on the right numbers of the image it will take you to a new page. If you click the wrong numbers it will forward you to an error page explaining that the code/numbers you clicked on were wrong. The code of numbers is four numbers long. When I try the correct numbers or the incorrect numbers nothing happens either way. I'm not sure why. Code: <html><head><title>Untitled</title>
<script type="text/javascript">
var combination;
var comboAnswer = "7256";
combination = "";
function keycode(n) {
if (combination.length < (opener.top.comboAnswer.length - 1)) {
combination = combination + n;
}
else {
combination = combination + n;
checkCode();
}
}
function checkCode() {
if (combination == opener.top.comboAnswer) {
window.location.href = "disarmed.html";
}
else {
window.location.href = "armed.html";
}
}
</script>
<body bgcolor="#000000">
<center>
<div style="text-align:center; width:527px; margin-left:auto; margin-right:auto;">
<img id="combination" src="image.png" usemap="#combination" border="0" alt="" />
<map id="_combination" name="combination">
<area shape="rect" coords="255,184,288,210" href="javascript:keycode(1)" alt="" title="" />
<area shape="rect" coords="288,184,321,210" href="javascript:keycode(2)" alt="" title="" />
<area shape="rect" coords="321,184,354,210" href="javascript:keycode(3)" alt="" title="" />
<area shape="rect" coords="255,213,288,239" href="javascript:keycode(4)" alt="" title="" />
<area shape="rect" coords="288,213,321,239" href="javascript:keycode(5)" alt="" title="" />
<area shape="rect" coords="320,213,353,239" href="javascript:keycode(6)" alt="" title="" />
<area shape="rect" coords="256,240,289,266" href="javascript:keycode(7)" alt="" title="" />
<area shape="rect" coords="288,240,321,266" href="javascript:keycode(8)" alt="" title="" />
<area shape="rect" coords="320,240,353,266" href="javascript:keycode(9)" alt="" title="" />
<area shape="rect" coords="288,265,321,291" href="javascript:keycode(0)" alt="" title="" />
<area shape="default" nohref>
</map>
</div>
</center>
</body></html>
Hi All Not sure if this is the right place to post but could do with some help. Scenario: 1 Box holds 3 items, Complete box weighs 75g, each item 25g, customer chooses their own 3 combo items. This could be the same all the same item or 3 different items. I need a script that will require the selections to make up 75g in order to continue the process. i.e customer can only continue when 3 items / 75g worth are selected. Here is a short version, I have about 12 selectors at the moment and possible more will be created (if that matters). Code: <form name="cart_quantity" action="myProduct?action=add_product" method="post" enctype="multipart/form-data">
<
<div class="placeholder">
<img src="" alt="Image Placeholder" />
</div>
<label class="attribsSelect" for="attrib-6">Hard Boiled 1</label><br />
<select name="id[6]" id="attrib-6">
<option value="">Select Portion</option>
<option value="24">25g</option>
<option value="25">50g</option>
<option value="26">75g</option>
</select>
<div class="placeholder">
<img src="" alt="Image Placeholder" />
</div>
<label class="attribsSelect" for="attrib-7">Hard Boiled 2</label><br />
<select name="id[7]" id="attrib-7">
<option value="">Select Portion</option>
<option value="27">25g</option>
<option value="28">50g</option>
<option value="29">75g</option>
</select>
<div class="placeholder">
<img src="" alt="Image Placeholder" />
</div>
<label class="attribsSelect" for="attrib-8">Hard Boiled 3</label><br />
<select name="id[8]" id="attrib-8">
<option value="">Select Portion</option>
<option value="30">25g</option>
<option value="31">50g</option>
<option value="32">75g</option>
</select>
<div class="placeholder">
<img src="" alt="Image Placeholder" />
</div>
<label class="attribsSelect" for="attrib-9">Hard Boiled 4</label><br />
<select name="id[9]" id="attrib-9">
<option value="">Select Portion</option>
<option value="33">25g</option>
<option value="34">50g</option>
<option value="35">75g</option>
</select>
</form>
The section of the form is just the portion with selctors, there are other fields with radio buttons for color choice etc. I have searched for something like this all over but cant find it. Please please please could some genius out there help. Thanks in advance I am working on a page where the user will select a location from a dynamically generated dropdown list. I was able to create the php multidimensional array (tested and working) from a MySql database using the users information at login, but I'm having problems converting it to a javascript multidimensional array. I need to be able to access variables that I can pass to a number of text fields within an html form. For instance, if a user belongs to a company with multiple addresses, I need to be able to let them select the address they need to prepopulate specific text fields. php array creation: Code: if ($row_locations)
{
while ($row_locations = mysql_fetch_assoc($locations))
{
$mail[$row_locations['comp_id']]=array('mailto'=>$row_locations['mailto'], 'madd'=>$row_locations['madd'], 'madd2'=>$row_locations['madd2'], 'mcity'=>$row_locations['mcity'], 'mstate'=>$row_locations['mstate'], 'mzip'=>$row_locations['mzip'], 'billto'=>$row_locations['billto'], 'badd'=>$row_locations['badd'], 'badd2'=>$row_locations['badd2'], 'bcity'=>$row_locations['bcity'], 'bstate'=>$row_locations['bstate'], 'bzip'=>$row_locations['bzip']);
}
}
javascript function - this should create the array and send variables to text fields. Code: function updateAddress() {
var mail = $.parseJSON(<?php print json_encode(json_encode($mail)); ?>);
{
if (comp_id in mail) {
document.getElementById('mailto').value=mail.comp_id.mailto.value;
document.getElementById('madd').value=mail.comp_id.madd.value;
document.getElementById('madd2').value=mail.comp_id.madd2.value;
document.getElementById('mcity').value=mail.comp_id.mcity.value;
document.getElementById('mstate').value=mail.comp_id.mstate.value;
document.getElementById('mzip').value=mail.comp_id.mzip.value;
} else {
document.getElementById('mailto').value='';
document.getElementById('madd').value='';
document.getElementById('madd2').value='';
document.getElementById('mcity').value='';
document.getElementById('mstate').value='';
document.getElementById('mzip').value='';
}
}
}
Where is this breaking? Thanks in advance. Hi, Here is a working code to copy 2d php array to 2d javascript array. Code: <html>
<head>
<?php
for($i = 0; $i < 3; $i++)
{
for($j = 0; $j < 2; $j++)
{$quest[$i][$j] = $i*10+$j;}
}
?>
<script type="text/javascript">
var questions = new Array(3);
for (var i = 0; i < 3; i++)
{
questions[i] = new Array(2);
}
questions[0] = ["<?php echo join("\", \"", $quest[0]); ?>"];
questions[1] = ["<?php echo join("\", \"", $quest[1]); ?>"];
questions[2] = ["<?php echo join("\", \"", $quest[2]); ?>"];
document.write(questions[0][0] + "<br />");
document.write(questions[0][1] + "<br />");
document.write(questions[1][0] + "<br />");
document.write(questions[1][1] + "<br />");
document.write(questions[2][0] + "<br />");
document.write(questions[2][1] + "<br />");
</script>
</head>
</html>
Now,here's the thing.Notice these lines in the code questions[0] = ["<?php echo join("\", \"", $quest[0]); ?>"]; questions[1] = ["<?php echo join("\", \"", $quest[1]); ?>"]; questions[2] = ["<?php echo join("\", \"", $quest[2]); ?>"]; I would like to put these lines in a loop,something like for (var i = 0; i < 3; i++) { questions[i] = ["<?php echo join("\", \"", $quest[i]); ?>"]; } But even after a lot of efforts I am unable to do so,what am I doing wrong?Thanks Hi, In a nutshell,can anyone tell me how to copy a 2d (two dimensional ,2 dimensional) php array to 2d javascript array?I would be obliged if anyone can provide me a method of doing that OR I have written a code to copy a 2d php array to a 2d javascript array.It is working but there is one problem(please see the following).Can anyone tell me what I am doing wrong here? The 2d php array is $quest[100][6] and the 2d javascript array is questions[100][6] . I have written the javascript code inside the <?php....?> itself using echo "<script language="javascript" type="text/javascript">.......</script>; Now ,inside the javascript,when I try to copy the 2d php array to the 2d javascript array using the following method it works questions[0]= ["<?php echo join("\", \"", $quest[0]); ?>"]; questions[1]= ["<?php echo join("\", \"", $quest[1]); ?>"]; ... and so on However, if I try to do the same using the following method it does not work for (var i= 0; i <= 99; i++) { questions[i]= ["<?php echo join("\", \"", $quest[i]); ?>"]; } Why is that?What mistake am I making?Any help will be deeply appreciated.Thanks -----------------------------THE CODE------------------------------------ <?php Access database and store result of mysq_query in $result....... $result = mysql_query($query); for ( $count = 0; $count <= 99; $count++) { $quest[$count]=mysql_fetch_array($result,MYSQL_NUM);; } echo "<script language="javascript" type="text/javascript"> var questions = new Array(100); for (var i = 0; i <100; i++) { questions[i] = new Array(6); } /*The following method of copying 2d php array to 2d javascript array is not working for ( var i = 0; i <= 99; i++) { questions[i]= ["<?php echo join("\", \"", $quest[i]); ?>"]; } */ /*The following method ,however,is working*/ questions[0]= ["<?php echo join("\", \"", $quest[0]); ?>"]; questions[1] = ["<?php echo join("\", \"",$quest[1]); ?>"]; questions[2] = ["<?php echo join("\", \"",$quest[2]); ?>"]; ....and so on </script>"; mysql_close($db_server); ?> Hi, i can't find the mistake in my little script hope someone can help me. PHP Code: <?php /* -------------------- read thumbfolder -------------------- */ function isRdyPfD($filename){ if ($filename == '.' || $filename == '..') { // To-Top-Dir return false; } $ext = explode(".",$filename); $ext = $ext[sizeof($ext) - 1]; $allowedformats = array ( 'jpg', 'png', 'jpeg', 'gif' ); return in_array($ext,$allowedformats); } function getPicsfromDir($dir){ /* array with names of the pictures in $dir */ if (is_dir($dir)) { if ($dh = opendir($dir)) { $filearray = array(); while (($file = readdir($dh)) !== false) { if (isRdyPfD($file) === true) { $filearray[] = $file; } } closedir($dh); return $filearray; } } else { return false; } } // End Function $thumbs = getPicsfromDir("./images/thumbs/"); /* -------------------- thumbfolder -------------------- */ echo "<div id='thumbslider'>\n"; echo "<ul id='thumbs'>\n"; for($i = 0; $i < count($thumbs); $i++){ echo "<li><img src=\"./images/thumbs/$thumbs[$i]\" onclick=\"thumbClick($i)\" /></li>\n"; } echo "</ul>\n"; echo "</div>\n"; /* -------------------- big size images folder -------------------- */ $bigSizeImages = getPicsfromDir("./images/"); //print_r($bigSizeImages); $jsValue = ''; for ($j=0; $j < count($bigSizeImages); $j++){ $jsValue = $jsValue . $bigSizeImages[$j]; if ($j < (count($bigSizeImages)-1)) { $jsValue = $jsValue . ","; } } ?> <script type="text/javascript"> images = new Array(<?php echo $jsValue ?>); function thumbClick(pos){ //alert(pos); alert(images[pos]); } </script> I can't trace the images array values? thanks for a feedback!!! Hello I'm have some javascript objects with arrays that should be transferred as php array. Its posted by ajax httpRequest. How can I return php array, from the javascript? JS Code: ['asd1', 'asd2', 'asd3'] via Ajax => PHP PHP Code: array('asd1', 'asd2', 'asd3'); Hi guys, I am new to JavaScript and was wonder how I would go about creating a form to allow the user to enter various words, one at a time. These words are added to an array and displayed in the page using the textarea form element. Each time a new word is entered, it is added to the array, and then the array is sorted in alphabetical order before the words in the array are displayed in the textarea, one per line. I have tried lots and lots of different methods to accomplish this, and I can get it half working when I use the alert function, but I need this to display on the page in a textarea rather than in an alert box, I tried to get it to write to the page using a document.write function, but like I said i am new to JavaScript and unfortunately cant get any of it working. Code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JavaScript Page One</title>
</head>
<BODY>
<CENTER>
<FORM name="history">
<INPUT name="command" type="text" value="">
<INPUT type="button" value="Add to List" onclick="f_store(document.history.command.value)">
<INPUT name="history" type="button" value="Show List" onclick="f_print()">
</FORM>
<P>
<SCRIPT language="JavaScript">
function MakeArray( n ) {
if( n <= 0 ) {
this.length = 0;
return this;
}
this.length = n;
for( var i = 1; i <= n; i++ ) {
this[ i ] = 0;
}
return this;
}
var history = new MakeArray( 15 );
var index = 0;
var cmmnd = 1;
function f_store( sTR ) {
var i;
if( index >= history.length ) {
for( i = 1; i < history.length; i++ )
history[i-1] = history[i];
index = history.length - 1;
}
history[ index ] = cmmnd + ":" + sTR;
++cmmnd;
++index;
document.history.command.value="";
}
function f_print() {
var allCmmnds, i;
allCmmnds = "";
for( i = 0; i < index; i++ )
allCmmnds += history[i] + "\n";
alert( allCmmnds );
}
</SCRIPT>
</body>
</html>
If someone could please help me by posting some relevant code that would accomplish this, I would greatly appreciate it, as so far I have been scratching my head for a few hours. Thanks, ~Savage Hello hello, I have a javascript array to load a different picture each time a page loads up. The code is as follows: <script type="text/javascript"> var imageArray = new Array(); imageArray[0] = "images/animation9.gif"; imageArray[1] = "images/Title2.gif"; imageArray[2] = "images/animation4.gif"; function doIt() { var rand = Math.floor(Math.random()*3); var imgPath = "<img src='"+imageArray[rand]+"' alt='Welcome' border='0' align='absmiddle' />"; document.getElementById("image").innerHTML = imgPath; } </script> So...it works fine with .gifs, but how would I get it to work with .swf movies too? I've tried just putting the .swf in there e.g. ... 'imageArray[2] = "images/animation6.swf"; But that doesn't seem to work. Any ideas? Thank-you SO much in advance. PLEASE help me with this I have no hair left! Thanks a million, RHonda <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> #container { background-color:#FFFF99; width:90%; } #header { background-color: #FFFF99; } #topNav { background-color: #FFFF99; } #content { background-color: #FFFF99; width:70%; float:left; } #displayCart { background-color:#9CC; width:28%; float:right; } #footer { background-color: #FFFF99; clear:both; } </style> </head> <body> <div id="container"> <div id="header"> <h2 align="center">WDV221 Project 11 </h2> <h2 align="center">Arrays Part 3</h2> </div> <div id="topNav"> <div align="center"> <table width="80%" border="0"> <tr> <td>Home</td> <td>Products</td> <td>Services</td> <td>About</td> </tr> </table> </div> </div> <div id="content"> <div align="center"> <h3>Available Product Selection </h3> <table width="80%" border="0"> <tr> <td><div align="center">Pencils</div></td> <td><div align="center">Pens</div></td> <td><div align="center">Scissors</div></td> <td><div align="center">Markers</div></td> <td><div align="center">Stapler</div></td> <td><div align="center">Coffee Cup</div></td> </tr> <tr> <td><div align="center">$.45</div></td> <td><div align="center">$1.19</div></td> <td><div align="center">$8.95</div></td> <td><div align="center">$4.88</div></td> <td><div align="center">$12.97</div></td> <td><div align="center">$3.00</div></td> </tr> <tr> <td><div align="center"> <input name="" type="button" value="Add to Cart" /> </div></td> <td><div align="center"> <input name="" type="button" value="Add to Cart" /> </div></td> <td><div align="center"> <input name="" type="button" value="Add to Cart" /> </div></td> <td><div align="center"> <input name="" type="button" value="Add to Cart" /> </div></td> <td><div align="center"> <input name="" type="button" value="Add to Cart" /> </div></td> <td><div align="center"> <input name="" type="button" value="Add to Cart" /> </div></td> </tr> </table> <p><input name="" type="button" value="Display Cart" /></p> <p><input name="" type="button" value="Remove Item From Cart" /></p> </div> <h2>Instructions</h2> <p> This project will build a Javascript base shopping cart. The scripts will add product and price to a pair of parallel arrays. It will allow the user to view the shopping cart elements, shopping cart totals and remove elements from the shopping cart. </p> <p>For purposes of this exercise we will limit the shopping cart to a maximum of 5 items. Once it has reached five items the Add a Product function will no longer allow you to add products. </p> <ol> <li>Create two parallel arrays called productName productPrice. The arrays<br /> should only allow for five rows. <br /> <br /> </li> <li>Build a function that will add the product name and product price to a row in their respective arrays. This function will activate on the Add to Cart buttons.<br /> <br /> <strong>Note</strong>: This is a great opportunity to make this a generic function and pass the product name and price into the function as parameters. The<br /> function would use the two parameters to lookup the product and<br /> place the price in the corresponding row.<br /> <strong>example</strong>: onclick="addToCart("<em>product</em>",<em>price</em>)<br /> <br /> <strong>HINT</strong>: Keeping track of the rows is best done with a global variable. <br /> <strong>Note</strong>: Duplicate rows are allowed. <br /> <strong>Example</strong>: productName[0] and productName[2] could both contain<br /> Stapler. <br /> </li> <li>Build a function to display the arrays in the Shopping Cart area. This will run when the Display Cart button is clicked. It will also provide a total of the product prices. The total should be formatted as currency.<br /> <strong>Hint</strong>: Use <p> and .innerHTML to build an area to display and clear</li> <li>Build a function that will remove a product from the arrays. It will ask the user for the product name. The name should not be case sensitive. Remove the product and the corresponding price.</li> <li>Build a function that will remove all the products and corresponding prices from the arrays. This will run when the Clear Cart button is clicked.</li> </ol> </div> <div id="displayCart"> <h4 align="center">Shopping Cart</h4> <h4 align="center">List of Products</h4> <p align="center"><input name="" type="button" value="Clear Cart" /></p> <p>Today is: Month/dd/yyyy</p> </div> <div id="footer">Place today's date he (Day, Month date, year) ex: Monday January 1, 2012</div> </div> </body> </html> Hi, Can anyone help me with this question? I have a JavaScript page to place a track to a google maps. I want the array of points to be shown to come from PHP. However, there are (probably a lot) of errors in it that makes it doesn't work. My main page code: xmlhttpT=new XMLHttpRequest(); //var MyRouteC = ""; xmlhttpT.open("GET","getRoute.php",true); //var MyRouteC= (array)xmlhttpT.responseText; var MyRouteC = (array)xmlhttpT.responseText); xmlhttpT.onreadystatechange=function() { if (xmlhttpT.readyState==4) { //MyRouteC = xmlhttpT.responseText; alert(xmlhttpT.responseText); } } xmlhttp.send(); var MyRoute = new google.maps.Polyline({ path: MyRouteC, strokeColor: "#FF0000", strokeOpacity: 1.0, strokeWeight: 2 }); MyRoute.setMap(map); The page it is calling is a php page: PHP Code: <?php $con = mysql_connect("xxxxx.mysql","xxxxxxxxxxx","xxxxxxxxx"); if (!$con) { die('Could not connect: ' . mysql_error()); } mysql_select_db("letsmeet_mobi", $con); $query = "SELECT * FROM CurrentLocation ORDER BY time DESC LIMIT 0 , 5"; mysql_query($query); $result = mysql_query($query); while($row = mysql_fetch_array($result)) { $output = $output . " new google.maps.LatLng(".$row['gpslat'].", ".$row['gpslong']."), "; } echo $output; mysql_close($con); ?> The php data connection works fine, and it results in a string that looks exactly like the way I want the value to be passed to the JavaScript. Any help is welcome! Hi All, I'd be truly grateful if anyone can help me (a not so good JavaScripter). I'm trying to adapt some code. I have 3 chained select boxes which when the third is selected, I'd like to display specific info from the array within the HTML via the 'info' div. It works, but displays the whole array entry, and I'd just like to pick certain info from that entry. You can see my efforts within the 'categories["Nonfiction"]' entry - I've added the extra array elements to add another dimension to the array, but I think I've got into a muddle - can anyone help? So... when a user selects BOOKS > NONFICTION > COOKBOOKS I'd like just the 'Extra info 01' & 'Extra info 02' text to appear within the 'info' div. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Interdependent Select Menus</title>
<script type="text/javascript">
var categories = [];
categories["startList"] = ["Books", "Clothes"];
categories["Books"] = ["Biography","Fiction","Nonfiction"];
categories["Biography"] = ["Contemporay","Historical","Other"];
categories["Fiction"] = ["Science Fiction","Romance", "Thrillers", "Crime"];
categories["Nonfiction"] = [["How-To", "Extra info 01", "Extra info 02"],
["Cookbooks", "Extra info 01", "Extra info 02"],
["Travel", "Extra info 01", "Extra info 02"]
];
categories["Clothes"] = ["Men","Women","Children"];
categories["Men"] = ["Shirts","Ties","Belts","Hats"];
categories["Women"] = ["Blouses","Skirts","Scarves", "Hats"];
categories["Children"] = ["Shorts", "Socks", "Coats", "Nightwear"];
var nLists = 3; // number of select lists in the set
function fillSelect(currCat,currList){
var step = Number(currList.name.replace(/\D/g,""));
for (i=step; i<nLists+1; i++) {
document.forms['tripleplay']['List'+i].length = 1;
document.forms['tripleplay']['List'+i].selectedIndex = 0;
}
var nCat = categories[currCat];
for (each in nCat) {
var nOption = document.createElement('option');
var nData = document.createTextNode(nCat[each]);
nOption.setAttribute('value',nCat[each]);
nOption.appendChild(nData);
currList.appendChild(nOption);
}
}
function getValue(L3, L2, L1) {
document.getElementById("info").innerHTML = L1 + "\n" + L2 + "\n" + L3;
}
function init() {
fillSelect('startList',document.forms['tripleplay']['List1'])
}
navigator.appName == "Microsoft Internet Explorer" ? attachEvent('onload', init, false) : addEventListener('load', init, false);
</script>
</head>
<body>
<form name="tripleplay" action="">
<select name='List1' onchange="fillSelect(this.value,this.form['List2'])">
<option selected>Make a selection</option>
</select>
<br />
<select name='List2' onchange="fillSelect(this.value,this.form['List3'])">
<option selected>Make a selection</option>
</select>
<br />
<select name='List3' onchange="getValue(this.value, this.form['List2'].value, this.form['List1'].value)">
<option selected >Make a selection</option>
</select>
<div id="info">This is the default text</div>
</form>
</body>
</html>
Hello all, There's this javascript array on an html page, with some gifs in it. How can I include swfs in this array? Here's the code: <script type="text/javascript"> var imageArray = new Array(); imageArray[0] = "images/animation9.gif"; imageArray[1] = "images/Title2.gif"; imageArray[2] = "images/animation4.gif"; function doIt() { var rand = Math.floor(Math.random()*3); var imgPath = "<img src='"+imageArray[rand]+"' alt='Welcome to Kabeoke' border='0' align='absmiddle' />"; document.getElementById("image").innerHTML = imgPath; } </script> Thank-you SO much in advance |
|||||||