0

I'm working with servlet / jsp.

I have an input type file and one img in jsp and would like to get its url to the servlet. I tried it like this, but it did not work, the request is null:

JSP:

<script>
   var loadFile = function (event) {
   var output = document.getElementById('imgTpProd');
   output.src = URL.createObjectURL(event.target.files[0]);
                                                                };
</script>

<label id="lblInputFile" for='selecao-arquivo'>Selecionar um arquivo </label>
<input id="selecao-arquivo" name="txturlimage" type="file" accept="image/*" onchange="loadFile(event)">

<div id="imgGrupProd">
   <img src="">
</div>

Servlet:

String s = request.getParameter("txturlimage");

Imagine a local application, local images and a local bd ...

I have a product table and this one has a url field of an image, which the user selects by an input file. I need to save the image path in the bd.

It's not possible?And all the records that contain pictures, profile photos, how are they made?

Is there any solution without using javascript and php?

If not, I would like a simple javascript / php code (commented),i am not familiar with the programming languages.

Joelend
  • 175
  • 10
  • 2
    Do you really want to get the path to the servlet itself or the path to the file the user selected (which is impossible) ? – obscure May 08 '19 at 12:09
  • 1
    @Joelend You can get `file name` which user have selected , not the path of file ,check [here](https://stackoverflow.com/questions/15201071/how-to-get-full-path-of-selected-file-on-change-of-input-type-file-using-jav/15201258#15201258). – Swati May 08 '19 at 12:15
  • I did not understand. I explained the problem better. – Joelend May 08 '19 at 12:43
  • So you have some sort of array which contains data like URLs of images? Then you can't use HTMLs dialog because it's purpose is selecting a file from the user's computer or mobile device. You need a dialog which let's you select one of the URLs out of your array. – obscure May 08 '19 at 12:49
  • I was able to do a part ... I was able to load the image that the user chooses in an img (preview). Now I can get the src of the img on the servlet by request? – Joelend May 08 '19 at 12:56
  • Maybe you need to paste the bits of code you're using to handle the file uploaded by the user. (and what you want to do with the url) – obscure May 08 '19 at 13:01
  • @obscure I put the codes ... remembering that now I have the address I want in img src, I just need to get the request. – Joelend May 08 '19 at 13:13
  • I guess that what you are trying to do is upload an image to the server, and inside the database table, insert the path where the image is stored, am I correct? – SammeAyala May 08 '19 at 13:35
  • @SammeAyala Yes. – Joelend May 08 '19 at 13:48
  • @SammeAyala You're right, do you know how I can do it? – Joelend May 08 '19 at 17:59
  • You can't take the URL, you must create it, when the user upload the image or file, you must tell the servlet where to store the file, once you have stored the file, you can know the path. Let's say you tell the servlet to store the file inside /images/filesUploaded. Then inside the database you store a varchar like "192.168.0.1/images/filesUploaded/name_of_the_file.jpg" – SammeAyala May 09 '19 at 14:17
  • @SammeAyala I think I understood ... how do I upload this image? – Joelend May 09 '19 at 14:49
  • You must add two libraries first, apache commons fileupload and apache commons io. There are plenty examples out there about how to use them. I can't help you more, as I don't have the project where I used to upload files. – SammeAyala May 10 '19 at 16:14

1 Answers1

0

You can use an invisible HTML input element to store the blob URL of the picture.

<input type="hidden" name="hiddenInput" id="myHiddenInput" value=""/>

Inside the loadFile() callback function you need to set the value property of this hidden input field to the URL like:

var loadFile = function(event) {
  var output = document.getElementById('imgTpProd');
  output.src = URL.createObjectURL(event.target.files[0]);
  document.getElementById('myHiddenInput').value = output.src;
};

Now you can reference it from jsp using:

String s = request.getParameter("hiddenInput");
obscure
  • 11,916
  • 2
  • 17
  • 36
  • I thought it would work fine ... but he does not take the path of the image ... there is no way I can save this path that he takes in the bank and dps use to load the image again. – Joelend May 08 '19 at 17:57