Autor Zpráva
breeta
Profil *
Zdravím, mám formulář a pří výběru select na ano potřebuji přídat další políčka formuláře mám zatím něco takového:

<form >
<select id="selectExekuce">
<option value="nic" selected="selected"> </option>
<option value="ne">ne</option>
<option value="ano">ano</option>
</select>

<script type="text/javascript">

var selectExekuce=document.getElementById("selectExekuce")

selectExekuce.onchange=function(){ 
var chosenoption=this.options[this.selectedIndex] 
if (chosenoption.value =="ano"){
   
var form = "<tr><td>Celková částka exekuce: <input type=\"text\" name=\"castka_exekuce\" size=\"8\" value=\" \" maxlength=\"40\" /></td><td> od roku: <input type=\"text\" name=\"rok_exekuce\" size=\"8\" value=\" \" maxlength=\"40\" /></td></tr>";
document.write(form); 
   
 }
}

</script>

</form>


Text s input se mě vloží pokud vyberu ano, ale ostatní se odstraní jak na to aby select id="selectExekuce" zůstal i při vložení
document.write(form) ...
sysel
Profil
- document .write() vpisuje do vlastního dokumentu jen dokud není dokončeno jeho načítání, po té lze přidat nebo upravit nějakou část změnou vlastnosti objektu innerHTML
- část formuláře může být skryta
<select name="selExec" onChange="javascript:document.getElementById('castka').style.display=(this.value=='ano')?'block':'none'">
   <option value="nic" selected="selected"> - </option>
   <option value="ne">ne</option>
   <option value="ano">ano</option>
</select>
...
<tr style="display: none" id="castka">
  <td>Celková částka exekuce: <input type="text" name="castka_exekuce" size="8" value=" " maxlength="40">
  </td>
  <td> od roku: <input type="text" name="rok_exekuce" size="8" value=" " maxlength="40">
  </td>
</tr>
...
a na daný pokyn se programově změní
- část formuláře se může kompletně přidat, ale co pak potom, když se hodnota selectu opět změní - vyjmout? Také lze, ale mně přijde skrývání jako praktičtější :-)
breeta
Profil *
Jde o to že je tam pokračování formuláře, nakonec jsem to udělal takhle:

<form id = "form">
<select id="selectExekuce">
<option value="nic"> </option>
<option value="ne">ne</option>
<option value="ano">ano</option>
</select>
</form>


<script type="text/javascript">

var selectExekuce=document.getElementById("selectExekuce")

selectExekuce.onchange=function(){ 
var chosenoption=this.options[this.selectedIndex] 
if (chosenoption.value =="ano"){

    var x = document.getElementById("form");   
    
    var input = document.createElement('input');   
    input.setAttribute('name', 'castka_exekuce' );
    input.setAttribute('type', 'text' );
    input.setAttribute('size', '10' );
    
    var input2 = document.createElement('input');   
    input2.setAttribute('name', 'rok_exekuce' );
    input2.setAttribute('type', 'text' );
    input2.setAttribute('size', '4' );
 
      
    var text = document.createTextNode(' Celková částka exekuce: ');
    var text2 = document.createTextNode(' Kč / ');
    var text3 = document.createTextNode(' od roku: '); 
       
    x.appendChild(text);   
    x.appendChild(input);
    x.appendChild(text2);
    x.appendChild(text3);
    x.appendChild(input2);
  
}          
}
 
</script>
 
sysel
Profil
No možná si tu úlohu trochu moc komplikujete - například vložit volání funkce na popud onChange přímo do popisu <select> tagu mi připadá jednodušší tedy něco jako:
<select id="selectExekuce" onChange="javascript:zmena(this)">

a trochu komplikované zjišťování vybrané hodnoty neboť platí:
this.options[this.selectedIndex].value == this.value
pokud this zastupuje DOM objekt <select>
a namísto
inputX.setAttribute('name', 'castka_exekuce' );
a podobné lze napsat bez změny chování:
inputX.name='castka_exekuce';
a podobně.

Ale pokud to funguje ve všech předpokládaných prohlížečích, neřešte to.

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: