jsp property

Question

I need to pass the value from jsp file property in a loop. Here is the code

</tr>
                    <%

                    for (int i = 0; i < value.size(); i++) {
                        <html:form action="save" method="post" styleId="update" enctype="multipart/form-data">
                        <input type=hidden id="secfeaturetype" name="secfeaturetype" value="" />

                        <html:file property="testfile" styleId="testfile"/>
                        <input type="button" value="Update" onclick='javascript:check_updatefields()' />
                        </html:form>
                        </td>
                    </tr>

I am trying to do some validation in javascript and it is reading only the first file properly and not the rest. Any ideas ?

function check_updatefields() {
    var file = jQuery('#testfile').val();
    alert(testfile);
 }

Am I missing something here ? Thanks.

The `id` attribute is supposed to be unique, so creating elements in a loop with the same `id` is giving you invalid html and `$("#testfile")` will select only the first element with that id (except in some browsers that might select only the last). Regarding the code you posted, where are the opening `` and `` tags? Where's the closing `%>`? Where's the end of the `for` loop? — nnnnnn, Jul 31 '12 at 01:28
Thanks for the suggestion. so, should i generate unique id each time in the loop.for loop is the java code (inside <% %> ) and the rest are html tags ( ) Here is the correct code<% for (int i = 0; i < value.size(); i++) { %> ..... <% }%> — User, Jul 31 '12 at 01:35
So each row in the table will have its own form, and when an Update button is pressed it should validate just the form it belongs to, but the validation is the same for every form? Is all of the html generated by the Java only on initial page load, or are you dynamically updating part of the page with Ajax? And finally (before I post an answer), what does the html generated by the `` tag look like in the browser? — nnnnnn, Jul 31 '12 at 01:44
Html is generated by java on inital page load. tag shows a "choose file" button on browser and on click of the button, opens a file browser to upload a file. Thanks — User, Jul 31 '12 at 01:49

score 0 · Answer 1 · answered Jul 31 '12 at 02:09

0

"id", it means it's unique in your page, so if there's more than one, the browser will only identify the first element, so here you'd better use "class", correcting it like this: styleClass="testfile". js: jQuery('.testfile').

answered Jul 31 '12 at 02:09

jasonjifly

347
1
3
15

Thanks, But js: jQuery('.testfile') is returning undefined. var testfile = jQuery('.testfile') and changed jsp code to .. am i missing anything here .. – User Jul 31 '12 at 02:44
@User - `jQuery('.testfile')` should never return undefined. Even if no elements have that class you should get back an "empty" jQuery object. If no matching elements are found then the `.val()` method would return undefined though. Are you running your script in a document ready handler and/or at the end of the body (i.e., after the page is parsed)? – nnnnnn Jul 31 '12 at 03:11
yes, I was wrong. jQuery('.testfile').val() returned undefined and jQuery('.testfile') returns nothing. How do I get the uploaded file value in JQuery – User Jul 31 '12 at 03:16

nnnnnn · Answer 2 · 2012-07-31T03:09:50.360

As I mentioned in a comment above, the id attribute is supposed to be unique, so creating elements in a loop with the same id is giving you invalid html and $("#testfile") will select only the first element with that id (except in some browsers that might select only the last).

A better solution for repeated elements is to give them a common class and distinguish between them according to which container they belong to, or by a known relationship to some other element if not the container. Or select by tagname if that is unique enough with the containing element, or by the name attribute. You seem to be using jQuery, and it makes any of these options easy.

I think you can tidy your code up to something like this:

<table id="yourTableIdHere">
<% for (int i = 0; i < value.size(); i++) { %>
   <tr><td>
      <html:form action="save" method="post" styleId="update" enctype="multipart/form-data">
         <input type=hidden name="secfeaturetype" value="" />
         <html:file property="testfile" styleClass="testfile"/>
         <input type="button" value="Update" />
      </html:form>
   </td></tr>
<% }%>
</table>

I'm not really familiar with the Struts html tag library, but I believe styleClass="testfile" will render an attribute class="testfile" (if not please substitute whatever the appropriate thing is to render class=...). Notice I removed your inline onclick=... attribute. You can assign these handlers in one step with jQuery:

$(document).ready(function() {
   // assign a click handler to all the Update buttons that are
   // within forms within your table element:
   $('#yourTableIdHere form input[type="button"][value="Update"]').click(function() {
       var $myForm = $(this).parent();  // or $(this).closest('form'),
           $myFileInput = $myForm.find('input.testfile'),
           $myHiddenInput = $myForm.find('input[type="hidden"]');
       alert($myFileInput.val());       // alert value of file input
       $myHiddenInput.val("something"); // set value of hidden
   });
});

Within the click handler, this is the clicked button, so from $(this) you can navigate to the parent element to get a reference to the form that particular button belongs to, and from that form you can use .find() to select the file and hidden inputs in the current form.

Thanks much. I implemented the above code and it is working fine in firefox. However, in chrome, when I try to retrieve the values in java, it still returns only the first value. any thoughts..the scripts submits document.getElementById('update').submit(); and the function String inputfile = request.getParameter("filename"); returns just the first set of values.. — User, Jul 31 '12 at 19:19
You are only supposed to use the [`request.getParameter()` method](http://docs.oracle.com/javaee/1.3/api/javax/servlet/ServletRequest.html#getParameter%28java.lang.String%29) when you know a parameter has only one value. If you are submitting multiple request parameters with the same name use the [`request.getParameterValues()` method](http://docs.oracle.com/javaee/1.3/api/javax/servlet/ServletRequest.html#getParameterValues%28java.lang.String%29), which returns an array of all the values. (I don't see why choice of browser would influence this one way or the other.) — nnnnnn, Aug 01 '12 at 04:11

jsp property

2 Answers2