Using Javascript to change struts-generated forms
Hi, all. I'm working on a form that would allow some arbitrary number of documents to be uploaded at once. The idea is that by default, one set of document fields appears, and there's a link that a user can click to activate some javascript that would add another set of document fields. I have this basically working. The new fields are named the same as the old fields, and that works just fine, with Struts automatically making those into array properties. My question, though, is how to make it not look horrible. I've included the JSP below, and as you can see, I have an invisible div that I clone and insert into the DOM tree before the Submit button. What I want is for the cloned portion to be added as additional table rows in the table that Struts creates for the main form. Instead, the cloned portion ends in a table inside of a single cell in the original form's table. How can I write the JSP so that the cloned portion fits in nicely? Is this a job for a new theme? Have I just taken the complete wrong approach? Thanks, Dan Allen __JSP below__ http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> <[EMAIL PROTECTED] prefix="s" uri="/struts-tags" %> http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en"> Policy Uploads <%-- The Javascript will simply multiply the HTML code generated by Struts for us, and the identical fieldnames will cause Struts to see the form as working with indexed properties. See DocumentUploadAction.java --%> var fileCount = 1; var clonedNode = null; var insertLoc = null; function addFileToForm() { if(fileCount >= 5) { alert("Please upload files in batches of five or less, in order to maintain reasonable response times."); return; } clonedNode = document.getElementById('cloneTarget').cloneNode(true); clonedNode.style.display = ''; // The clone target has display "none"; drop that attribute. insertLoc = document.getElementById('documentSubmitButton'); insertLoc.parentNode.insertBefore(clonedNode , insertLoc); fileCount = fileCount + 1; } (leave blank to copy the name from the uploaded file) (leave blank to copy the name from the uploaded file) Click here to add more files to the upload. -- This message may contain confidential, proprietary, or legally privileged information. No confidentiality or privilege is waived by any transmission to an unintended recipient. If you are not an intended recipient, please notify the sender and delete this message immediately. Any views expressed in this message are those of the sender, not those of any entity within the KBC Financial Products group of companies (together referred to as "KBC FP"). This message does not create any obligation, contractual or otherwise, on the part of KBC FP. It is not an offer (or solicitation of an offer) of, or a recommendation to buy or sell, any financial product. Any prices or other values included in this message are indicative only, and do not necessarily represent current market prices, prices at which KBC FP would enter into a transaction, or prices at which similar transactions may be carried on KBC FP's own books. The information contained in this message is provided "as is", without representations or warranties, express or implied, of any kind. Past performance is not indicative of future returns. - To unsubscribe, e-mail: [EMAIL PROTECTED] For additional commands, e-mail: [EMAIL PROTECTED]
Re: Using Javascript to change struts-generated forms
Yes, create a custom theme to get out of that table. css_xhtml may work immediately. Potential issues: - Your current approach is also going to create nodes with duplicate ids. This may confuse some browsers badly. At least remove the ID from the template - I'm not sure that order is guaranteed when you have two params with the same name at time they are submitted. Ensure you can't get a mismatch between doctype/doc name when uploading multuple files. ie. doctype[1] is associated with docname[0]. It seems vulnerable to browser-dependent processing of the form. You may be safer generating the DOM nodes with JS programmatically rather than doing a clone. That way you'll be able to assign unique ID's for each node, add listeners for validation and use array notation in your field names to guarantee order for struts eg. "doctype[1]". hope that helps, Jeromy Evans Allen, Daniel wrote: Hi, all. I'm working on a form that would allow some arbitrary number of documents to be uploaded at once. The idea is that by default, one set of document fields appears, and there's a link that a user can click to activate some javascript that would add another set of document fields. I have this basically working. The new fields are named the same as the old fields, and that works just fine, with Struts automatically making those into array properties. My question, though, is how to make it not look horrible. I've included the JSP below, and as you can see, I have an invisible div that I clone and insert into the DOM tree before the Submit button. What I want is for the cloned portion to be added as additional table rows in the table that Struts creates for the main form. Instead, the cloned portion ends in a table inside of a single cell in the original form's table. How can I write the JSP so that the cloned portion fits in nicely? Is this a job for a new theme? Have I just taken the complete wrong approach? Thanks, Dan Allen __JSP below__ "-//W3C//DTD XHTML 1.1 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> <[EMAIL PROTECTED] prefix="s" uri="/struts-tags" %> http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en"> Policy Uploads <%-- The Javascript will simply multiply the HTML code generated by Struts for us, and the identical fieldnames will cause Struts to see the form as working with indexed properties. See DocumentUploadAction.java --%> var fileCount = 1; var clonedNode = null; var insertLoc = null; function addFileToForm() { if(fileCount >= 5) { alert("Please upload files in batches of five or less, in order to maintain reasonable response times."); return; } clonedNode = document.getElementById('cloneTarget').cloneNode(true); clonedNode.style.display = ''; // The clone target has display "none"; drop that attribute. insertLoc = document.getElementById('documentSubmitButton'); insertLoc.parentNode.insertBefore(clonedNode , insertLoc); fileCount = fileCount + 1; } (leave blank to copy the name from the uploaded file) (leave blank to copy the name from the uploaded file) Click here to add more files to the upload. - To unsubscribe, e-mail: [EMAIL PROTECTED] For additional commands, e-mail: [EMAIL PROTECTED]
RE: Using Javascript to change struts-generated forms
>- I'm not sure that order is guaranteed when you have two params with the same name at time they are submitted. I thought multiple parameters with the same name is how Struts did actions with array-typed properties. That's what's done on the File Uploads How-To.[1] Is that example potentially broken, then? ~Dan [1]http://struts.apache.org/2.x/docs/how-do-we-upload-files.html -Original Message- From: Jeromy Evans [mailto:[EMAIL PROTECTED] Sent: Friday, March 21, 2008 2:49 AM To: Struts Users Mailing List Subject: Re: Using Javascript to change struts-generated forms Yes, create a custom theme to get out of that table. css_xhtml may work immediately. Potential issues: - Your current approach is also going to create nodes with duplicate ids. This may confuse some browsers badly. At least remove the ID from the template - I'm not sure that order is guaranteed when you have two params with the same name at time they are submitted. Ensure you can't get a mismatch between doctype/doc name when uploading multuple files. ie. doctype[1] is associated with docname[0]. It seems vulnerable to browser-dependent processing of the form. You may be safer generating the DOM nodes with JS programmatically rather than doing a clone. That way you'll be able to assign unique ID's for each node, add listeners for validation and use array notation in your field names to guarantee order for struts eg. "doctype[1]". hope that helps, Jeromy Evans -- This message may contain confidential, proprietary, or legally privileged information. No confidentiality or privilege is waived by any transmission to an unintended recipient. If you are not an intended recipient, please notify the sender and delete this message immediately. Any views expressed in this message are those of the sender, not those of any entity within the KBC Financial Products group of companies (together referred to as "KBC FP"). This message does not create any obligation, contractual or otherwise, on the part of KBC FP. It is not an offer (or solicitation of an offer) of, or a recommendation to buy or sell, any financial product. Any prices or other values included in this message are indicative only, and do not necessarily represent current market prices, prices at which KBC FP would enter into a transaction, or prices at which similar transactions may be carried on KBC FP's own books. The information contained in this message is provided "as is", without representations or warranties, express or implied, of any kind. Past performance is not indicative of future returns. - To unsubscribe, e-mail: [EMAIL PROTECTED] For additional commands, e-mail: [EMAIL PROTECTED]
RE: Using Javascript to change struts-generated forms
--- "Allen, Daniel" <[EMAIL PROTECTED]> wrote: > I thought multiple parameters with the same name is how Struts did > actions with array-typed properties. That's what's done on the File > Uploads How-To.[1] Is that example potentially broken, then? No; the order of parameters doesn't matter there, because there's only one value per entry. Your example (IIRC) has multiple fields per entry. As an example, consider: (1) name, age (2) name, age (3) name, age There's no guarantee that each name,age pair will "line up" when submitted. Without an array index you might get names submitted like name1,name3,name2 and ages age3,age1,age2. (My *guess* is that they'd be submitted in the order they're on the form, but it would be a Bad Idea IMO to rely on that.) Dave - To unsubscribe, e-mail: [EMAIL PROTECTED] For additional commands, e-mail: [EMAIL PROTECTED]