Avatar billede tgl Nybegynder
09. oktober 2005 - 12:57 Der er 12 kommentarer og
1 løsning

Oprette formular ud fra valg i radio-gruppe

Jeg har en asp-side hvor brugeren skal indtaste sine kuneinformatione med navn, adresse tlf. mv.
Dernæst skal brugeren afgøre om der evt. skal indtastes en
anden leveringsadresse.

Den ahndling skal udløses ved at klikke i een af to radio-knapper, "ja" eller "nej".

Klikkes i "ja" skal der genereres en ny formular med tomme felter som brugeren skal udfylde.

Hvis "nej" skal der generes en formular hvor felterne udfyldes med de adresseinformationer som er indtastet tidligere.

Nogen som har et javascript som kan klare det?
Avatar billede roenving Novice
09. oktober 2005 - 15:03 #1
F.eks. sådan, hvor forsendelses-adressen altid vil stå i de 3 felter delAddress1, 2 og 3 (tre for at en evt. att. kan stå i linje to !-)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:10px;border:0px;padding:0px;font-family:tahoma,verdana,arial,sans-serif;font-size:small;}
.formtabel{border-collapse:collapse;}
.formtabel td{width:200px;vertical-align:top;}
.formtabel .txtInput{width:190px;}
div.txtInput{background:#ddd;margin:3px 0;line-height:1.5em;}
</style>
<script language="javascript" type="text/javascript">
function altAddress(elm,state){
  var f = elm.form;
  if(state){
    f.delAddress1.value = "";
    f.delAddress3.value = "";
  }else{
    f.delAddress1.value = f.address.value;
    f.delAddress3.value = f.zipCity.value;
  }
  f.delAddress2.value = "";
  document.getElementById('delAddressShow').style.display = state ? 'none' : 'block';
  document.getElementById('delAddress').style.display = state ? 'block' : 'none';
}
function copyTxt(elm){
  var f = elm.form;
  var addrField = elm.name=='zipCity' ? f.delAddress3 : f.delAddress1;
  var addrShow = elm.name=='zipCity' ? document.getElementById('showDelAddress3') : document.getElementById('showDelAddress1');
  addrField.value = elm.value;
  addrShow.innerHTML = elm.value;
}
</script>

<title>Send-formular</title>
</head>
<body>
<h4>Oplysniger om køber og forsendelsesadresse:</h4>
<form>
  <table class="formtabel">
    <tr>
      <td>
        Navn:</td>
      <td>
        <input type="text" name="navn" class="txtInput"></td>
    </tr>
    <tr>
      <td>
        Adresse:</td>
      <td>
        <input type="text" name="address" class="txtInput" onkeyup="copyTxt(this);"></td>
    </tr>
    <tr>
      <td>
        Postnr. og by:</td>
      <td>
        <input type="text" name="zipCity" class="txtInput" onkeyup="copyTxt(this);"></td>
    </tr>
    <tr>
      <td>
        Samme leveringsadresse som ovenstående?</td>
      <td>
        Ja: <input type="radio" name="delivery" checked onclick="altAddress(this,false)">
        &nbsp;&nbsp;Nej: <input type="radio" name="delivery" onclick="altAddress(this,true)"></td>
    </tr>
    <tr>
      <td>
        Leveringsadresse:</td>
      <td>
        <div id="delAddress" style="display:none;">
          <input type="text" name="delAddress1" class="txtInput"><br>
          <input type="text" name="delAddress2" class="txtInput"><br>
          <input type="text" name="delAddress3" class="txtInput">
        </div>
        <div id="delAddressShow" style="display:block;">
          <div id="showDelAddress1" class="txtInput">&nbsp;</div>
          <div id="showDelAddress2" class="txtInput">&nbsp;</div>
          <div id="showDelAddress3" class="txtInput">&nbsp;</div>
        </div></td>
    </tr>
  </table>
</form>

</body>
</html>
Avatar billede roenving Novice
09. oktober 2005 - 15:07 #2
Hov, jeg glemte lige noget, copyTxt-funktionen skal se således ud:

function copyTxt(elm){
  var f = elm.form;
  var addrField = elm.name=='zipCity' ? f.delAddress3 : f.delAddress1;
  var addrShow = elm.name=='zipCity' ? document.getElementById('showDelAddress3') : document.getElementById('showDelAddress1');
  if(f.delivery[0].checked)
    addrField.value = elm.value;
  addrShow.innerHTML = elm.value;
}
Avatar billede tgl Nybegynder
10. oktober 2005 - 13:41 #3
Tak for svaret. Jeg har nu forsøgt at indsætte scriptkoden på min asp-side.

Jeg kan godt få det jeg indtaster i adressefeltet og by-feltet til at blive vist i adressefeltet og byfeltet i leveringsformularen.

Jeg har i leveringsformularen tildelt text-felterne id-navn sådan her :
...
Adresse : <INPUT type="text" name="address2" maxlength="200" size="40" id="showDelAddress3">
By: <INPUT type="text" name="town2" size="20" maxlength="50" id="showDelAddress4">
Postnr.: <INPUT type="text" name="zip2" size="10" maxlength="15" id="showDelAddress5">
...

Spm. 1 : Min browser (IE) viser script-fejl!
Hvad gør jeg forkert????

Spm. 2 : Hvordan får jeg flere indtastede værdier med i leveringsformularen?

Spript-kode :
-------------------------------------------
function altAddress(elm,state){
  var f = elm.form;
  if(state) {
    f.address2.value = "";
    f.city2.value = "";
    f.zip2.value = "";
  }
  else {
    f.address2.value = f.address.value;
    f.town2.value = f.town.value;
    f.zip2.value = f.zip.value;
  }
  f.address2.value = "";
  document.getElementById('delAddressShow').style.display = state ? 'none' : 'block';
  document.getElementById('delAddress').style.display = state ? 'block' : 'none';
}
function copyTxt(elm){
  var f = elm.form;
  var addrField = elm.name=='town' ? f.town2 : f.address2;
  var addrShow = elm.name=='town' ? document.getElementById('showDelAddress3') : document.getElementById('showDelAddress4');
  if(f.delivery[0].checked){
  addrField.value = elm.value;
  addrShow.innerHTML = elm.value;
}
}
-------------------------------------------
Avatar billede roenving Novice
10. oktober 2005 - 13:53 #4
Du bliver nødt til at vise din html-kode, f.eks. ved at linke til et eksempel, som kun indeholder _hele_ formularen !-)
Avatar billede tgl Nybegynder
10. oktober 2005 - 14:04 #5
Ok, et øjeblik...
Avatar billede tgl Nybegynder
10. oktober 2005 - 14:08 #6
Script-kode :
-----------------
function altAddress(elm,state){
  var f = elm.form;
  if(state) {
    f.address2.value = "";
    f.town2.value = "";
  }
  else {
    f.address2.value = f.address.value;
    f.town2.value = f.town.value;
  }
  f.address2.value = "";
  document.getElementById('delAddressShow').style.display = state ? 'none' : 'block';
  document.getElementById('delAddress').style.display = state ? 'block' : 'none';
}
function copyTxt(elm){
  var f = elm.form;
  var addrField = elm.name=='town' ? f.town2 : f.address2;
  var addrShow = elm.name=='town' ? document.getElementById('showDelAddress3') : document.getElementById('showDelAddress4');
  if(f.delivery[0].checked){
  addrField.value = elm.value;
  addrShow.innerHTML = elm.value;
}
}


Html-kode :

::::: Start formular med kundeinformationer

<form method="POST" action="addcustomer.asp" name="fcustomer" onSubmit="return validate();">
<TABLE border=0 cellPadding=1 cellSpacing=2 width=480>

<TR><TD colspan="2"><font face="Tahoma,Arial" size="2"><b>Kundeinformation</b></font></TD></TR>
<TR><TD colspan="2">&nbsp;</TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Fornavn:</b></font></TD>
<TD bgcolor="#003366"><input type="Text" size="20" maxlength="50" value="<%=Session("fname")%>" name="fname"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Efternavn:</b></font></TD>
<TD bgcolor="#BDDBC8"><INPUT type="Text" name="lname" size="20" maxlength="50" value="<%= Session("lname") %>"></TD></TR>

<TR><TD vAlign=top align="left"><font face="Tahoma,Arial" size="2"><b>Adresse:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="address" value="<%= Session("address") %>" maxlength="200" size="40" onkeyup="copyTxt(this);"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>By:</b></font></TD>
<TD bgcolor="#BDDBC8"><INPUT type="text" name="town" size="20" maxlength="50" value="<%= Session("town") %>" onkeyup="copyTxt(this);"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Postnr.:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="zip" size="10" maxlength="15" value="<%= Session("zip") %>"></TD></TR>
<TR valign="top">
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Land:</b></font></TD>
<TD bgcolor="#BDDBC8"><font face="Tahoma,Arial" size="2">
<SELECT id="selectLand" name="country">
<% If Session("country") = "" Then %>
<OPTION selected value="Danmark">Danmark</option>
<OPTION value="Færøerne">Færøerne</option>
<OPTION value="Grønland">Grønland</option>
<OPTION value="Norge">Norge</option>
<OPTION value="Sverige">Sverige</option>
<% End if %>
<% If  Session("country") <> "" Then %>
<OPTION selected value="<%= Session("country") %>"><%= Session("country") %>
<OPTION value="Danmark">Danmark</option>
<OPTION value="Færøerne">Færøerne</option>
<OPTION value="Grønland">Grønland</option>
<OPTION value="Norge">Norge</option>
<OPTION value="Sverige">Sverige</option>
<% End if %>
</SELECT></font></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>E-mail:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="email" maxlength="100" size="20" value="<%= Session("email") %>"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Telefon:</b></font></TD>
<TD bgcolor="#BDDBC8"><INPUT type="text" name="phone" size="20" maxlength="20" value="<%= Session("phone") %>"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Fax:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="fax" size="20" maxlength="20" value="<%= Session("fax") %>"></TD></TR>

::::: Start formular med leveringsadresse

<TR><TD colspan="2"><font face="Tahoma,Arial" size="2"><strong>Leveringsadresse</strong></font></TD></TR>
<TR><TD colspan="2">&nbsp;</TD></TR>

<TR><TD colspan="2"><font face="Tahoma,Arial" size="2">Er leveringsadresse og modtager den samme som opgivet i kundeinformation?<br>Ja <input name="delivery" type="radio" value="ja" checked onclick="altAddress(this,false)"> Nej <input name="delivery" type="radio" value="nej" onclick="altAddress(this,true)"></font></TD></TR>
<TR><TD colspan="2">&nbsp;</TD></TR>

<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Fornavn:</b></font></TD>
<TD bgcolor="#003366"><input type="Text" size="20" maxlength="50" value="<%=Session("fname2")%>" name="fname2"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Efternavn:</b></font></TD>
<TD bgcolor="#BDDBC8"><INPUT type="Text" name="lname2" size="20" maxlength="50" value="<%= Session("lname2") %>"></TD></TR>

<div id="delAddress" style="display:none;">
<TR><TD vAlign=top align="left"><font face="Tahoma,Arial" size="2"><b>Adresse:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="address2" maxlength="200" size="40" id="showDelAddress3"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>By:</b></font></TD>
<TD bgcolor="#BDDBC8"><INPUT type="text" name="town2" size="20" maxlength="50" id="showDelAddress4"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Postnr.:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="zip2" size="10" maxlength="15"></TD></TR>
</div>
<div id="delAddressShow" style="display:block;">
<div id="showDelAddress3" class="txtInput">&nbsp;</div>
<div id="showDelAddress4" class="txtInput">&nbsp;</div>
</div>

<TR valign="top">
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Land:</b></font></TD>
<TD bgcolor="#BDDBC8"><font face="Tahoma,Arial" size="2">
<SELECT id="selectLand" name="country2">
<% If Session("country2") = "" Then %>
<OPTION selected value="Danmark">Danmark</option>
<OPTION value="Færøerne">Færøerne (+ 300,00 dkk.)</option>
<OPTION value="Grønland">Grønland (+ 300,00 dkk.)</option>
<OPTION value="Norge">Norge (+ 300,00 dkk.)</option>
<OPTION value="Sverige">Sverige (+ 300,00 dkk.)</option>
<% End if %>
<% If  Session("country2") <> "" Then %>
<OPTION selected value="<%= Session("country2") %>"><%= Session("country2") %>
<OPTION value="Danmark">Danmark</option>
<OPTION value="Færøerne">Færøerne (+ 300,00 dkk.)</option>
<OPTION value="Grønland">Grønland (+ 300,00 dkk.)</option>
<OPTION value="Norge">Norge (+ 300,00 dkk.)</option>
<OPTION value="Sverige">Sverige    (+ 300,00 dkk.)</option>
<% End if %>
</SELECT></font></TD>
</TR>
</table>
</form>
Avatar billede roenving Novice
11. oktober 2005 - 14:50 #7
Kunne du ikke prøve at vise et eksempel, hvor det kun er den kode, som ses i browseren, der er med ?-)
Avatar billede tgl Nybegynder
11. oktober 2005 - 15:36 #8
Hvis du mener det rent visuelle skal jeg lihe have klippet det relevante ud da det er inkluderet i en side med flere andre ting.

Så hvis du har et øjeblik til overs?
Avatar billede roenving Novice
11. oktober 2005 - 15:37 #9
-- nej jeg mener, at du skal vise den kode, der rammer browseren, for det er for svært at få overblik, når der også er en hel masse asp-kode i !-)
Avatar billede tgl Nybegynder
11. oktober 2005 - 15:40 #10
Ok, et øjeblik...
Avatar billede tgl Nybegynder
11. oktober 2005 - 15:46 #11
<HTML>
<HEAD>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<TITLE>************</TITLE>

<script language="Javascript">
<!--

function altAddress(elm,state){
  var f = elm.form;
  if(state) {
    f.address2.value = "";
    f.town2.value = "";
  }
  else {
    f.address2.value = f.address.value;
    f.town2.value = f.town.value;
  }
  f.address2.value = "";
  f.town2.value = "";
  document.getElementById('delAddressShow').style.display = state ? 'none' : 'block';
  document.getElementById('delAddress').style.display = state ? 'block' : 'none';
}
function copyTxt(elm){
  var f = elm.form;
  var addrField = elm.name=='town' ? f.town2 : f.address2;
  var addrShow = elm.name=='town' ? document.getElementById('showDelAddress4') : document.getElementById('showDelAddress3');
  if(f.delivery[0].checked){
  addrField.value = elm.value;
  addrShow.innerHTML = elm.value;
  }
}
//-->
</script>
<META NAME="Generator" CONTENT="">
</HEAD>
<BODY BGCOLOR="#FFFFFF" TEXT="#000000">

...

<!-- ----------------------- start undermenuer ----------------------- -->

<table border="0" width="540" cellpadding="2">
<tr>
<td width="100%" colspan="2" valign="top"><font face="Tahoma,Arial" size="2">
   
<br><b>Trin 3 : Udfyld kundeformular</b><p>Indsamling, registrering og opbevaring af deres oplysninger er kun til brug i vores arbejde med online butikken. Informationerne videregives ikke til 3. mand og gemmes i en ekstra sikret database. &gt;&gt; Læs mere om vores persondatapolitik.</p></font>
</td></tr>

<TR><TD><hr size="1" width="500" align="left"></TD></TR>

<tr><td width="480">

<!-- ---------------------------- Start formular med kundeinformationer ----------------------------  -->
<form method="POST" action="addcustomer.asp" name="fcustomer" onSubmit="return validate();">
<TABLE border=0 cellPadding=1 cellSpacing=2 width=480>

<TR><TD colspan="2"><font face="Tahoma,Arial" size="2"><b>Kundeinformation</b></font></TD></TR>
<TR><TD colspan="2">&nbsp;</TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Fornavn:</b></font></TD>
<TD bgcolor="#003366"><input type="Text" size="20" maxlength="50" value="" name="fname"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Efternavn:</b></font></TD>
<TD bgcolor="#BDDBC8"><INPUT type="Text" name="lname" size="20" maxlength="50" value=""></TD></TR>

<TR><TD vAlign=top align="left"><font face="Tahoma,Arial" size="2"><b>Adresse:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="address" value="" maxlength="200" size="40" onkeyup="copyTxt(this);"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>By:</b></font></TD>
<TD bgcolor="#BDDBC8"><INPUT type="text" name="town" size="20" maxlength="50" value="" onkeyup="copyTxt(this);"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Postnr.:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="zip" size="10" maxlength="15" value=""></TD></TR>
<TR valign="top">
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Land:</b></font></TD>
<TD bgcolor="#BDDBC8"><font face="Tahoma,Arial" size="2">
<SELECT id="selectLand" name="country">

<OPTION selected value="Danmark">Danmark</option>
<OPTION value="Færøerne">Færøerne</option>
<OPTION value="Grønland">Grønland</option>
<OPTION value="Norge">Norge</option>
<OPTION value="Sverige">Sverige</option>

</SELECT></font></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>E-mail:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="email" maxlength="100" size="20" value=""></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Telefon:</b></font></TD>
<TD bgcolor="#BDDBC8"><INPUT type="text" name="phone" size="20" maxlength="20" value=""></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Fax:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="fax" size="20" maxlength="20" value=""></TD></TR>
<!-- ---------------------------- Slut formular med kundeinformationer ----------------------------  -->



<TR><TD colspan="2"><hr size="1"></TD></TR>



<!--  ------------------------------ Start formular med leveringsadresse ------------------------------ -->

<TR><TD colspan="2"><font face="Tahoma,Arial" size="2"><strong>Leveringsadresse</strong></font></TD></TR>
<TR><TD colspan="2">&nbsp;</TD></TR>
<a name="#leveringsadr"></a>
<TR><TD colspan="2"><font face="Tahoma,Arial" size="2">Er leveringsadresse og modtager den samme som opgivet i kundeinformation?<br><input name="delivery" type="radio" value="ja">Ja  <input name="delivery" type="radio" value="nej"> Nej </font></TD></TR>

<TR><TD colspan="2"></TD></TR>

<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Fornavn:</b></font></TD>
<TD bgcolor="#003366"><input type="Text" size="20" maxlength="50" value="" name="fname2"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Efternavn:</b></font></TD>
<TD bgcolor="#BDDBC8"><INPUT type="Text" name="lname2" size="20" maxlength="50" value=""></TD></TR>

<TR><TD vAlign=top align="left"><font face="Tahoma,Arial" size="2"><b>Adresse:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="address2" maxlength="200" size="40"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>By:</b></font></TD>
<TD bgcolor="#BDDBC8"><INPUT type="text" name="town2" size="20" maxlength="50"></TD></TR>
<TR>
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Postnr.:</b></font></TD>
<TD bgcolor="#003366"><INPUT type="text" name="zip2" size="10" maxlength="15"></TD></TR>
<TR><TD>
</td></tr>

<TR valign="top">
<TD align="left"><font face="Tahoma,Arial" size="2"><b>Land:</b></font></TD>
<TD bgcolor="#BDDBC8"><font face="Tahoma,Arial" size="2">
<SELECT id="selectLand" name="country2">

<OPTION selected value="Danmark">Danmark</option>
<OPTION value="Færøerne">Færøerne (+ 300,00 dkk.)</option>
<OPTION value="Grønland">Grønland (+ 300,00 dkk.)</option>
<OPTION value="Norge">Norge (+ 300,00 dkk.)</option>
<OPTION value="Sverige">Sverige (+ 300,00 dkk.)</option>

</SELECT></font></TD>
</TR>

<!--  ------------------------------ Slut formular med leveringsadresse ------------------------------ -->

</TABLE></form>

....


</body>
</html>
Avatar billede tgl Nybegynder
18. december 2005 - 13:00 #12
Lukker spørgsmålet
Avatar billede tgl Nybegynder
09. december 2006 - 17:33 #13
Lukker spørgsmålet
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester