Autor Zpráva
srigi
Profil
#1 · Zasláno: 21. 6. 2006, 11:19:49
Odpovědět Citovat
Hi, da sa nejako pomocou JS zmenit "select" za obycajne textove formularove pole?
napr. takto >> Mam tieto optiony: ks, m, l, iné
no a po vybrati volby "iné" sa select zmeni na "INPUT type=text".
srigi
Profil
#2 · Zasláno: 21. 6. 2006, 11:23:29 · Upravil/a: srigi
Odpovědět Citovat
Mam aj ine riesenie, ale nie je take elegantne ako, to co pozadujem hore.
Skuste tento kod. (nezabudnite si zmenit kodovanie pri ukladani na UTF-8)


<!-- IE go to quirk -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
<META http-equiv="Cache-Control" content="no-cache, must-revalidate">
<TITLE>selectoo</TITLE>
<SCRIPT language = "JavaScript" type = "text/javascript" >
<!--

function pokus(vstup)
{
var id = vstup.id.substring(3, 5);
var val = vstup.value;

if (val == "ine") {
document.getElementById("v" + id).disabled = false;
document.getElementById("v" + id).className = "on";
document.getElementById("v" + id).focus();
}
else {
document.getElementById("v" + id).disabled = true;
document.getElementById("v" + id).value = "";
document.getElementById("v" + id).className = "off";
}
}

//––>
</SCRIPT>

<STYLE>
body {background: #AEF}
.on {background: #FFD; width: 100%; border: none}
.off {background: #BBB; width: 0.2%; border: none; padding: 0;}
td {border: 1px solid blue}
</STYLE>

</HEAD>
<BODY>

<form name="form" id="form">

<table width="900px">
<tr>
<td>Názov materiálu</td>
<td>množstvo</td>
<td colspan="2">množstvo v ...</td>
</tr>
<tr>
<td width="740px"><input name="mat01" id="mat01" class="on" type="text"></td>
<td width="60px"><input name="mno01" id="mno01" class="on" type="text"></td>
<td>
<select name="sel01" id="sel01" onchange="pokus(this)">
<option value="na"></option>
<option value="ks">ks</option>
<option value="m">m</option>
<option value="ine">iné</option>
</select>
</td>
<td width="50px"><input name="v01" id="v01" class="off" type="text" disabled></td>
</tr>
<tr>
<td width="740px"><input name="mat02" id="mat02" class="on" type="text"></td>
<td width="60px"><input name="mno02" id="mno02" class="on" type="text"></td>
<td>
<select name="sel02" id="sel02" onchange="pokus(this)">
<option value="na"></option>
<option value="ks">ks</option>
<option value="m">m</option>
<option value="ine">iné</option>
</select>
</td>
<td width="50px"><input name="v02" id="v02" class="off" type="text" disabled></td>
</tr>
<tr>
<td width="740px"><input name="mat03" id="mat03" class="on" type="text"></td>
<td width="60px"><input name="mno03" id="mno03" class="on" type="text"></td>
<td>
<select name="sel03" id="sel03" onchange="pokus(this)">
<option value="na"></option>
<option value="ks">ks</option>
<option value="m">m</option>
<option value="ine">iné</option>
</select>
</td>
<td width="50px"><input name="v03" id="v03" class="off" type="text" disabled></td>
</tr>
<tr>
<td colspan="4" align="center"><input type="submit" value="odosli"></td>
</tr>
</table>

</form>

</BODY>
</HTML>
peta
Profil *
#3 · Zasláno: 21. 6. 2006, 12:37:10
Odpovědět Citovat
srigi
=== po vybrati volby "iné" sa select zmeni na "INPUT type=text". ===
A to je k cemu dobre? Vzdyt na vybranou hodnotu se da normalne odkazovat, viz priklady na jakpsatweb javascritpt. Cili, ze bych nekam zkopiroval value podle toho, co mam vybrane...

Ale tak celkem elegantni je udelat si 2 bloky, 1 se select, druhy s input a menit mezi nimi display:none.
Nebo zkratka mi nekde display:none vsechny takove prvky a jenom menit pres innerHTML obsah daneho bloku.

Asi chces neco jako Ajax - prime zpracovani

Ale podle mne je lepsi select, kdyz uz ho tam mas.
Časová prodleva: 18 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0