[javascript] onchange hidden field, maar dan 4 keer - Softwareontwikkeling

dinsdag 6 juli 2004 21:12

Acties:

Hora ruit; hora est!

Topicstarter

Ik heb een scriptje gevonden dat precies doet wat ik zoek nl. als je in een pulldown menu als optie "other" kiest komt er een tekstveld naast het pulldown menu te staan waar je zelf een andere optie in kunt tikken. Als je iets anders dan "other" kiest krijg je dit tekstveld niet te zien. Werkt perfect.

Maar nu wil ik graag 4 van dit soort dynamische comboboxen gebruiken binnen 1 form. Geen idee hoe ik dit aan moet pakken, ik ben niet zo sterk in JS.

dit is de code

code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<TITLE>Combo box demo</TITLE>
<script type="text/javascript" language="JavaScript"><!--
function activate(field) {
  field.disabled=false;
  if(document.styleSheets)field.style.visibility  = 'visible';
  field.focus(); }
function last_choice(selection) {
  return selection.selectedIndex==selection.length - 1; }
function process_choice(selection,textfield) {
  if(last_choice(selection)) {
    activate(textfield); }
  else {
    textfield.disabled = true;    
    if(document.styleSheets)textfield.style.visibility  = 'hidden';
    textfield.value = ''; }}
function valid(menu,txt) {
  if(menu.selectedIndex == 0) {
    alert('You must make a selection from the menu');
    return false;} 
  if(txt.value == '') {
    if(last_choice(menu)) {
      alert('You need to type your choice into the text box');
      return false; }
    else {
      return true; }}
  else {
    if(!last_choice(menu)) {
      alert('Incompatible selection');
      return false; }
    else {
      return true; }}}
function check_choice() {
  if(!last_choice(document.demoform.menu)) {
    document.demoform.choicetext.blur();
    alert('Please check your menu selection first');
    document.demoform.menu.focus(); }}
//--></script>

<form action="http://www.malibutelecom.com/yucca/cgi-bin/checkcombo.pl"
 name="demoform" onsubmit=
 "return valid(this.menu,this.choicetext)">
<select name="menu" onchange=
 "process_choice(this,document.demoform.choicetext)">
<option value="0" selected>(please select:)</option>
<option value="1">one</option>
<option value="2">two</option>
<option value="3">three</option>
<option value="other">other, please specify:</option>
</select>
<noscript>
<input type="text" name="choicetext">
</noscript>



<script type="text/javascript" language="JavaScript"><!--
disa = ' disabled';
if(last_choice(document.demoform.menu)) disa = '';
document.write('<input type="text" name="choicetext"'+disa+
' onfocus="check_choice()">');
if(disa && document.styleSheets)
   document.demoform.choicetext.style.visibility  = 'hidden';
//--></script>
  <br>
  <p>
<input type="submit">
</form>

Ik ben bang dat ik hierbij een beetje hulp nodig heb

[ Voor 23% gewijzigd door niXnut op 06-07-2004 21:44 ]

dinsdag 6 juli 2004 21:57

Acties:

crisp

Devver

Pixelated

1 tip: gooi dat scriptje weg, het is ranzig en door de vage document.styleSheets afvraging sluit je browsers uit.

Nou goed, nog een tip dan: lees gewoon eens een JS tutorial door, het kunnen targetten van een element en zichtbaar/onzichtbaar maken is geen rocket-science maar juist één van de dingen die een gemiddelde tutorial zeker zal bespreken. Een functie kan je dynamischer maken door er bepaalde parameters aan mee te geven, dus het is echt niet zo moeilijk om een functie te schrijven die op basis van zo'n parameter het juiste inputveld kan benaderen.

Als je zelf wat op weg bent en alsnog vast loopt mag je een nieuw topic openen, maar op deze manier is het een scriptrequest welke wij hier dus niet toestaan.

Intentionally left blank

Dit topic is gesloten.