Forum Mjukvara Programmering och digitalt skapande Tråd Inlägg

Få en text-ruta att dyka upp

1
Skriv svar
Permalänk
Medlem ★
●

Få en text-ruta att dyka upp

Hej!
Jag vill ha möjlighet att på min hemsida, när en person bockat i en radio-ruta så ska en formulär-input-text-ruta dyka upp på hemsidan. Hur kan detta åstadkommas på enklast sätt?

Alltså, föreställ er detta:

( ) Val1
( ) Val2

När val2 är ibockad så ska en text-ruta under visas. När val1 är ibockad så ska text-rutan försvinna!

Visa signatur

Min hemsida - Min YouTube-kanal
[Ryzen 9 9900X] - [GIGABYTE X870E AORUS PRO] - [Corsair Vengeance DDR5-6000 128GB] - [Fractal Design North chassi] - [WD Black SN850X 4TB] - [be quiet! Platinum 850W] - [Noctua NH-D15S] - [Dell U4025QW] - [KFA2 RTX 4070 12GB]

Redigera
Citera flera Citera
Permalänk
Medlem
●

Javascript. Dock är jag usel på JS så någon annan får fylla i hur.

Redigera
Citera flera Citera
Permalänk
Medlem
●

jahopp... Jag ska inte säga något exakt, men vi ska resonera lite.

När du klickar på 1 så ska ett fält döljas, när du klickar på 2 så ska det visas.

Då behöver vi en funktion för att dölja/visa ett fält (t.ex. en div).

Det fältet som ska döljas / visas måste ha ett visst id så att vi kan komma åt det, samt att om det ska vara dolt från början så borde det ha display none från början, t.ex. såhär

<div id="mittDoldaLager" style="display: none;">
Denna text är dold nu, men snart visas den
</div>

Vet du hur man inkluderar js-filer till ett html-dokument?

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Nix tyvärr inte, eller menar du att man bara ska använda <!--#include file="blahonga.js"--> ?

Hur skulle denna javascript-funktion se ut menar du? Och hur skulle man koppla den till radio-fältet (fältena)? Har ganska noll koll på javscript tyvärr. Men jag förstår vad du menar med DIV'en.

Visa signatur

Min hemsida - Min YouTube-kanal
[Ryzen 9 9900X] - [GIGABYTE X870E AORUS PRO] - [Corsair Vengeance DDR5-6000 128GB] - [Fractal Design North chassi] - [WD Black SN850X 4TB] - [be quiet! Platinum 850W] - [Noctua NH-D15S] - [Dell U4025QW] - [KFA2 RTX 4070 12GB]

Redigera
Citera flera Citera
Permalänk
Medlem
●

Man ska inte ha javascript i htmlfilerna, utan javascript ska importeras.

En lösning på detta är att skriva såhär:

<script src="/javascripts/sitesearch.js" type="text/javascript"></script>

Den raden lånade jag rakt härifrån forumet - ha en sådan som inkluderar din js-fil där du har all javascriptkod.

Så, då var strukturen avklarad - då behövs bara koden.

Först behöver du ett verktyg för att hitta aktuellt element, denna div i detta fall....

En snabb googling gav mig detta
http://www.aspandjavascript.co.uk/javascript/javascript_api/g...

Nu vill dom göra lite mer saker, de leker med positionen av elementet, det vill inte du göra - men först så letar de fram elementet - sen gör de något med det. Om det är för svårt att urskilja vad som är vad så rekomenderar jag att du googlar lite mer.

söksträngar i stil med "javascript get element" etc borde fungera ganska bra.

När du sedan har hittat ditt element så kan du dölja det eller visa det mha denna enkla kod:

visa: mittElement.style.display = "block";
dölj: mittElement.style.display = "none";

Det ska inte vara så svårt, google har alla svar.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Du har rätt, google är min kompis.

Edit: *suck*... det fungerade ju inte i Firefox... nåja jag får leta vidare.

Senast redigerat
Visa signatur

Min hemsida - Min YouTube-kanal
[Ryzen 9 9900X] - [GIGABYTE X870E AORUS PRO] - [Corsair Vengeance DDR5-6000 128GB] - [Fractal Design North chassi] - [WD Black SN850X 4TB] - [be quiet! Platinum 850W] - [Noctua NH-D15S] - [Dell U4025QW] - [KFA2 RTX 4070 12GB]

Redigera
Citera flera Citera
Permalänk
Medlem
●

gör en funktion, typ getElement(id) som sedan inuti tar reda på vilken browser som används och returnerar det elementet du söker. Det borde vara ganska lätt att ordna en sådan funktion som fungerar i alla vettiga browsers. Sedan är det ju fixat på nolltid att bara sätta display-värdet.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Blev precis färdig med något som verkar fungera i både IE, Firefox samt opera. *nöjd*

<script type="text/javascript">
function doHide(elementId)
{
document.getElementById(elementId).style.display = 'none';
}
function doShow(elementId)
{
document.getElementById(elementId).style.display = 'block';
}
</script>

<input type="radio" name="shipping" value="forskottsbetalning" onclick="doHide('persNr')"> Brev förskottsbetalning<br>
<input type="radio" name="shipping" value="postforskott" onclick="doShow('persNr')"> Brev postförskott<br>

<input type="text" id="persNr" style="display:none;">

Hur smidigt och enkelt som helst!

Visa signatur

Min hemsida - Min YouTube-kanal
[Ryzen 9 9900X] - [GIGABYTE X870E AORUS PRO] - [Corsair Vengeance DDR5-6000 128GB] - [Fractal Design North chassi] - [WD Black SN850X 4TB] - [be quiet! Platinum 850W] - [Noctua NH-D15S] - [Dell U4025QW] - [KFA2 RTX 4070 12GB]

Redigera
Citera flera Citera
Permalänk
Medlem
●

ja! sedan kan du göra det ännu bättre, att den tar en parameter för om den ska dölja eller visa...

function showHide(element, action)
{
...
}

Redigera
Citera flera Citera
Permalänk
Medlem
●

Är det bättre? Skulle mer säga att det har med programmeringsstil att göra.. eller? Har använt båda två sätten men vet inte om jag föredrar nån direkt.. men i totoos fall skulle jag nog iaf döpa den till show och ta en bool som parameter (om det går i js).. att döpa en funktion till showHide säger ju inte riktigt vad den gör. Bäst är nog typ "SetVisible"... men tja, det är ju inte så viktigt störde mig bara på det där "bättre"-ordet.

Visa signatur

Min hemsida: http://www.srekel.net
Pocket Task Force: http://ptf.srekel.net
Kaka e gott! http://kaka.srekel.net

Redigera
Citera flera Citera
Permalänk
Medlem
●

det var inte ordet som var bättre, utan funktionaliteten. Att ha två funktioner som gör samma sak - förutom en halv rad är sällan en bra lösning. Det är lite svårt att generalisera - men i detta fall, en show och en hide kan lätt kombineras.

Sedan kan man ju ta det ännu längre - vilket jag anser att man borde - och det märker man sen om man ska göra fler saker med js, det är ju att separera koden för att ta fram elementet från koden som använder det.

Alltså en getElement-funktion som sedan show/hide använder sig av. För getElement kommer behövas för fler saker sen kanske.

jag har en funktion som heter getElement(id) och en funktion som heter showHideElement...

Blir att se ut ungefär såhär...

function showHideElement(id, action)
{
obj = getElement(id);
if(!obj)
return false;
obj.style.display = action;
}

Ungefär, fast lite fränare...

Men såklart så får ju alla döpa sina prylar till vad de vill

Redigera
Citera flera Citera
Permalänk
Medlem
●

Det var funktionaliteten jag syftade på också

Alltså, om man har en funktion Show() och en Hide(), så är det ju tydligare än en som heter ShowHide(action), tycker jag, tror jag nog. Men det beror ju förstås på sammanhanget om det är värt att ha en inparameter som säger vad en funktion ska göra.

Visa signatur

Min hemsida: http://www.srekel.net
Pocket Task Force: http://ptf.srekel.net
Kaka e gott! http://kaka.srekel.net

Redigera
Citera flera Citera
Permalänk
Medlem
●

jag håller inte med dig, men det är verkligen petitesser iaf.
En normal applikation står nog inför bra mycket större problem och frågeställningar än denna enkla fråga. Men sen kanske det är mitt funktionsnamn som stör dig mest, och att ha något i stil med setElementDisplay eller nåt sånt är väl kanske bättre, men det är lite för tekniskt för min smak.

Jaja... Ös på Andromeda - hoppas du blir js-guru, för js är extremt roligt att arbeta med, helt klart en favorit för min del.

Redigera
Citera flera Citera
1
Skriv svar