Question

Here’s my JSFiddle :

http://jsfiddle.net/fknjz/5/

(forget about the SAVE button next to the UPDATE button…)

So what I would like is to be able to fill the textboxes that are below the main image, and that when pressing “UPDATE button”….the text would update in the Canvas.

The JS code is in the HTML section…It wasn’t working well when it was in the JS section.

Right now I tried :

<input type="text" id="nom"/>  /* THE TEXTBOX */

and for the JS code to draw the text :

oCtx.fillText(document.getElementById("nom").value, 283, 350);

It’s not working very well…since nothing happens when I click on UPDATE…
With FIREFOX it seems to be working with a window.refresh…but not working in Chrome, Safari…etc. What function would make it work correctly in major browsers?

Thank you!

Answer 1

JSFiddle: http://jsfiddle.net/fknjz/17/

I moved the code for writing the text in canvas to a function called ‘updateClicked’. On click of update button, this function will get called. Moreover, I made ‘oCtx’ a global variable.
Now working fine.