Html form waarde doorgeven aan input type (date)

[wigwam]

Ik heb een (klein) probleem met het goed doorgeven van een form waarde aan een ander input type veld in mijn html pagina.

Wat ik probeer te maken is dat er een button op mijn webpagina verschijnt (zie het form code stuk --> code 3) en zodra de button ingedrukt wordt de waarde in mijn input type box terecht komt (code 1). In dit geval de juiste datum en tijd.

In mijn voorbeeld form code (code 3) stuk werkt dat inprincipe goed. Er verschijnt netjes een button en een tekst veld, waar de waarde netjes in verschijnt, na het indrukken van de button.

Maar zodra ik de form (code 3) in mijn input type box (code 1) plak werkt het spontaan niet meer? Ik heb overal <tr> en <td> toegevoegd maar dat lijkt niet het probleem te zijn....

code:

////////////// mijn input type box (code 1)
<tr>
<td><label class="formleft" for="OplosDatum">OplosDatum</label></td>
<td><input type="date" name="OplosDatum" size="48" value="<?php echo $news['OplosDatum'] ?>"></td>
</tr>

code:

///////////// php stukje voor het ophalen van de huidige datum (code 2)
<?php   
        $datum = date('Y-m-d H:i:s');
        $datum_knop = date('Y-m-d H:i:s');
    ?>

code:

//////////// form stukje met button voor het doorgeveven van een (datum en tijd) waarde (code 3)
<form name="bijwerken">
<tr>
<td><input type="text" value="" name="textbox"></td>
<td><input type="hidden" value="<?php echo $datum_knop ?>" name="tijd_box"></td>
<td><input type="button" value="Bijwerken" onClick="document.bijwerken.textbox.value=(document.bijwerken.tijd_box.value)"></td>
</tr>
</form>

[ Voor 3% gewijzigd door wigwam op 19-08-2009 14:07 . Reden: code bijgewerkt ]

[Da Weef]

Nogal onduidelijk verhaal en misschien moet je even code-tags gebruiken... Laat even sowieso (ook) de totale code zien van wat er nu niet werkt, dat is nu lastig te achterhalen.

Mijn eerste ingeving zou zijn dat je met een client-side form actie een server side functie wilt aanroepen, maar zoals ik heb aangegeven komt het hele verhaal niet echt helder bij me over.

[wigwam]

Da Weef schreef op woensdag 19 augustus 2009 @ 13:34:
Nogal onduidelijk verhaal en misschien moet je even code-tags gebruiken... Laat even sowieso (ook) de totale code zien van wat er nu niet werkt, dat is nu lastig te achterhalen.

Mijn eerste ingeving zou zijn dat je met een client-side form actie een server side functie wilt aanroepen, maar zoals ik heb aangegeven komt het hele verhaal niet echt helder bij me over.

Ik heb het nu tussen [code] blokken gezet. Ik heb tevens even een voorbeeld gemaakt van mijn code (http://wigwam.ath.cx/tweakers/index.html) een voorbeeld zegt meer dan 1000 woorden Als ik dus op de button klik wil ik dus dat de bovenste tekst verandert....

[The_Ghost16]

je kunt toch gewoon een client event mee geven aan de click van de button die de javascript Date toont in de gewenste textbox?

Edit:
Met behulp van deze site zie je hoe je de huidige datum kunt tonen met javascript http://www.tizag.com/javascriptT/javascriptdate.php

[ Voor 36% gewijzigd door The_Ghost16 op 19-08-2009 14:14 ]

[Mike2k]

Als ik in je voorbeeld kijk, zie ik dat de php code gewoon als html getoond wordt. Ik vermoed dus dat de php parser niet op je server geinstalleerd is...Kan je dit nakijken ?

[wigwam]

Fastex schreef op woensdag 19 augustus 2009 @ 14:15:
Als ik in je voorbeeld kijk, zie ik dat de php code gewoon als html getoond wordt. Ik vermoed dus dat de php parser niet op je server geinstalleerd is...Kan je dit nakijken ?

sorry dit is een server die geen php ondersteund (sorry had ik er even bij moeten zetten) Mijn echte server krijg ik niet de php parse fout (het is niet echt een fout )

[Da Weef]

Fastex schreef op woensdag 19 augustus 2009 @ 14:15:
Als ik in je voorbeeld kijk, zie ik dat de php code gewoon als html getoond wordt. Ik vermoed dus dat de php parser niet op je server geinstalleerd is...Kan je dit nakijken ?

http://wigwam.ath.cx/tweakers/index.html

Heheh, php extensie wil ook helpen... Maar in principe kan prima wat je hier wilt doen, maar dan moet je wel naar het juiste element verwijzen... Je verwijst met de actie nu alleen naar het element textbox.

Verder moet je rekening houden met het feit dat de datum en tijd die worden weergegeven niet de tijd van klikken zijn, maar van het laden van de pagina (wanneer de server side code wordt uitgevoerd).

[wigwam]

The_Ghost16 schreef op woensdag 19 augustus 2009 @ 14:12:
je kunt toch gewoon een client event mee geven aan de click van de button die de javascript Date toont in de gewenste textbox?

Edit:
Met behulp van deze site zie je hoe je de huidige datum kunt tonen met javascript http://www.tizag.com/javascriptT/javascriptdate.php

De tijd neerzetten is het probleem niet ( schijnbaar behalve op mijn test server dan )

Het enige wat niet lukt is de tekst in het bovenste invoer vakje te krijgen....de rest werkt

[kluyze]

Ik heb het gevoel dat je php code aan de client zijde probeert te runnen, als je php code wilt laten uitvoeren zal je de pagina moeten herladen aangezien je php code alleen door de server kan afgehandeld worden. Je server moet dus ook php herkennen en kunnen uitvoeren.

Je zou dat met ajax kunnen oplossen om geen herladen van de pagina te krijgen, maar ik denk dat in jouw geval het beter is om gewoon alles in javascript te doen.

Ow, en ook dat zie ik nu, misschien is het een typfout hier, maar alle php code moet eindigen met een ; (puntcomma) anders gaat je php parser daar een fout op geven.

[ Voor 16% gewijzigd door kluyze op 19-08-2009 14:26 ]

[wigwam]

Da Weef schreef op woensdag 19 augustus 2009 @ 14:23:
[...]


http://wigwam.ath.cx/tweakers/index.html

Heheh, php extensie wil ook helpen... Maar in principe kan prima wat je hier wilt doen, maar dan moet je wel naar het juiste element verwijzen... Je verwijst met de actie nu alleen naar het element textbox.

Verder moet je rekening houden met het feit dat de datum en tijd die worden weergegeven niet de tijd van klikken zijn, maar van het laden van de pagina (wanneer de server side code wordt uitgevoerd).

code:

<form name="bijwerken2">
<tr>
<td><input type="text" value="" name="OplosDatum"></td>
<td><input type="hidden" value="<?php echo $datum_knop ?>" name="tijd_box"></td>
<td><input type="button" value="Bijwerken2" onClick="document.bijwerken2.OplosDatum.value=(document.bijwerken2.tijd_box.value)"></td>
</tr>
</form>

maar als ik ipv textbox --> OplosDatum meegeef werkt het ook niet

[The_Ghost16]

HTML:

<html>
<?php   $datum = date('Y-m-d H:i:s');
        $datum_knop = date('Y-m-d H:i:s');
?>
<form name="bijwerken">
<table>
<tr>
<td><label class="formleft" for="OplosDatum">OplosDatum</label></td>
<td><input type="date" name="OplosDatum" size="48" value="<?php echo $news['OplosDatum'] ?>"></td>
</tr>


<tr>
<td><input type="text" value="" name="textbox"></td>
<td><input type="hidden" value="<?php echo $datum_knop ?>" name="tijd_box"></td>
<td><input type="button" value="Bijwerken" onClick="document.bijwerken.OplosDatum.value=(document.bijwerken.tijd_box.value)"></td>

</tr>
</table>
</form>

</html>

Probeer bovenstaande code eens.

Heb wat veranderd aan de positie van de form, de onclick iets veranderd en even je tables netjes geopend en geclosed.

[Da Weef]

HTML:

<html>
<?php   $datum = date('Y-m-d H:i:s');
        $datum_knop = date('Y-m-d H:i:s');
?>
<form name="bijwerken">
<label class="formleft" for="OplosDatum">OplosDatum</label>
<input type="date" name="OplosDatum" size="48" value="Wat je hier wilt hebben">
<br />
<input type="text" value="" name="textbox">
<input type="hidden" value="<?php echo $datum_knop ?>" name="tijd_box">
<input type="button" value="Bijwerken" onClick="document.bijwerken.OplosDatum.value=(document.bijwerken.tijd_box.value);document.bijwerken.textbox.value=(document.bijwerken.tijd_box.value);">
</form>

</html>

EDIT: Heheh, ik was te laat zie ik...

Verder, zoals eerder aangegeven, laat deze client-side methode enkel de tijd zien bij binnekomt, niet de tijd van klikken. Een veel mooiere oplossing is een serverside form action:

PHP:

<html>
<?php   $datum = date('Y-m-d H:i:s');
        $datum_knop = date('Y-m-d H:i:s');
?>

<form name="bijwerken" method="post">
<label class="formleft" for="OplosDatum">OplosDatum</label>
<?php 
if (!$_POST['submit']){
echo '<input type="date" name="OplosDatum" size="48" value="Druk eens op mn knopje">';}
else{
echo '<input type="date" name="OplosDatum" size="48" value="' . $datum_knop . '">';}
?>
<br />
<input type="text" value="<?php echo $datum_knop; ?>" name="textbox">
<input type="submit" class="text" name="submit" value="Bijwerken">
</form>
</html>

[ Voor 40% gewijzigd door Da Weef op 19-08-2009 15:09 ]

[kluyze]

Ok, enkele testen gedaan. Ik denk dat ik het heb, als ik door heb wat je bedoelt. Volgens mij wil je met die knop de inhoud/value van je date input veld aanpassen.
Als ik het formaat van de datum aanpas dan lijkt het te lukken, dus alleen de datum, niet de tijd.

Edit: @Da Weef
Het probleem is denk ik dat een input type=date een html 5 element is? En browsers als opera geven daar een dropdownbox met een kalender. Als je daar de value wil van aanpassen met een javascript functie zal je het juiste formaat moeten gebruiken.
Firefox en IE8 geven in mijn geval altijd een goed resultaat, opera die laat een leeg vakje zien als het datum formaat niet juist is. Ook tekst kan niet weergegeven worden met het input date element.

[ Voor 47% gewijzigd door kluyze op 19-08-2009 15:15 ]

[Da Weef]

Tja, dat is inderdaad een bijkomend probleem: type 'date' input field eet eigenlijk enkel formaat yyyy-mm-dd maar volgens mij was probleem van TS dat hij het helemaal niet aan de praat kreeg.

[wigwam]

Da Weef schreef op woensdag 19 augustus 2009 @ 15:34:
Tja, dat is inderdaad een bijkomend probleem: type 'date' input field eet eigenlijk enkel formaat yyyy-mm-dd maar volgens mij was probleem van TS dat hij het helemaal niet aan de praat kreeg.

Het werkt inderdaad nog steeds niet helemaal? Ik gebruik overigens zelf IE8 Het probleem was (en is nog steeds) dat ik geen waarde terug krijg in mijn veld. Jullie hadden het over een kalender functie. Hoe werkt dat precies? krijg ik dan een kalender te zien waar ik een datum kan selecteren?

Ik gebruik nu die date functie/object omdat anders mysql de waarde niet herkent en hem ook niet wegschrijft in de database (via een update query) Dit is ook de reden dat ik het via een knop wil oplossen. Hierdoor heb ik altijd een waarde die mysql slikt

De onderstaande code werkt tot dat ik hem tussen de rest van mijn code plak. Het vreemde is als ik op mijn submit button klik de waardes van $news['OplosDatum'] ook niet worden doorgeven aan mijn update query . dit terwijl de waarde wel nu op mijn scherm verandert

code:

<form name="bijwerken">
<table>
<tr>
<td><label class="formleft" for="OplosDatum">OplosDatum</label></td>
<td><input type="date" name="OplosDatum" size="48" value="<?php echo $news['OplosDatum'] ?>"></td>
</tr>

<tr>
<td><input type="hidden" value="" name="textbox"></td>
<td><input type="hidden" value="<?php echo $datum_knop; ?>" name="tijd_box"></td>
<td><input type="hidden" value="<?php $news['OplosDatum'] = $datum_knop; ?>" name="tijd_box2"></td>
<td><input type="button" value="Bijwerken" onClick="document.bijwerken.OplosDatum.value=(document.bijwerken.tijd_box.value)"></td>
</tr>

</table>
</form>

[ Voor 34% gewijzigd door wigwam op 19-08-2009 15:54 ]

[wigwam]

Ik ben er achter waar het probleem zit. Het zit hem in deze code regel. Mag ik de form action niet combineren met een andere form?

<form action="storing_list.php" method="POST">


Ik heb de oplossing

Als je er dit van maakt:

<form action="storing_list.php" method="POST" name="bijwerken">

werkt het

[ Voor 27% gewijzigd door wigwam op 19-08-2009 17:00 . Reden: oplossing ]

[moozzuzz]

Eigenlijk denk ik dat je best gewoon het form verstuurd en op de server je datum berekend en dan in je MySQL-query dropt... nu maak je een heel eigenaardige omweg!

Je hebt zowat alles al dat je nodig hebt:

code:

<FORM>...

PHP:

/* clean data so it is secure to drop into an MySQL-query */
...
/* query */
$q = "INSERT INTO foo (k1, k2, datumke) VALUES ($k1, $k2, NOW());";
/* of */
$datum = date('Y-m-d H:i:s');
$q = "INSERT INTO foo (k1, k2, datumke) VALUES ($k1, $k2, $datum);";

[Da Weef]

Jullie hadden het over een kalender functie. Hoe werkt dat precies? krijg ik dan een kalender te zien waar ik een datum kan selecteren?

Sommige browsers (zoals Opera) hebben dat ingebouwd. Voor andere browser kun je eenzelfde effect creeren met een (voorgekauwd) javascriptje

[wigwam]

Da Weef schreef op woensdag 19 augustus 2009 @ 17:39:
[...]


Sommige browsers (zoals Opera) hebben dat ingebouwd. Voor andere browser kun je eenzelfde effect creeren met een (voorgekauwd) javascriptje

Bedankt voor de link

[wigwam]

moozzuzz schreef op woensdag 19 augustus 2009 @ 17:29:
Eigenlijk denk ik dat je best gewoon het form verstuurd en op de server je datum berekend en dan in je MySQL-query dropt... nu maak je een heel eigenaardige omweg!

Je hebt zowat alles al dat je nodig hebt:

code:

<FORM>...

PHP:

/* clean data so it is secure to drop into an MySQL-query */
...
/* query */
$q = "INSERT INTO foo (k1, k2, datumke) VALUES ($k1, $k2, NOW());";
/* of */
$datum = date('Y-m-d H:i:s');
$q = "INSERT INTO foo (k1, k2, datumke) VALUES ($k1, $k2, $datum);";

De insert oplossing had ik eerst ook. Maar ik wil graag dat de gebruiker kiest en niet dat het systeem automatisch de waarde invult. Maar het werkt nu zoals ik het bedacht had. Heel erg bedankt!