Rank: Member
Joined: 1/23/2013(UTC)
Posts: 267
Location: Joliet, IL
Thanks: 64 times
|
How should I go about aligning all elements of this File Upload product input? Currently the button and file name run to the second line. Edited by user Monday, October 21, 2013 9:40:27 PM(UTC)
| Reason: Not specified TKatch attached the following image(s):  file upload.gif (32kb) downloaded 9 time(s).You cannot view/download attachments. Try to login or register.
|
|
|
|
|
|
Rank: Administration
Joined: 4/2/2004(UTC) Posts: 2,393 ![United States]( "United States") Location: Hummelstown, PA Thanks: 6 times
Was thanked: 163 time(s) in 158 post(s)
|
This is done because the file upload needs all the width it can get to display the file path once you've selected a file to upload. |
Aaron Sherrick
BV Commerce
Toll-free 888-665-8637 - Int'l +1 717-220-0012 |
|
|
|
|
|
Rank: Member
Joined: 1/23/2013(UTC)
Posts: 267
Location: Joliet, IL
Thanks: 64 times
|
Can the file name be viewed in truncated form if it exceeds so many characters? If a file that is too large is uploaded, it skews the site frame. TKatch attached the following image(s): file_upload_2.gif (198kb) downloaded 6 time(s).You cannot view/download attachments. Try to login or register.
|
|
|
|
|
|
Rank: Member
Joined: 3/25/2013(UTC)
Posts: 37
Location: Hummelstown, PA
Was thanked: 4 time(s) in 3 post(s)
|
The file input is tricky. It's handled differently from one browser to another, from one browser version to another, and from one operating system to another.
I did some investigating and from what I can tell, the only modern browser on Windows 7 that has this issue is FF (I was using version 24). To address this you can simply style it's width by adding the following rule to your theme stylesheet.
.variantsdisplay input[type=file] {width:300px;}
IE 10, IE 9, Chrome 30, and Safari 5.1.7 do not break the layout on your site. |
Nathan Baker
BV Commerce
Toll-free 888-665-8637 - Int'l +1 717-220-0012 |
|
|
|
|
|
Rank: Member
Joined: 1/23/2013(UTC)
Posts: 267
Location: Joliet, IL
Thanks: 64 times
|
Thanks, Nathan. The code works fine (not on FF, like you said). The file name is abbreviated like it should (attached). Now I just need to understand how to get all of the elements on the same line: "Upload: > Choose File button > file name", rather than splitting to two lines. TKatch attached the following image(s): file_upload_3.gif (56kb) downloaded 8 time(s).You cannot view/download attachments. Try to login or register.
|
|
|
|
|
|
Rank: Member
Joined: 3/25/2013(UTC)
Posts: 37
Location: Hummelstown, PA
Was thanked: 4 time(s) in 3 post(s)
|
That particular Product Input is called "File Upload" and by default the label is in a separate table row. If you want to have all this on the same line you would have to edit the "File Upload" view.ascx file. It's located in the bvmodules/productinputs/file upload/ directory. Notice how all the product inputs come together on the page to form one single table. That is why this control starts and ends with the opening and closing <tr></tr> but there are no <table> tags. You'll just need to put the contents of the first row into the second row just before the <asp:FileUpload> control. Then just remove the first empty row. It will be arranged like this when you are done. <tr><td> Label - Validator - FileUpload </td></tr> ... Of course, this move aggravates the situation with FF and long file names. You'll have to adjust the width of the input down in the CSS I gave you to compensate for the loss of horizontal space. |
Nathan Baker
BV Commerce
Toll-free 888-665-8637 - Int'l +1 717-220-0012 |
|
|
|
|
|
Rank: Member
Joined: 1/23/2013(UTC)
Posts: 267
Location: Joliet, IL
Thanks: 64 times
|
Nathan, I guess even better then would be to remove the word "Upload" since I already have the word in the title block above it. I would have thought the word "Upload" would be in that same view.ascx file. How would I simply delete that word so there is just an upload button and the uploaded file name? Sorry for my ignorance - I'm not a coder. TKatch attached the following image(s): file_upload_4.gif (47kb) downloaded 2 time(s).You cannot view/download attachments. Try to login or register.
|
|
|
|
|
|
Rank: Member
Joined: 3/25/2013(UTC)
Posts: 37
Location: Hummelstown, PA
Was thanked: 4 time(s) in 3 post(s)
|
The "Upload:" label above the file input is set in admin.
You have a shared choice called "Upload Artwork".
Go to Catalog > Shared Choices > Upload Artwork > Edit
The display name is currently set to render "Upload:"
If you remove that and leave the field empty, it will show nothing on the front end for any products that use this shared choice store-wide. |
Nathan Baker
BV Commerce
Toll-free 888-665-8637 - Int'l +1 717-220-0012 |
 1 user thanked Nathan for this useful post.
|
|
|
|
Forum Jump
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.