Javascript: html pagina opvragen/invullen

Status
Niet open voor verdere reacties.

general01

Nieuwe gebruiker
Lid geworden
3 aug 2009
Berichten
4
Hallo allemaal,
Mijn excuses voor de verwarrende titel maar ik wist ook niet hoe het anders te omschrijven.
Het gaat om het volgende:
Een map op mijn server bevat 10tallen bestanden, elk heeft een bestandsnaam bestaande uit een aantal cijfers en dan .html
Bijvoorbeeld: 1234.html of 123.html enz.

Deze server is lokaal en alleen een paar huisgenoten en ik hebben toegang tot deze server.
Tot zover de informatie.

Nu de vraag:
Ik wil een pagina maken met daarin een invoerveld en een knop genaamd: "Zoek!".
Als er in het invoerveld een getal wordt ingevoerd en dan op de knop "Zoek!" drukt, dat dan de pagina met dat getal verschijnt.

Als het even kan wil ik dat in een zogenaamde "2 frames" pagina, met in het bovenste frame het zoek/invul gedeelte en dat de gezochte pagina in het 2e (onderste) frame geopend wordt.

Mijn dank zal groot zijn.
 
Met welke reden gebruik je nog frames?
Ondersteunt je server ook PHP?
 
Php is niet mogelijk, de server is een simpele webserver die alleen html verwerken kan.
Waarom frames? Omdat de betreffende pagina's automatisch worden gegenereerd dus er geen extra code bij gezet worden.
IFrames mag ook hoor, zolang dat invulveld/zoekveld maar zichtbaar is.
 
De server heeft geen php dus dat valt af. Voor Javascript Ajax is teveel code nodig omdat de gegenereerde bestanden teveel html hebben. Het gebruik van een <frameset> is echt pre-historie. Blijft over, ook minder fraai, de <iframe> waar niet zoveel Javascript voor nodig is. Het aan de bovenkant houden van het invulveld en de zoekknop gaat eenvoudig met position: fixed; In de bijlage een voorbeeld.

De url in regel 56 zal je even moeten aanpassen in de url die je gebruikt voor jouw webserver.
padding-bottom: 80%; is de hoogte van de iframe, die kan je bijvoorbeeld 120% maken dan wordt de hoogte groter.
 

Bijlagen

  • zoek-tekst.zip
    856 bytes · Weergaven: 23
Laatst bewerkt:
Bedankt!

Bron heel hartelijk bedankt!
Wat jij hebt gemaakt is perfect voor mijn toepassing.
Hier kan ik wel wat mee.
Ook die pijltjes omhoog/omlaag waarmee het getal omhoog of omlaag gezet kan worden is meer dan ik heb gevraagd, hier had ik zelf nog niet aan gedacht. Dus ook dit is een mooie toevoeging.
 
Graag gedaan. Suc6, have fun.
 
Nog een vraagje

Bron:
Zoals ik al eerder zei, ik ben enorm happy met jou oplossing en heb al wat dingetjes aangepast aan mijn wensen maar 1 ding krijg ik niet aangepast.
Het iFrame waarin het bestandje getoond wordt, zou ik wat lager willen hebben. Nu overlapt het met het invoerframe.
Ik heb al verschillende waardes overal in gevuld en er wijzigt inderdaad van alles maar de overlapping blijft.
Kan je me vertellen wat ik moet aanpassen om dat frame wat te kunnen laten zakken zodat die overlapping verdwijnt?

UPDATE: Gevonden!
Code:
.iframe-respons iframe {
    position: absolute; top:500; bottom:0; left:0;
    border: 1px solid grey; width: 100%; [B]height: 97%[/B];

Het vet gemarkeerde gedeelte deed het truukje voor me!
 
Laatst bewerkt door een moderator:
Nu overlapt het met het invoerframe.
Dan heb je ergens iets veranderd op een manier die dit veroorzaakt.
Het percentage kan je het beste op 100% laten staan.
Code:
.iframe-respons {
	position: relative; display: block; height: 0; [B]margin-top: 50px;[/B]
	padding: 0; overflow: hidden; [B]padding-bottom: 80%;[/B]
}
.iframe-respons iframe {
	position: absolute; top:0; bottom:0; left:0;
	border: 1px solid grey; width: 100%; height: 100%;
}

Als je margin-top: 50px; (of een andere waarde) toevoegt maak je meer ruimte tussen de invoerbalk en de iframe.

Als je padding-bottom: 80%; een ander percentage geeft verander je de hoogte van de iframe.
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan