<select> en <input>

Status
Niet open voor verdere reacties.

ShuCh3n

Gebruiker
Lid geworden
13 jan 2008
Berichten
20
Code:
<select name="nummer"><option value="+31">Nederland</option></select>
<input name="nummer" type="text" size="46" AUTOCOMPLETE=off>

Alles wat in de input wordt getypt moet achter select (+31) komen maar hoe doe ik dit?
 
Dat kan zo:
PHP:
<script type="text/javascript">
 function add(index,base,value) {
  document.forms[0].nummer[index].value = base + value;
  };
</script>

<form>
 <select name="nummer">
  <option value="+31">Nederland</option>
 </select>
 <input name="p_nummer" type="text" size="46" AUTOCOMPLETE=off onkeyup="add(0,'+31',this.value)">
</form>

<input type="button" onclick="alert(document.forms[0].nummer[0].value)" value="test">
Ik heb wel het tekstvakje p_nummer genoemd, anders heeft het dezelfde naam als de select. :)


Vr.Gr. Egel.
 
maar als ik meerdere landen eraan toevoegt dan werkt het niet meer :(
Code:
<form id="smsForm" name="smsForm">
<table>
  <tr><td valign="top">Nummer:</td><td>
  <script type="text/javascript">
function add(index,base,value) {
  document.forms[0].nummer[index].value = base + value;
  };
</script>
	<select name="nummer">
	<option value="+54">Argentinië</option>
	<option value="+61">Australië</option>
	<option value="+880">Bangladesh</option>
	<option value="+32">België</option>
	<option value="+55">Brazilië</option>
	<option value="+359">Bulgarije</option>
	<option value="+1">Canada</option>
	<option value="+86">China</option>
	<option value="+57">Colombia</option>
	<option value="+45">Denemarken</option>
	<option value="+49">Duitsland</option>
	<option value="+33">Frankrijk</option>
	<option value="+30">Griekenland</option>
	<option value="+44">Groot-Brittannië</option>
	<option value="+36">Hongarije</option>
	<option value="+852">Hong Kong</option>
	<option value="+385">Kroatië</option>
	<option value="+60">Maleisië</option>
	<option value="+31">Nederland</option>
	<option value="+47">Noorwegen</option>
	<option value="+43">Oostenrijk</option>
	<option value="+92">Pakistan</option>
	<option value="+51">Peru</option>
	<option value="+48">Polen</option>
	<option value="+351">Portugal</option>
	<option value="+40">Roemenië</option>
	<option value="+7">Rusland</option>
	<option value="+381">Servië en Montenegro</option>
	<option value="+65">Singapore</option>
	<option value="+66">Thailand</option>
	<option value="+420">Tsjechië</option>
	<option value="+58">Venezuela</option>
	<option value="+46">Zweden</option>
	<option value="+41">Zwitserland</option>
		</select><input name="nummer2" type="text" size="46" AUTOCOMPLETE=off onkeyup="add(0,'+31',this.value)"></td></tr>
  <tr><td valign="top">Bericht:</td><td>
	<textarea name="bericht" rows="7" cols="45" maxlength="160"onkeyup="return ismaxlength(this)"></textarea></td></tr>
  <tr><td>&nbsp;</td><td><input type="button" value="Versturen" onClick="sendSMS(document.forms[0].nummer[0].value);">
 
maar als ik meerdere landen eraan toevoegt dan werkt het niet meer :(
Dan moet 't iets anders inderdaad. :)
PHP:
<script type="text/javascript">
 var base = new Array();

 function start() {
  var n = document.smsForm.nummer;
  for (var i = 0; i < n.length; i++) {
   base[i] = {value: n[i].value, text: n[i].text};
   };
  };

 window.onload = start;

 function add(value) {
  var n = document.smsForm.nummer, i = n.selectedIndex;
  n[i].value = base[i].value + value;
  n[i].text  = base[i].text + ' ' + n[i].value;
  };

 function wipe() {
  var n2 = document.smsForm.nummer2;
  n2.value = '';
  n2.focus();
  };
</script>


<form name="smsForm">
 Nummer:<br>
 <select name="nummer" onchange="wipe()">
  <option value="+54">Argentinië</option>
  <option value="+61">Australië</option>
  <option value="+880">Bangladesh</option>
  <option value="+32">België</option>
  <option value="+55">Brazilië</option>
  <option value="+359">Bulgarije</option>
  <option value="+1">Canada</option>
  <option value="+86">China</option>
  <option value="+57">Colombia</option>
  <option value="+45">Denemarken</option>
  <option value="+49">Duitsland</option>
  <option value="+33">Frankrijk</option>
  <option value="+30">Griekenland</option>
  <option value="+44">Groot-Brittannië</option>
  <option value="+36">Hongarije</option>
  <option value="+852">Hong Kong</option>
  <option value="+385">Kroatië</option>
  <option value="+60">Maleisië</option>
  <option value="+31">Nederland</option>
  <option value="+47">Noorwegen</option>
  <option value="+43">Oostenrijk</option>
  <option value="+92">Pakistan</option>
  <option value="+51">Peru</option>
  <option value="+48">Polen</option>
  <option value="+351">Portugal</option>
  <option value="+40">Roemenië</option>
  <option value="+7">Rusland</option>
  <option value="+381">Servië en Montenegro</option>
  <option value="+65">Singapore</option>
  <option value="+66">Thailand</option>
  <option value="+420">Tsjechië</option>
  <option value="+58">Venezuela</option>
  <option value="+46">Zweden</option>
  <option value="+41">Zwitserland</option>
 </select>
 <br>
 <input name="nummer2" type="text" size="46" AUTOCOMPLETE=off onkeyup="add(this.value)">
 <br>
 Bericht:<br>
 <textarea name="bericht" rows="7" cols="45" maxlength="160"></textarea>
 <input type="button" value="Versturen" onClick="sendSMS();">
</form>
De functie start() bewaard alle waarden van de select via de onload. Het nummer wordt toegevoegd aan de .value van het geselecteerde land en ook nog eens aan de .text zodat je kunt zien wat je al ingevuld hebt. En de functie wipe() wist het invulveld en focused er op als je een ander land kiest. :)


Vr.Gr. Egel.
 
yeah het werkt! :) bedankt egel!! :D

Edit:

Egel... is het ook mogelijk om niet in de select stukje te laten komen? want nu krijg ik dit:
 
Laatst bewerkt:
Graag gedaan! :)

Als je deze regel weglaat:
PHP:
 n[i].text = base[i].text + ' ' + n[i].value;
dan heb je dit niet meer:
smsic9.jpg

Maar dan weet je dus niet meer welke en wat je al ingevuld hebt.


Zo verschijnt een al ingevuld nummer weer rechts als je de select wijzigt:
PHP:
<script type="text/javascript">
 var base = new Array();

 function start() {
  var n = document.smsForm.nummer;
  for (var i = 0; i < n.length; i++) {
   base[i] = n[i].value;
   };
  };

 window.onload = start;

 function add(value) {
  var n = document.smsForm.nummer, i = n.selectedIndex;
  n[i].value = base[i] + value;
  };

 function wipe() {
  var n = document.smsForm.nummer, i = n.selectedIndex;
  var n2 = document.smsForm.nummer2;
  n2.value = n[i].value.substring(base[i].length);
  n2.select();
  n2.focus();
  };
</script>


<form name="smsForm">
 Nummer:<br>
 <select name="nummer" onchange="wipe()">
  <option value="+54">Argentinië</option>
  <option value="+61">Australië</option>
  <option value="+880">Bangladesh</option>
  <option value="+32">België</option>
  <option value="+55">Brazilië</option>
  <option value="+359">Bulgarije</option>
  <option value="+1">Canada</option>
  <option value="+86">China</option>
  <option value="+57">Colombia</option>
  <option value="+45">Denemarken</option>
  <option value="+49">Duitsland</option>
  <option value="+33">Frankrijk</option>
  <option value="+30">Griekenland</option>
  <option value="+44">Groot-Brittannië</option>
  <option value="+36">Hongarije</option>
  <option value="+852">Hong Kong</option>
  <option value="+385">Kroatië</option>
  <option value="+60">Maleisië</option>
  <option value="+31">Nederland</option>
  <option value="+47">Noorwegen</option>
  <option value="+43">Oostenrijk</option>
  <option value="+92">Pakistan</option>
  <option value="+51">Peru</option>
  <option value="+48">Polen</option>
  <option value="+351">Portugal</option>
  <option value="+40">Roemenië</option>
  <option value="+7">Rusland</option>
  <option value="+381">Servië en Montenegro</option>
  <option value="+65">Singapore</option>
  <option value="+66">Thailand</option>
  <option value="+420">Tsjechië</option>
  <option value="+58">Venezuela</option>
  <option value="+46">Zweden</option>
  <option value="+41">Zwitserland</option>
 </select>
 <br>
 <input name="nummer2" type="text" size="46" AUTOCOMPLETE=off onkeyup="add(this.value)">
 <br>
 Bericht:<br>
 <textarea name="bericht" rows="7" cols="45" maxlength="160"></textarea>
 <input type="button" value="Versturen" onClick="sendSMS();">
</form>
:)


Vr.Gr. Egel.
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan