...

View Full Version : SELECT sends a single value to CGI?



Kor
03-11-2004, 11:52 AM
In may look like a pure HTML problem, yet ...

I have a double array

var p = new Array()
p[0] = new Array('product1','price1');
p[1] = new Array('product2','price2');
...

For each product I have a select

<select name="s0">
<option selected>0</select>
<option selected>1</select>
..
<option selected>10</select>
</select>

I try to give, dinamically, values to each select tag (product) and to it's selectedIndex option (price*selectedIndex). No problem till here but...

It looks like, on submit, the form sends, for each select, only one value, that price*selectedIndex. It looks like <select> has only a value to send, not his own value AND the his selected option's value.

I need to send the name of the product also but how? Shall I build a hidden element in form?

Spudhead
03-11-2004, 12:55 PM
I'm afraid I have no idea what you're talking about, but I know that this is wrong:

<select name="s0">
<option selected>0</select>
<option selected>1</select>
..
<option selected>10</select>
</select>

1. Only one <option> in a <select> can have the 'selected' attribute - that's why it's the selected one.
2. The correct closing tag for <option> is not </select>, but </option>.

Kor
03-12-2004, 08:25 AM
Yeap, I reckon. I used hidden inputs to solve the problem, thanks for replay

glenngv
03-12-2004, 08:35 AM
add the multiple attribute to allow multiple selections.

<select name="s0" multiple="multiple" size="5">
<option selected="selected">0</option>
<option selected="selected">1</option>
..
<option selected="selected">10</option>
</select>

Kor
03-12-2004, 09:02 AM
add the multiple attribute to allow multiple selections.


that would not suit. The ideea is that I would like to send 3 different values to server using the same select. One is the name of the product (name ="product"), that's ok with. The 2nd is the total value (price*number), that's OK either , I generate dinamically the selected option to carry that value. The 3rd is the selectedIndex it self, as I want to know it as well.

The CGI should compose a mail in which, amongst other things, should have:

Nameofproduct ---- how manyoredered --- price*howmanyordered

I hoped that <select> could carry an independent value to the server as well, but I see that this is not possible, so I solved that by generated dinamically some input hidden to carry the rest of information to server. thank you all for your replay.

Kor
03-12-2004, 09:07 AM
It was somehow related to javascript, as I wonder if thus generated values will reach the server as well as classical HTML input values



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="css/scroll.css">
<script language="JavaScript">
var p = new Array()
p[0] = new Array('Daily ','120 tb.',1700000);
p[1] = new Array('Daily ','30 tb.',600000);
p[2] = new Array('Multivitamine de mestecat ','120 tb.',900000);
p[3] = new Array('Multivitamine de mestecat ','30 tb.',270000);
p[4] = new Array('Acerola C ','100 tb.',750000);
p[5] = new Array('Acerola C ','30 tb.',300000);
p[6] = new Array('Natural B complex ','100 tb.',585000);
p[7] = new Array('Natural B complex ','30 tb.',230000);
p[8] = new Array('Multicaroten ','90 tb.',1090000);
p[9] = new Array('Multicaroten ','30 tb.',375000);
p[10] = new Array('Calciu-Magneziu ','210 tb.',820000);
p[11] = new Array('Calciu-Magneziu ','60 tb.',275000);
function setUp(){
for(i=0;i<p.length;i++){
document.getElementById('p'+i).innerHTML = p[i][0];
document.getElementById('t'+i).innerHTML = p[i][1];
document.getElementById('pr'+i).innerHTML = p[i][2];
}
}
function calcul(){
d=document.forms[0];total = 0;np = 0;inp='';
var sel = new Array()
for(i=0;i<p.length;i++){
sel[i] = d.elements['s'+i].selectedIndex;
total = total+p[i][2]*sel[i];
np = np + sel[i];
if(sel[i]!=0){
d.elements['s'+i].options[sel[i]].value = p[i][2]*sel[i];
inp = inp+'<input name="'+p[i][0]+p[i][1]+'" type="hidden" value="'+sel[i]+'">';
}
}
document.getElementById('hi').innerHTML = inp;
d.np.value = np;
d.total.value = total;
}
function verif(){
d=document.forms[0];
if (d.nume.value.length<1) {alert("Nu ati scris numele si prenumele!");d.nume.focus();return false}
if (d.adresa.value.length<1) {alert("Nu ati scris adresa!");d.adresa.focus();return false}
if (d.telefon.value.length<1) {alert("Nu ati scris telefonul!");d.telefon.focus();return false}
if (d.total.value == 0) {alert("Nu ati selectat nici un produs!");return false}
return true;
}
window.onload = setUp;
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="0">
<form method="post" action="" onSubmit="return verif();">
<table width="580" border="0" cellspacing="0" cellpadding="2">
<tr>
<td class="text2">
<table width="80%" border="0" cellspacing="1" cellpadding="2" align="center">
<tr align="center">
<td class="comanda" width="40%">Produs</td>
<td class="comanda" width="20%">Prezentare<br>
(nr. tablete)</td>
<td class="comanda" width="25%">Pret<br>
(lei) </td>
<td class="comanda">Alege cantitatea</td>
</tr>
<tr>
<td id="p0" class="comanda2">&nbsp;</td>
<td id="t0" class="comanda2" align="center">&nbsp;</td>
<td id="pr0" class="comanda2" align="right">
</td>
<td class="comanda2" align="center">
<select value="oak" name="s0" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
<tr>
<td id="p1" class="comanda2">&nbsp;</td>
<td id="t1" class="comanda2" align="center">&nbsp;</td>
<td id="pr1" class="comanda2" align="right">&nbsp; </td>
<td class="comanda2" align="center">
<select name="s1" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
<tr>
<td id="p2" class="comanda">&nbsp;</td>
<td id="t2" class="comanda" align="center">&nbsp;</td>
<td id="pr2" class="comanda" align="right">&nbsp; </td>
<td class="comanda" align="center">
<select name="s2" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
<tr>
<td id="p3" class="comanda">&nbsp;</td>
<td id="t3" class="comanda" align="center">&nbsp;</td>
<td id="pr3" class="comanda" align="right">&nbsp; </td>
<td class="comanda" align="center">
<select name="s3" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
<tr>
<td id="p4" class="comanda2">&nbsp;</td> <td id="t4" class="comanda2" align="center">&nbsp;</td>
<td id="pr4" class="comanda2" align="right">&nbsp; </td>
<td class="comanda2" align="center">
<select name="s4" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
<tr>
<td id="p5" class="comanda2">&nbsp;</td>
<td id="t5" class="comanda2" align="center">&nbsp;</td>
<td id="pr5" class="comanda2" align="right">&nbsp; </td>
<td class="comanda2" align="center">
<select name="s5" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
<tr>
<td id="p6" class="comanda">&nbsp;</td>
<td id="t6" class="comanda" align="center">&nbsp;</td>
<td id="pr6" class="comanda" align="right">&nbsp; </td>
<td class="comanda" align="center">
<select name="s6" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
<tr>
<td id="p7" class="comanda">&nbsp;</td>
<td id="t7" class="comanda" align="center">&nbsp;</td>
<td id="pr7" class="comanda" align="right">&nbsp; </td>
<td class="comanda" align="center">
<select name="s7" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
<tr>
<td id="p8" class="comanda2">&nbsp;</td>
<td id="t8" class="comanda2" align="center">&nbsp;</td>
<td id="pr8" class="comanda2" align="right">&nbsp; </td>
<td class="comanda2" align="center">
<select name="s8" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
<tr>
<td id="p9" class="comanda2">&nbsp;</td>
<td id="t9" class="comanda2" align="center">&nbsp;</td>
<td id="pr9" class="comanda2" align="right">&nbsp; </td>
<td class="comanda2" align="center">
<select name="s9" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
<tr>
<td id="p10" class="comanda">&nbsp;</td> <td id="t10" class="comanda" align="center">&nbsp;</td>
<td id="pr10" class="comanda" align="right">&nbsp; </td>
<td class="comanda" align="center">
<select name="s10" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
<tr>
<td id="p11" class="comanda">&nbsp;</td>
<td id="t11" class="comanda" align="center">&nbsp;</td>
<td id="pr11" class="comanda" align="right">&nbsp; </td>
<td class="comanda" align="center">
<select name="s11" class="select" onchange="calcul()" onmousewheel="return false">
<option selected>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
</table>
<br>
<table width="50%" border="0" cellspacing="1" cellpadding="4" align="center">
<tr>
<td class="total" colspan="2" align="center">Ati ales:</td>
</tr>
<tr>
<td class="total">Nr. total de produse</td>
<td class="total">
<input type="text" name="np" readonly="readonly" class="hideform">
</td>
</tr>
<tr>
<td class="total">Valoare totala</td>
<td class="total">
<input type="text" name="total" readonly="readonly" class="hideform">
</td>
</tr>
</table>
<br>
<table width="60%" border="0" cellspacing="1" cellpadding="2" align="center">
<tr align="center">
<td class="comanda" colspan="2" height="34">FORMULAR DE COMANDA<br>
Va rugam completati campurile de mai jos </td>
</tr>
<tr>
<td class="total" width="30%">Nume si prenume</td>
<td class="total">
<input type="text" name="nume" class="visform">
</td>
</tr>
<tr>
<td class="total">Adresa</td>
<td class="total">
<textarea name="adresa" class="visform" rows="3"></textarea>
</td>
</tr>
<tr>
<td class="total">Telefon</td>
<td class="total">
<input type="text" name="telefon" class="visform">
</td>
</tr>
<tr>
<td class="total">E-mail</td>
<td class="total">
<input type="text" name="email" class="visform">
</td>
</tr>
<tr>
<td class="total">&nbsp;</td>
<td class="total" align="right">
<input type="submit" name="Submit" value="Trimite" class="buton">
<input type="reset" name="Submit2" value="Reset" class="buton">
</td>
</tr>
</table>
</td>
</tr>
</table>
<div id="hi"></div>
</form>
</body>
</html>

Choopernickel
03-12-2004, 03:29 PM
<s>Kor, you want to turn down your volume over there?</s>

Edit: Sorry, it's my browser. Dunno why, but Opera 7 likes to make standard preformatted fonts REALLY REALLY BIG.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum