I have a scenario in which user is prompted for selecting a file from local disk (an image). Upon selection, this image is shown in browser (without uploading). After seeing the image user inputs a number in CN No field. Upon submit I want to rename the file on local disk with the number input by user. Is there some way to do this in code using PHP or Javascript?
- <html>
- <head>
- <script type='text/javascript'>
- function preview_image(event)
- {
- var reader = new FileReader();
- reader.onload = function()
- {
- var output = document.getElementById('output_image');
- output.src = reader.result;
- }
- reader.readAsDataURL(event.target.files[0]);
- }
- </script>
- </head>
- <body>
- <form>
- Select File: <input type="file" accept="image/*" onchange="preview_image(event)"> <br>
- Enter CN No. <input type="number" id="cnno" name="cnno"> <br>
- <input id="sbt" type="submit" name="submit" value="Submit" accesskey="u"> <br>
- </form>
-
- <img id="output_image" style="width: 400px"/>
-
- </body>
- </html>