Ik ben bezig met een tool waarbij ik een foto moet laten weergeven. Er wordt alleen een getallen reeks ingevoerd de prefix en de extensie worden erbij gevoegd. Ter voorbeeld foto IMG_1234.JPG wordt dus ingevoerd met nummer 1234. Op deze manier houden we de invoer zo beperkt mogelijk.
Met behulp van een html input veld met een onchange actie wordt het nummer van de foto netjes in een javascript functie gezet.
De functie geeft direct de foto weer naast het formulier. Het input veld is onderdeel van een formulier waarvan de data wordt weggeschreven in een database. Tot zover gaat alles goed.
Wanneer ik bijvoorbeeld het fotonummer wil wijzigen vraag ik de gegevens op en wordt het fotonummer vanuit de database opnieuw in de functie gezet met een body.onload
Zolang het nummer begint met een 1 zoals in het voorbeeld "1234" gaat alles goed. Bij een waarde van "0702" wordt echter de functie met "450" uitgevoerd. Inmiddels ben ik er achter dat het te maken heeft met het octale getallenstelsel. Javascript herkent door de eerste 0 de waarde als een getal uit het 8-tallig stelsel. Nu snap ik alleen niet waarom de functie wel werkt vanuit de "onchange" van het input veld maar niet vanuit de "onload" van de <body>.
Hoe kan ik deze uitdaging tackelen?
HTML:
1
2
3
| <p><b>Fotonummer: </b><br> <input type="input" name="BV_foto" size="50"onchange="foto(this.value)" tabindex="1" maxlength="250"value="<?php echo $BV_foto?>"/> </p> |
Met behulp van een html input veld met een onchange actie wordt het nummer van de foto netjes in een javascript functie gezet.
JavaScript:
1
2
3
4
5
6
7
| function foto(nummer) { var locatie = "<?php echo $fotolocatie;?>"; var prefix = "<?php echo $prefix;?>"; var extensie = "<?php echo $extensie;?>"; document.getElementById('foto').innerHTML='<img src="/'+locatie+'/'+prefix+nummer+extensie+'" width="400px">'; } |
De functie geeft direct de foto weer naast het formulier. Het input veld is onderdeel van een formulier waarvan de data wordt weggeschreven in een database. Tot zover gaat alles goed.
Wanneer ik bijvoorbeeld het fotonummer wil wijzigen vraag ik de gegevens op en wordt het fotonummer vanuit de database opnieuw in de functie gezet met een body.onload
HTML:
1
| <body onload="foto(<?php echo $BV_foto;?>)"> |
Zolang het nummer begint met een 1 zoals in het voorbeeld "1234" gaat alles goed. Bij een waarde van "0702" wordt echter de functie met "450" uitgevoerd. Inmiddels ben ik er achter dat het te maken heeft met het octale getallenstelsel. Javascript herkent door de eerste 0 de waarde als een getal uit het 8-tallig stelsel. Nu snap ik alleen niet waarom de functie wel werkt vanuit de "onchange" van het input veld maar niet vanuit de "onload" van de <body>.
Hoe kan ik deze uitdaging tackelen?