webForumDet fria alternativet

Formulär-funktion

7 svar · 397 visningar · startad av AndreasC

AndreasCMedlem sedan mars 20011 964 inlägg
#1

Eftersöker en funktion som innebär att man först har två radio-buttons och beroende på vilken man väljer så ska ett antal textfält som man själv bestämmer vilka, visa en viss bakgrundsbild.

Det ska vara två olika bakgrundsbilder. Väljer man den ena radio-knappen så ska den ena bakgrundsbilden visas i vissa textfält samtidigt som den andra bakgrundsbilden ska sättas på de övriga, och väljer man den andra radio-knappen så ska det bli tvärtom.

Textfälten är vanliga <input type="text">

Går detta att fixa smidigt?

Dev NullMedlem sedan mars 200650 inlägg
#2

cookie?

AndreasCMedlem sedan mars 20011 964 inlägg
#3

Hmm, går det inte lösa utan, gillar inte att behöva lagra cookies på användarens dator.

The_HulkMedlem sedan juni 20031 837 inlägg
#4

Lägg inputfälten i två olika div-taggar. sätt display: none på den som inte ska visas och display: block på den som ska visas.
ha sedan en javascript-funktion som anropas när man väljer radio-button.
Är det något i denna stilen du menar?

<html>

<head>
<script>
function switchDiv(id_1, id_2)
{
  var obj_1 = document.getElementById(id_1);
  var obj_2 = document.getElementById(id_2);
  obj_1.style.display = 'block';
  obj_2.style.display = 'none';

}
</script>
</head>

<body>
<form>
<input type="radio" name="rad" checked onClick="switchDiv('div_1', 'div_2');">Visa första
<input type="radio" name="rad" onClick="switchDiv('div_2', 'div_1');">Visa andra
<div id="div_1">
Visar fält för grupp 1
<br/>1.1 <input type="text" name="field_1_1">
<br/>1.2 <input type="text" name="field_1_2">
<br/>1.3 <input type="text" name="field_1_3">
<br/>1.4 <input type="text" name="field_1_4">
</div>
<div id="div_2" style="display: none;">
Visar fält för grupp 2
<br/>2.1 <input type="text" name="field_2_1">
<br/>2.2 <input type="text" name="field_2_2">
<br/>2.3 <input type="text" name="field_2_3">
<br/>2.4 <input type="text" name="field_2_4">
</div>

</form>
</body>
</html>
AndreasCMedlem sedan mars 20011 964 inlägg
#5

Ja det ser bra ut. Tänkte om man kanske kan byta ut block och none mot två olika bakgrundsbilder istället, det borde fungera eller? Principen och uppbyggnaden av scriptet ser ju rätt ut iallafall.

AndreasCMedlem sedan mars 20011 964 inlägg
#6

Hmm, går det att göra om scriptet så att man kan lägga id="div_2" inuti en <img>-tagg samt inuti <input>-taggarna istället, helst om man kan skriva class="div_2" istället för id för textboxarna ligger på ett sådant sätt så jag kan inte innesluta rätt boxar med en <div>-tagg för det kommer andra boxar mellan som inte ska inneslutas. Därför skulle det vara bättre med class istället för id.

Och ska det inte vara id="id_2" istället för id="div_2"? Jag är inte bra på javascript så det ska kanske va så.

The_HulkMedlem sedan juni 20031 837 inlägg
#7

flera element kan ha samma name, id måste vara unikt.
för att hämta element med name använder man

var elems_1 = document.getElementsByName('div_1');
var elems_2 = document.getElementsByName('div_2');
for(var i=0; i<elems_1.length; i++)
{
    elems_1[i].display = 'block';
}

for(var i=0; i<elems_2.length; i++)
{
    elems_2[i].display = 'none';
}

har ingen betydelse om det är id='div_2' eller id='id_2' det är bara ett unikt id/namn för just den html-taggen.

Vill du inte dölja input-taggarna? fick den uppfattningen av din första post.
vill du bara byta bakgrund för två olika grupper av input-taggar?

AndreasCMedlem sedan mars 20011 964 inlägg
#8

"Vill du inte dölja input-taggarna? fick den uppfattningen av din första post.
vill du bara byta bakgrund för två olika grupper av input-taggar?"

Ja, helst. Om det går att göra ett script för det. Dock så ligger textboxarna inte på det viset så det går att dela upp i två grupper med <div>-taggar. Men om det går att sätta name eller class eller whatever, bara det funkar.

135 ms totalt · 3 externa anrop · v20260731065814-full.beb2e261
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
132 ms — hämta tråd, inlägg och bilagor (db)