datum plus een week kopiëren

Status
Niet open voor verdere reacties.

Frenske123

Terugkerende gebruiker
Lid geworden
2 jul 2007
Berichten
1.260
Hallo,

Ik wil de datum van input veld 1 (datum_1) kopiëren naar inputveld 2 (datum_2)

Code:
        	 <script type="text/javascript">
                  function copydatum(f) {
                      f.datum_2.value = f.datum_1.value; 
                  }				  
				 </script>

Het kopiëren lukt maar niet de ene week erbij

kwam nog volgende tegen , maar geen idee hoe toe te passen
Code:
//		  var now = new Date();
//now.setDate(now.getDate()+7);
//alert(now);
 
RE: Het kopiëren lukt maar niet de ene week erbij
Het is niet duidelijk wat je bedoelt met: die ene week erbij
Code:
<input id="datum1" type="text" value="">
<input id="datum2" type="text" value="">
<script>
function copydatum(id1, id2) {
   var datum = document.getElementById(id1).value;
   document.getElementById(id2).value = datum;
}
copydatum("datum1", "datum2");
</script>
 
Laatst bewerkt:
In datum_1 veld vul ik dus datum in,

In datum_2 veld wordt dan de van datum_1 gekopieerd met

Code:
 <input onfocus="copydatum(this.form)" type="date" id="datum_2" name="datum_2" >

Nou wil ik een week erbij indien mogelijk, dus vul ik in veld 1 18-08-2017 in moet in veld 2 25-08-2017

type type="date" geef de datum in in NL formaat met datum pikker , het wordt als 2017-08-18 weggeschreven (database is ook de (bedoeling)
 
Je kan type="date" gebruiken maar dit is qua opmaak niet altijd even mooi.
Hieronder een functie met datumvalidatie.
Code:
function dagenAfBij(beginDatum, dagen) {
    var jmd = beginDatum.split('-');
    var isDatum = new Date(jmd[0], jmd[1] - 1, jmd[2]);
    if (isDatum && (isDatum.getMonth() + 1) == jmd[1]) {
        var eindDatum = new Date(Date.parse(jmd[1] +'/'+ jmd[2] +'/'+ jmd[0] +' UTC') + (dagen * 86400000));
        return eindDatum.toISOString().slice(0, 10);
    }
    return false;
}

var datum1 = "2017-08-21";
var datum2 = dagenAfBij(datum1, 7);

if (datum2 !== false) {
    alert("Nieuwe datum is " + datum2);
} else {
    alert("Onjuiste datum ingevoerd");
}
Het getal 86400000 in de functie is het aantal milliseconden van 1 dag (24 x 60 x 60 x 1000)
Je kan het script zelf combineren met document.getElementById(___).value

(edit) aangepast zodat yyyy-mm-dd de notatie is.

Suc6. Have fun.
 
Laatst bewerkt:
Beste Bron.

bedankt voor je hulp.

Ik weet alleen niet hoe ik dit in in inputveld moet toepassen, nu is het een alert.

Ik vul dus in input 1 een willekeurige datum in bijv. 28-08-2017 dan zal in inputveld 2 na de onblur 04-09-2017 moeten verschijnen.
 
Haha, wellicht is een tutorial Javascript iets voor je :d
Haal dat stukje met die alerts weg en laat de function dagenAfBij ongewijzgd.
Code:
<input id="datum_1" type="text" value="" onblur="setDatum('datum_2', this.value, 7);">
<input id="datum_2" type="text" value="">
<script>
// hier staat function dagenAfBij(beginDatum, dagen)
// 
function setDatum(id, datum1, dagen) {
    var datum2 = dagenAfBij(datum1, dagen);
    if (datum2 !== false) {
        document.getElementById(id).value = datum2;
    }
}
</script>
Suc6. Have fun.
 
Beste Bron,

Het werkt goed bedankt.

Achteraf zou het handiger zijn als de onblur (of iets beters) op het 2e veld zou liggen , bijv. een mouseOver op 2e veld die dan datum_1 naar datum_2 kopieert.
 
Wijzig de html en maak een nieuwe functie copyDatum.
Code:
<input id="datum_1" type="text" value="">
<input id="datum_2" type="text" value="" onfocus="copyDatum('datum_1', 'datum_2', 7);">

function copyDatum(vanId, naarId, dagen) {
    var datum1 = document.getElementById(vanId).value;
    var datum2 = dagenAfBij(datum1, dagen);
    if (datum2 !== false) {
        document.getElementById(naarId).value = datum2;
    }
}
Je kan uiteraard ook andere events gebruiken maar hou er rekening mee dat een touchscreen geen muis heeft.

Noot: Netter is het om de addEventListener te gebruiken omdat er dan een event handler wordt toegevoegd zonder dat de bestaande wordt overschreven. Ervan uitgaand dat het geen complexe toepassing is zal dit geen probleem zijn.
 
Laatst bewerkt:
Kan het zijn dat er iets aan de 2e functie aangepast moet worden, bij mij werkt het niet.
 
De volgorde is nu
Code:
<script>
function dagenAfBij(beginDatum, dagen) {
   ...
}
function copyDatum(vanId, naarId, dagen) {
   ...
}
</script>
De functie setDatum wordt niet meer gebruikt.
De datum wordt gekopieerd als je datum_2 de focus geeft en datum_1 een geldige datum is.
Gebruik de notatie 2017-08-29
 
Laatst bewerkt:
Jou code werkt

Uiteindelijk heb ik 5 velden , dat werkte goed met de onblur , maar omdat dan het 2e veld altijd wordt ingevuld wilde ik wat anders.

Ik heb nu niet werkend

Code:
  <input id="datum_1" type="date" value="" name="datum_1">
  
<input id="datum_2" type="date" value="" name="datum_2" onfocus="copyDatum('datum_1', 'datum_2', 7);">

<input id="datum_3" type="date" value="" name="datum_3" onfocus="copyDatum('datum_2', 'datum_3', 7);">

<input id="datum_4" type="date" value="" name="datum_4" onfocus="copyDatum('datum_3', 'datum_4', 7);">

<input id="datum_5" type="date" value="" name="datum_5" onfocus="copyDatum('datum_4', 'datum_5', 7);">


        <script type="text/javascript">
function copyDatum(vanId, naarId, dagen) {
    var datum1 = document.getElementById(vanId).value;
    var datum2 = dagenAfBij(datum1, dagen);
    if (datum2 !== false) {
        document.getElementById(naarId).value = datum2;
    }
}
// 
function setDatum(id, datum1, dagen) {
    var datum2 = dagenAfBij(datum1, dagen);
    if (datum2 !== false) {
        document.getElementById(id).value = datum2;
    }
	}

	function setDatum(id, datum2, dagen) {
    var datum3 = dagenAfBij(datum2, dagen);
    if (datum3 !== false) {
        document.getElementById(id).value = datum3;
    }
	}
		function setDatum(id, datum3, dagen) {
    var datum4 = dagenAfBij(datum3, dagen);
    if (datum4 !== false) {
        document.getElementById(id).value = datum4;
    }
	}
		function setDatum(id, datum4, dagen) {
    var datum5 = dagenAfBij(datum4, dagen);
    if (datum5 !== false) {
        document.getElementById(id).value = datum5;
    }
	}

</script>
 
RE: omdat dan het 2e veld altijd wordt ingevuld wilde ik wat anders.
Ik begrijp je vraag niet? Omdat je nu 5 velden gebruikt is er een opeenvolgende afhankelijkheid ontstaan namelijk van datum_1 tot datum_5.
Wat zou er moeten gebeuren als ik bijvoorbeeld datum_2 invul (terwijl de rest leeg is)?

Noot: een functienaam mag 1 keer worden gebruikt. Nu zie ik in bericht #11 meerdere setDatum(...) staan en de functie dagenAfBij(...) mist.

Door de naamgeving van sommige dingen in de functies kan er misschien wat onduidelijkheid zijn.
Daarom heb ik de naamgeving van een paar dingen veranderd en alles wat nodig is hieronder bij elkaar gezet.
Code:
<input id="datum_1" type="date" value="" name="datum_1">
<input id="datum_2" type="date" value="" name="datum_2" onfocus="copyDatum('datum_1', 'datum_2', 7);">
<input id="datum_3" type="date" value="" name="datum_3" onfocus="copyDatum('datum_2', 'datum_3', 7);">
<input id="datum_4" type="date" value="" name="datum_4" onfocus="copyDatum('datum_3', 'datum_4', 7);">
<input id="datum_5" type="date" value="" name="datum_5" onfocus="copyDatum('datum_4', 'datum_5', 7);">

<script type="text/javascript">
function dagenAfBij(beginDatum, dagen) {
    var jmd = beginDatum.split('-');
    var isDatum = new Date(jmd[0], jmd[1] - 1, jmd[2]);
    if (isDatum && (isDatum.getMonth() + 1) == jmd[1]) {
        var eindDatum = new Date(Date.parse(jmd[1] +'/'+ jmd[2] +'/'+ jmd[0] +' UTC') + (dagen * 86400000));
        return eindDatum.toISOString().slice(0, 10);
    }
    return false;
}
function copyDatum(vanId, naarId, aantalDagen) {
    var vanDatum  = document.getElementById(vanId).value;
    var naarDatum = dagenAfBij(vanDatum, aantalDagen);
    if (naarDatum !== false) {
        document.getElementById(naarId).value = naarDatum;
    }
}
</script>
 
Laatst bewerkt:
Beste Bron,

Het werkt helemaal top , hartstikke bedankt.

het in vullen begint altijd vanaf veld 1 > veld 5 , dus veld 2 alleen invullen komt niet voor.
 
Graag gedaan :thumb: Suc6 met het formulier.
 
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan