[JS/PHP] Variabelen naar popup via POST

[Righteye]

Ben behoorlijk thuis in PHP en MySQL, maar wil nu iets doen waarvoor ik eigenlijk javascript moet gaan gebruiken. Het kan wel via PHP, maar is een beetje omslachtig (zie verderop). Ik ben helaas een javascript-noob.

Ben bezig met een soort content management systeem voor een homepage.
Heb een schitterend PHP documentje dat na het invoeren van een artikel ID, deze opzoekt in een MySQL dbase en een wijzigings-formulier voor dat artikel weergeeft. Het submitten van deze pagina zorgt ervoor dat het record in de MySQL database geupdate wordt. Vrij standaard dus.

Het probleem:
In dat 'wijzig-artikel' formulier moet een preview knop komen, waarmee de gebruiker kan zien hoe zijn wijzigingen uitpakken.

De preview pagina is in feite niets anders als de normale homepage, waarbij variabelen niet uit de database gerukt worden, maar doorgepassed worden vanaf de 'wijzig-artikel'pagina. Het gaat om de velden: paginasoort, titel en inhoud.
'Paginasoort' en 'titel' zijn niet al te lange VARCHAR en zodoende gewoon via een GET door te passen. Inhoud daarintegen is een extreem lange TEXT variabele met daarin HTML. Deze kan duidelijk niet via GET (oftwel index.php?inhoud=$inhoud) gepost worden.

de preview knop is nu iets in de trant van

code:

<input type='button' value='Preview' onClick=\"OpenWindow
('http://localhost/index.php?preview=true'+'&soort=
'+document.myForm.soort.value+'&titel=
'+document.myForm.ptitel.value+'&inhoud=
'+document.myForm.inhoud.value);\">

en het stukje javascript:

code:

<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
function OpenWindow(url) {
link = 
window.open(url, "Link","toolbar=1,location=1,width=800,height=600");
}
// -->
</SCRIPT>

Maar goed dit werkt dus niet aangezien het URL verschikkelijk lang wordt en halverwege afkapt vanwege de $inhoud.

Ik zit nu aan een alternatieve oplossing te denken (m.b.v. een tijdelijk record in een previewtabel in de MySQL dbase en deze dan in de previewpagina ophalen).

Mij vragen:
Kan ik een pop-up openen in een nieuw venster en in dat venster de variabelen uit het formulier weergeven, zonder GET te gebruiken (dus variabelen niet via het URL door te geven) ?

Zo ja, hoe pak ik dat aan ? (links naar relevante pagina's zijn welkom).
Oftwel hoe stuur ik die variabelen naar mijn popup en hoe tover ik ze daar weer om naar PHP variabelen ($inhoud bijv.)

Ik zoek me al een tijdje helemaal kapot naar een oplossing en na uren van pielen met voorbeeldscripts e.d. kom ik er niet uit.

[ Voor 6% gewijzigd door Righteye op 26-07-2004 12:59 ]

[gorgi_19]

Je gaat uit van Javascript, maar plaatst het in Programming & Webscripting?

>> Webdesign & Graphics

[Righteye]

Oh...sorry....d8 dat dit meer programmeren was ipv. webdesign en graphics...zodoende. Snap niet wat het doorgeven van variabelen met webdesign en graphics te maken heeft, maar goed.....

[gorgi_19]

Righteye schreef op 26 juli 2004 @ 13:04:
Oh...sorry....d8 dat dit meer programmeren was ipv. webdesign en graphics...zodoende. Snap niet wat het doorgeven van variabelen met webdesign en graphics te maken heeft, maar goed.....

Mijn schuld, had iets duidelijker kunnen zijn. Zie P&W FAQ - HTML / javascript /css, etc.... Alles wat clientside is, HTML, Javascript, etc. hoortin Webdesign & Graphics thuis

[André]

HTML:

<form method="post" target="scherm" onsubmit="window.open('', 'scherm');">

Werk dit? Ik heb het niet getest.

[ Voor 60% gewijzigd door André op 26-07-2004 13:17 ]

[Righteye]

Ja dit werkt wel, maar alleen de popup moet verschijnen bij het aanklikken van de 'Preview' knop aan de rest van de pagina moet niets veranderen. Daarbij heeft het formulier heeft 2 knoppen 'Preview' en 'Submit' (voor opslaan van de variabelen, zie onder).

code:

<input type='submit' name='submit1' onClick=\"document.form.action='$pgurl'\" value='Opslaan van de gegevens'>

ik kan dus geen actions etc aan de <form> tag toevoegen aangezien ze dan invloed hebben op beide knoppen.

[ Voor 39% gewijzigd door Righteye op 26-07-2004 13:17 ]

[crisp]

André schreef op 26 juli 2004 @ 13:10:

HTML:

<form method="get" target="scherm" onsubmit="window.open('', 'scherm');">

Werk dit? Ik heb het niet getest.

ja, dat is de manier, maar dan wel method=post anders heeft TS alsnog het probleem dat de url te lang wordt

[ggvw]

Je zou gebruik kunnen maken van sessies of cookies die je weer ophaalt in je popup.

[André]

crisp schreef op 26 juli 2004 @ 13:16:
[...]

ja, dat is de manier, maar dan wel method=post anders heeft TS alsnog het probleem dat de url te lang wordt

Dat bedoelde ik ook

[Righteye]

ggvw schreef op 26 juli 2004 @ 13:17:
Je zou gebruik kunnen maken van sessies of cookies die je weer ophaalt in je popup.

Klopt, maar dan kies ik toch liever vor het dumpen van de data in een MySQL tabel.
Ehh...zeg het wel zo hard...maar sessies ? hoe gaat dat ?

[André]

ggvw schreef op 26 juli 2004 @ 13:17:
Je zou gebruik kunnen maken van sessies of cookies die je weer ophaalt in je popup.

Je kunt ook gewoon simpel vanuit de popup je formulier uitlezen, zo kun je prima previewen. En voor de submit gebruik je dan mijn eerder gegeven manier.

[Righteye]

André schreef op 26 juli 2004 @ 13:19:
[...]

Je kunt ook gewoon simpel vanuit de popup je formulier uitlezen, zo kun je prima previewen. En voor de submit gebruik je dan mijn eerder gegeven manier.

Ok...hoe doe ik dat dan ? Ben een echte JS noob......
Oftwel hoe lee ik in de popup de variabelen uit mijn 'wijzig artikel' pagina ?

[ Voor 13% gewijzigd door Righteye op 26-07-2004 13:22 ]

[André]

Vanuit de popup:

JavaScript:

opener.document.forms["formulier"].elements["veld"].value;

Of als je form een id heeft:

JavaScript:

opener.document.getElementById("formulier").elements["veld"].value;

[ Voor 47% gewijzigd door André op 26-07-2004 13:22 ]

[Righteye]

Ok....heb een JS scriptje gemaakt, dit zit nu in de popup:

code:

<script language="JavaScript" type="text/javascript">
opener.document.forms["myForm"].elements["psoort"].value;
opener.document.forms["myForm"].elements["ptitel"].value;
opener.document.forms["myForm"].elements["pinhoud"].value;
</script>

Hoe krijg ik de waardes nou in $psoort (van PHP) of uberhaupt op mijn sherm ?
Sorry dat jullie me handje zo moeten vasthouden, maar ben helemaal nieuw in dit javascript gebeuren.

[André]

Op je scherm is simpel, zet er een document.write() omheen:

JavaScript:

document.write(opener.document.forms["myForm"].elements["psoort"].value);

Het script wel in je body zetten natuurlijk

[Thijsmans]

Javascript en PHP kunnen niet onderling 'praten' (het posten van forms door JS daargelaten, evenals URL-ongein etc.). Je zal dus zoiets moeten gebruiken:

JavaScript:

myForm = opener.document.forms['myForm'].elements;
document.write( myForm['psoort'].value );
document.write( myForm['ptitel'].value);
// etc

[Verwijderd]

Wat is er mis met

HTML:

<form method="post" target="_blank">

[André]

Verwijderd schreef op 26 juli 2004 @ 13:44:
Wat is er mis met

HTML:

<form method="post" target="_blank">

Daar kun je geen features meegeven aan je nieuwe window

[Righteye]

heb nu dit in de body van mijn popup en er verschijnt helemaal niets......

code:

<script language="JavaScript" type="text/javascript">
document.write(opener.document.forms["myForm"].elements["psoort"].value);
document.write(opener.document.forms["myForm"].elements["ptitel"].value);
document.write(opener.document.forms["myForm"].elements["pinhoud"].value);
</script>

de preview knop nog een keer:

code:

<input type='button' value='Preview' onClick=\"OpenWindow('$vurl$VID$wid&preview=true');\">

Snap ook eigenlijk niet hoe JS in de popup weet wat er aangepast is als er niets gesubmit worden (type='submit' heeft geen effect btw..). Snap er eigenlijk helemaal geen ruk van...

Heb net document.write('<font color="blue">This is a document write in.</font>');
toegevoegd van een tutorial page.....werkt ook niet......doe iets fundamenteels fout.

Werkt perfect !

[ Voor 46% gewijzigd door Righteye op 26-07-2004 14:00 ]

[Verwijderd]

André schreef op 26 juli 2004 @ 13:49:
Daar kun je geen features meegeven aan je nieuwe window

Tja, daar kan ik niet tegenop.

Ik kan er sowieso niet zo goed met m'n kop bij dat het in een apart venster moet. Wat voegt dat nou toe, behalve een wagonlading aan implementatie- en usability-problemen?

[André]

Je gebruikt een } waar een ) moet staan, misschien is dat het probleem?
En heb je misschien iets online staan?

Verwijderd schreef op 26 juli 2004 @ 13:56:
[...]

Tja, daar kan ik niet tegenop.

Ik kan er sowieso niet zo goed met m'n kop bij dat het in een apart venster moet. Wat voegt dat nou toe, behalve een wagonlading aan implementatie- en usability-problemen?

Volgens mij gaat het hem meer om een preview scherm die hij wil laten zien.

[ Voor 79% gewijzigd door André op 26-07-2004 13:58 ]

[Righteye]

André - YOU RULE !!! werkt perfect, dankje

Nou alleen nog die vars terugzetten naar PHP vars en dan ben ik klaar (moet er nog wat dingetjes op uitvoeren).

[Bosmonster]

Je kunt toch gewoon naar een popup posten? onsubmit een window.open() en dan als target de name van dat nieuwe venster.

Dat dat alleen voor de preview moet gebeuren is een kwestie van een beetje javascript dan lijkt me?

[André]

Bosmonster schreef op 26 juli 2004 @ 14:01:
Je kunt toch gewoon naar een popup posten? onsubmit een window.open() en dan als target de name van dat nieuwe venster.

Dat dat alleen voor de preview moet gebeuren is een kwestie van een beetje javascript dan lijkt me?

Die oplossingen zijn ook al genoemd

[Bosmonster]

Ah.. dan snap ik al dat moeilijke gedoe niet

Voordeel van gewoon POSTEN ipv met javascript kloten is dat je voor je preview waarschijnlijk je zelfde routines kan gebruiken als die je normaal in je site zou gebruiken.

Alle serverside bewerkingen kun je zo wel vergeten (UBB-bewerkingen bijvoorbeeld om maar iets te noemen).

[ Voor 76% gewijzigd door Bosmonster op 26-07-2004 14:07 ]

[Righteye]

Bosmonster schreef op 26 juli 2004 @ 14:01:
Je kunt toch gewoon naar een popup posten? onsubmit een window.open() en dan als target de name van dat nieuwe venster.

Dat dat alleen voor de preview moet gebeuren is een kwestie van een beetje javascript dan lijkt me?

Andere oplossingen zijn nog steeds welkom ik snap namelijk wel ongeveer wat je bedoelt, maar heb geen idee hoe het uit te voeren...

[Righteye]

Bosmonster schreef op 26 juli 2004 @ 14:05:
Ah.. dan snap ik al dat moeilijke gedoe niet

Voordeel van gewoon POSTEN ipv met javascript kloten is dat je voor je preview waarschijnlijk je zelfde routines kan gebruiken als die je normaal in je site zou gebruiken.

Alle serverside bewerkingen kun je zo wel vergeten (UBB-bewerkingen bijvoorbeeld om maar iets te noemen).

Zou je kunnen uitleggen hoe ik dit dan via een POST methode doe ?
Zou wel veel voordelen opleveren.

[André]

Door de target van het formulier op _blank te zetten als er gepreviewed moet worden, dus ongeveer zo:

HTML:

<input type="button" value="Preview" onclick="this.form.target='_blank'; this.form.action='preview.php'">
<input type="submit" value="Verstuur" onclick="this.form.target='_self'; this.form.action='opslaan.php'">

Edit:
tip van Blues verwerkt

[ Voor 35% gewijzigd door André op 26-07-2004 14:26 ]

[Verwijderd]

André: je kunt ook this.form gebruiken. (edit: als de buttons in het formulier staan, natuurlijk )

Righteye: Ik wil niet vervelend zijn, maar probeer eens uit te leggen waarom je een popupvenster wil, i.p.v. een nieuwe pagina. Ik snap die keuze namelijk absoluut niet.

Als je toch perse met JavaScript aan de gang wil gaan, doe die preview dan in dezelfde pagina, bij het formulier. Dan heeft het toegevoegde waarde.

[ Voor 8% gewijzigd door Verwijderd op 26-07-2004 14:20 ]

[Righteye]

Ik wil een popupvesnter omdat wat er gepreviewd moet worden een volledige pagina is incl. menu etc. De gebruiker krijgt als preview dus de betreffende gewijzigde pagina te zien met menu etc. De homepage is 1 grote geneste tabel die opgebouwd wordt uit includes. Het content management gedeelte is fysiek gescheiden van de homepage (ander URL + plek). Sommige pagina's zijn erg lang en daaronder nog een keer het wijzig formulier (zoals op GoT) is geen optie, dus maar een popup.

André: je Preview knop doet helemaal niets...... ?

[ Voor 7% gewijzigd door Righteye op 26-07-2004 14:28 ]

[Denhomer]

Righteye schreef op 26 juli 2004 @ 14:25:


André: je Preview knop doet helemaal niets...... ?

Type van de preview moet ook submit zijn natuurlijk ipv button

[ Voor 3% gewijzigd door Denhomer op 26-07-2004 14:30 ]

[André]

Denhomer schreef op 26 juli 2004 @ 14:29:
[...]


Type van de preview moet ook submit zijn natuurlijk ipv button

Klopt

[Righteye]

Ok....werkt prima, nu wil ik als laatste alleen nog realiseren dat dat nieuwe venster dat open gaat 800x x600 pixels wordt. Gokje: iets met open.window ? of krijgen we dan oude problemen terug, dat we geen POST kunnen gebruiken ?

[André]

HTML:

<input type="submit" value="Preview" onclick="open('', 'scherm', 'width=800, height=600'); this.form.target='scherm'; this.form.action='preview.php'">
<input type="submit" value="Verstuur" onclick="this.form.target='_self'; this.form.action='opslaan.php'">

Zo?

[ Voor 62% gewijzigd door André op 26-07-2004 14:48 ]

[Righteye]

Ja, werkt perfect....zal er zelf nog effe een URL balk e.d. bijzetten.
Hmm...valt me iets raars op.....bij het openen van de popup laat ie heelf even mijn inlogpagina zien (oftwel de start pagina van het CMS gedeelte). Komt dit door de '' bij open ('', 'scherm') ?

edit:

Yep...na het invullen van about:blank geen problemen meer.

Iedereen vet bedankt voor de snelle en goeie feedback. GoT RuLeZ !

[ Voor 27% gewijzigd door Righteye op 26-07-2004 14:56 ]

[André]

Dat zou kunnen als er een base href in je pagina staat, dan is de url eigenlijk niet '' maar het pad uit je base href.