paslēpt - parādīt kontroļus

[echo]

Kā pareizi izdarīt sekojošo:

 

 

Formā ir iespēja izvēlēties vai tā būs juridiska persona vai fiziska.

<tr>

<td>Klienta tips: </td>

<td><input type="radio" name="group_type" value="fiziska"> Fiziska persona<br>

<input type="radio" name="group_type" value="juridiska" checked> Juridiska persona<br></td>

</tr>

 

Un ir kolonnas - vārds un uzvārds.

<tr> <td>Vārds: </td> <td><input type="text" name="txtName" maxlength="30"/></td> </tr>

<tr> <td>Uzvārds: </td> <td><input type="text" name="txtSurname" maxlength="30"/></td> </tr>

<tr> <td>Uzņēmuma nosaukums: </td> <td><input type="text" name="txtEnterpriseName" maxlength="100"/></td> </tr>

 

Kā lai izdara, lai - ja radiobutton ir fiziska persona, tad rādās gan vārds, gan uzvārds.

Ja radiobutton ir juridiska persona, tad rāda tikai uzņēmuma nosaukums.

 

Šādi ir ar ļoti daudzām kolonnām - atkarībā no radiobuttona kādas 10 kolonnas mainās (vai tās rāda, vai nerāda).

 

Man šķiet, ka tas darāms ar JavaScript, bet pagaidām tikai mācos...

Edited March 2, 2009 by echo

[bubu]

Tu label tagu izmanto nepareizi. To jālieto tikai apkārt tekstam, kas attiecas uz konkrēto labeli:

<br /> Klienta tips:
<br />
<input type="radio" name="group_type" value="fiziska"> Fiziska persona<br>
<input type="radio" name="group_type" value="juridiska" checked> Juridiska persona<br>
<br/>

Un ir kolonnas - vārds un uzvārds.
<br /><label for="txtName">Vārds</label>: <input type="text" id="txtName" name="txtName" maxlength="40"/>
<br /> <label for="txtSurname">Uzvārds</label>: <input type="text" id="txtSurname" name="txtSurname" maxlength="40"/>
<br /> <label for="txtTitle">Nosaukums</label>: <input type="text" name="txtTitle" maxlength="40"/>

(ieteiktu arī izmest ārā tos <br/> tagus un lietot izskata formēšanai CSS, bet nu tā ir cita tēma)

 

Par tavu lauku slēpšanu - pieliec tiem inputiem onchange eventu: onchange="person_changed();"

Un uztaisi javaskriptā funkciju person_changed, kurā vai nu slēp, vai nu rādi vajadzīgos laukus:

function person_changed()
{
var fiziska_persona = document.getElementsByName("group_type")[0].checked;
$("txtName").style.display = fiziska_persona ? "inline" : "none";
$("txtSurname").style.display = fiziska_persona ? "inline" : "none";
$("txtTitle").style.display = fiziska_persona ? "none" : "inline";
}

(šeit ar $ domāts funkcija, kas atgriež elementu pēc tā id - document.getElementByID)

[echo]

bubu: es noeditēju postu laikam pirms tu atbildēji - es nomainīju labelus pret tabulu, vai tas ir normāli (vai arī labāk tomēr ar to css?)

Tad tas javascripts jāpieliabot, lai viņš slēptu/rādītu tabulas rindiņas?

[bubu]

Tas saucās semantika un zinātnieki joprojām strīdas, kas ir labāk :) Īsi sakot garo tekstu - tabulas vajag izmantot tabulāriem datiem, bet CSS pārējā noformatēšanai. Tava input forma neizskatās pēc tabulāriem datiem, tāpēc tomēr tabulas tur īsti pēc savas būtības (tabula) neiederās. Savu input formu vari noformatēt diezgan viegli arī ar CSS: http://www.alistapart.com/articles/prettyaccessibleforms

 

Javaskriptam par noformējumu liels vienalga - tas strādās arī tavā tabulu variantā.

[echo]

Ok, paldies.

Mēģināšu visu izprast.

[echo]

Btw, tai kodā sanāk, ka labeļi netiek paslēpti.

Un ja izmanto tabulas, tad arī sanāk, ka netiek paslēpts virsrasts.

[bubu]

Ah pareiz - piešķir to $("...") vietā vajag rakstīt nevis input id vērtības, bet gan piešķirt id tabulu rindām un rakstīt tos tur. Vai arī li elementiem, ja veidosi formu bez tabulām.