webForumDet fria alternativet
Logga in / Bli medlem

Visa olika formulärval!

JavaScript

3 svar · 306 visningar · startad av devotion

Medlem sedan jan. 20013 582 inlägg
Trådstart#1

Hejsan! :)

Hur skulle man kunna lösa detta:

Jag vill ha en listmeny med 4 olika val:
Tid
Dag
Vecka
Månad

När man väljer Tid ska fyra textfält visas
startDate, startTime, stopDate, stopTime

Väljs Dag ska startDate och stopDate visas Textfält

Väljs vecka skall startWeek och stopWeek visas (listmeny)

väljs Månad ska startMonth och stopMonth visas (listmeny)

Skulle vara fint om det går!

Mvh
Henrik

Medlem sedan dec. 20025 483 inlägg
#2

Hej! :)

<style>
#startDate  ,
#stopDate   ,
#startTime  ,
#stopTime   ,
#startWeek  ,
#stopWeek   ,
#startMonth ,
#stopMonth  { display: none }
</style>

<script>
// id:n på de element som berörs av visa/dölj-koden
var allIds = ["startDate","stopDate","startTime","stopTime","startWeek","stopWeek","startMonth","stopMonth"];

function f(sel){
  var opts   = sel.options,
      affIds = [];

  // i affIds läggs de id:n som skall visas beroende på menyvalet
  switch (opts[sel.selectedIndex].text){
    case "Tid"  : affIds = ["startDate","stopDate","startTime","stopTime"]; break;
    case "Dag"  : affIds = ["startDate","stopDate"]; break;
    case "Vecka": affIds = ["startWeek","stopWeek"]; break;
    case "Månad": affIds = ["startMonth","stopMonth"]; break;
  }

  for (var i = 0; i < allIds.length; ++i){
    var found = false;

    for (var j = 0; j < affIds.length; ++j){
      if (allIds[i] == affIds[j]){
	found = true;
	break;
      }
    }

    var elm = document.getElementById(allIds[i]);

    if (found){
      elm.style.display = "block";
    } else {
      elm.style.display = "none";
    }
  }
}
</script>

<form>
  <div>
    <select onchange="f(this)">
      <option>--------------</option>
      <option>Tid</option>
      <option>Dag</option>
      <option>Vecka</option>
      <option>Månad</option>
    </select>
  </div>
  <div id="startDate">
    <input name="startDate" value="startDate">
  </div>
  <div id="stopDate">
    <input name="stopDate" value="stopDate">
  </div>
  <div id="startTime">
    <input name="startTime" value="startTime">
  </div>
  <div id="stopTime">
    <input name="stopTime" value="stopTime">
  </div>
  <div id="startWeek">
    <select name="startWeek">
      <option>startWeek</option>
    </select>
  </div>
  <div id="stopWeek">
    <select name="stopWeek">
      <option>stopWeek</option>
    </select>
  </div>
  <div id="startMonth">
    <select name="startMonth">
      <option>startMonth</option>
    </select>
  </div>
  <div id="stopMonth">
    <select name="stopMonth">
      <option>stopMonth</option>
    </select>
  </div>
</form>
Medlem sedan jan. 20013 582 inlägg
#3

Hej! :)
På första försöket! Fantastiskt!

Tack som fan!

Mvh
Henrik

Medlem sedan dec. 20053 inlägg
#4

Validering av fält i formulär

Hej
Kan någon hjälpa mig?
Jag har lånat kod till ett formulär med fält för namn, tele, e-post osv, ungefär som nedan. Efterlyser ytterligare validering av fält.
1 Hur gör jag för att kontrollera att det inte förekommer några siffror i ex fältet för namn. Vill att kontrollen skall ske onSubmit.
2 Hur gör jag för att bekräfta för användaren att formuläret är skickat?

function checkFields() {
missinginfo = "";
if (document.kontakt.namn.value == "") {
missinginfo += "\n - Namn";
}
if (document.kontakt.adress.value == "") {
missinginfo += "\n - Adress";
}
if ((document.kontakt.email.value == "") ||
(document.kontakt.email.value.indexOf('@') == -1) ||
(document.kontakt.email.value.indexOf('.') == -1)) {
missinginfo += "\n - Epostadress";
}
if(document.kontakt.meddelande.value == "") {
missinginfo += "\n - Meddelande";
}
if (missinginfo != "") {
missinginfo ="__\n" +
"Du har inte fyllt i fälten:\n" +
missinginfo + "\n
__" +
"\nFyll i de angivna fälten innan du skickar formuläret!";
alert(missinginfo);
return false;
}
else return true;
}

Är inte bra på detta, så enklast möjliga lösning är jag tacksam för!
/Lill

343 ms totalt · 4 externa anrop · v20260731065814-full.7d626504
120 ms — deklarationer (db)
0 ms — hämta statistik (cache)
215 ms — hämta tråd, inlägg och bilagor (db)
125 ms — ändringar (db)