Jump to content

Javascript problem

praveendivekar's Photo
Posted Oct 08 2012 11:12 PM
2984 Views

<!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=iso-8859-1" />
<title>multiple selections</title>
<style type="text/css">
.wrapper
{
width:760px;
height:500px;
margin:0 auto;
background-color: #999999
}
.multiple
{

margin:0 auto;
color:#FFFFFF;
float:left;


}
h3
{
color:#FFFFFF;
}
</style>
<script src="jqueary.js"></script>
<script type="text/javascript">
$(document).ready(function(){

$("#phonefeatures").click(function () {
var optionarray= new Array();
optionarray.push ($('#phonefeatures').val())
$(".wrapper").click(function(){

for(var i=0; i<optionarray.length();i++)
{
alert(optionarray[i].val());
}


alert({id:$('#phonefeatures').val()});

});

});
});

</script>
</head>

<body>
<div class="wrapper">
<table width="65%" height="106" border="0" cellpadding="5" cellspacing="0" align="center">
<tr>
<td width="48%" scope="row" align="center" style="padding-top:75px">
<select name="select" id="phonefeatures" multiple size="4" >
<option value="Touch Screen" id="touch">Touch Screen </option>
<option value="3G" id="3g">3G </option>
<option value="Andriod" id="andriod">Andriod </option>
<option value="MP3" id="mp3">MP3 </option>
<option value="Radio" id="radio">Radio </option>
<option value="Multi task" id="multi">Multi task</option>
</select>

</td>

<td width="52%" align="center" style="padding-top:75px; color:#FFFFFF">
<table width="100%" border="0" cellspacing="0" cellpadding="5">
<tr>
<td width="194" scope="row"><h3>Feature 1 </h3></td>
<td width="222" scope="row" id="feature1">&nbsp;</td>
</tr>
<tr>
<td width="194" scope="row"><h3>Feature 2 </h3></td>
<td width="222" scope="row" id="feature2">&nbsp;</td>
</tr>
<tr>
<td width="194" scope="row"><h3>Feature 3 </h3></td>
<td width="222" scope="row" id="feature3">&nbsp;</td>
</tr>
<tr>
<td width="194" scope="row"><h3>Feature 4 </h3></td>
<td width="222" scope="row" id="feature4">&nbsp;</td>
</tr>
<tr>
<td width="194" scope="row"><h3>Feature 5 </h3></td>
<td width="222" scope="row" id="feature5">&nbsp;</td>
</tr>
<tr>
<td width="194" scope="row"><h3>Feature 6 </h3></td>
<td width="222" scope="row" id="feature6">&nbsp;</td>
</tr>
</table></td>
</tr>
</table>

</div>
</body>
</html>

The above program should store the values seleted from the multiple dropdown box and should store that values in the array. after the array should be diaplyed with the contents..pls anybody help me..

Tags:
0 Subscribe


2 Replies

+ 1
  Rick001's Photo
Posted Nov 05 2012 11:29 AM

Hello.... seems to me that you have a typo:

<script src="jqueary.js"></script>

JQuery does not have an "a" in it... The following link might be helpful: http://jquery.com/download/

You have a number of things that are incorrect.... among them:

- you do not use the Jquery val() method to see the contents of your array
- you are creating an object to inspect your array?
- you are trying to throw an alert with each iteration of your loop... not the modern way of debugging, I'm afraid.

Replace your code with this cleaned up version:

$(document).ready(function(){

$("#phonefeatures").click(function () {
var optionarray= new Array();
optionarray.push ($('#phonefeatures').val())

console.log(optionarray);

});
});

Use Chrome as your development browser. If you don't have it, download it. If you do have it, load up your page in it. Hit "F12" to open the developer toolbar. Click on "Console". Now with the console open, the "console.log" statement will print to the log and not interrupt your script or annoy with each loop iteration. Your array will print out. just open it in the console to inspect its contents.
0
  Ahana56's Photo
Posted Nov 25 2013 04:28 AM

Awesome blog. I enjoyed reading your articles. Big Fat Daddy's This is truly a great read for me. I have bookmarked it and I am looking forward to reading new articles. Keep up the good work.
Nam Ho Travel Service