Solspace Support Forums | How do I use the File Upload along with other custom weblog fields?

How do I use the File Upload along with other custom weblog fields?

Posted: 18 June 2007 02:51 PM

[ Ignore ]

Newbie

Total Posts: 5

Joined 2007-04-06

I have bought several items from you - including the SAEF file upload module. It is working great (with your help), but I have one issue.

I’m now using it in another form and I’m having the field data go into a textinput field in the custom fields - but i also have OTHER textinput fields on the same SAEF - so how do I make it not apply the “file upload” input to ALL textinput fields in that SAEF. Does that make sense? In other words, I have a form with multiple textinput fields and textareas yet I want to have one field that allows for file uploads (via your plugin).

Any help would be greatly appreciated.

Profile

Ingmar

Posted: 20 June 2007 04:03 AM

[ Ignore ] [ # 1 ]

Sr. Member

Total Posts: 336

Joined 2005-07-09

Hi,

Can you show me where the problem occurs? Can you post the code that you are using?I am not sure I completely understand it yet. You would use the required “field_name” parameter to specify the custom field that will receive the HTML file code once upload is complete. Why shouldn’tt you have more than one textinput?

Signature

Ingmar Greil

Profile

sherrills

Posted: 20 June 2007 07:03 AM

[ Ignore ] [ # 2 ]

Newbie

Total Posts: 5

Joined 2007-04-06

Here’s the code for the SAEF

{exp:weblog:entry_form weblog="foo" return="site/index" preview="site/entry"}

<input type="hidden" name="entry_id_return" value="contest/rules" />

{preview}
<h1>{title}</h1>

{display_custom_fields}

{/preview}

<table>
<tr>
<td>

Name<br />
<input type="text" name="title" id="title" value="{title}" size="50" maxlength="100" onkeyup="liveUrlTitle();" />


{custom_fields}
<br /><br />{field_label}<br />

{if textarea}
<textarea name="{field_name}" dir="{text_direction}" cols="50" rows="{rows}" onclick="setFieldName(this.name)">{field_data}</textarea>
{/if}

{if textinput}
<input type="text" dir="{text_direction}" name="{field_name}" value="{field_data}" maxlength="{maxlength}" size="30" onClick="setFieldName(this.name)"/>
<a href="http://www.visualdiner.com/index.php/contest/filez_upload/" onClick="openUpload('upload_file'); return false"><img src="http://www.visualdiner.com/themes/site_themes/default/upload_image_button.gif" width="109" height="23" /></a>
{/if}

{if pulldown}
<select name="{field_name}">
{options}<option value="{option_value}"{selected}>{option_name}</option>{/options}
</select>
{/if}

{/custom_fields}

<br><br>

</td>
</tr>
</table>
 <input type="hidden" name="allow_comments" value="y" />

<p> <input type="submit" name="submit" value="Submit" style="font-size:18px "/>

{/exp:weblog:entry_form}

As you can see, for any “TextInput” field that I use, it will show the upload button. I want to be able to use multiple TextInputs, and have only one place for the user to upload an image. What would that look like?

Profile

Ingmar

Posted: 20 June 2007 07:45 AM

[ Ignore ] [ # 3 ]

Sr. Member

Total Posts: 336

Joined 2005-07-09

Can you also show me a link to the site where you use this template, so I can see it in action?

Signature

Ingmar Greil

Profile

sherrills

Posted: 20 June 2007 08:01 AM

[ Ignore ] [ # 4 ]

Newbie

Total Posts: 5

Joined 2007-04-06

Ingmar, unfortunately I can’t - this is a corporate design contest that I’m building and they’re super sensitive about that stuff. Looking at my code above - do you see what I mean about the “TextInput” above in the custom fields. I basically have 5 different custom textinput fields on a form, along with some drop downs and textarea fields, AND this plugin - which allows the user to browse to a picture and upload it.

So I realize this plugin needs to put the data into either a textinput or textarea field.. but i’m already using them on the form and if I associate it with either of them - it will apply the upload functionality to every instance. How can i work around this?

Profile

Ingmar

Posted: 20 June 2007 08:17 AM

[ Ignore ] [ # 5 ]

Sr. Member

Total Posts: 336

Joined 2005-07-09

sherrills - 20 June 2007 08:01 AM
Ingmar, unfortunately I can’t - this is a corporate design contest that I’m building and they’re super sensitive about that stuff.

Right. Well, I understand your (client’s) reluctance to post this info publicly, perhaps you could PM me? It sure is hard to troubleshoot without actually seeing the site in question.

Looking at my code above - do you see what I mean about the “TextInput” above in the custom fields.

Sort of. But I’d still like to see the “filez_upload” template, and there must be some JS for openUpload(), so this is a somewhat elaborate setup.

I basically have 5 different custom textinput fields on a form, along with some drop downs and textarea fields, AND this plugin - which allows the user to browse to a picture and upload it.

I’ll try to go through this tempalte later tonight, and replicate on my test server.

Signature

Ingmar Greil

Profile

sherrills

Posted: 20 June 2007 08:44 AM

[ Ignore ] [ # 6 ]

Newbie

Total Posts: 5

Joined 2007-04-06

It works beautifully if I make every textinput area of my form a “textarea” and allow only one textinput to be used for this plugin - so there’s nothing to troubleshoot in terms of the openUpload, JS, etc. all that works great.

I was just hoping for a quick explanxation as to what the code would look like if you have a SAEF with several custom fields (both textinput and textarea) - AND you want to use this plugin. Currently, it seems that it has to be associated with either the textinput or the textarea fields in the SAEF.

What would your code look like if you had an SAEF with several custom textarea and textinput fields and you wanted to use this plugin?

Profile

Ingmar

Posted: 27 June 2007 02:27 AM

[ Ignore ] [ # 7 ]

Sr. Member

Total Posts: 336

Joined 2005-07-09

Just to let you know that I’m still trying to get to the bottom of this. Thanks for your patience.

Signature

Ingmar Greil

Profile

sherrills

Posted: 16 July 2007 01:00 PM

[ Ignore ] [ # 8 ]

Newbie

Total Posts: 5

Joined 2007-04-06

still waiting

Profile

hothousegraphix

Posted: 29 August 2007 07:34 PM

[ Ignore ] [ # 9 ]

Member

Total Posts: 63

Joined 2007-05-31

Just wondering if this is the solution.

To not make the upload field a “Custom Field” - but, rather, to hard code it

<!--
function openUpload(fieldname) {
var url="http://www.visualdiner.com/index.php/contest/filez_upload/"+fieldname;
windowOpen=window.open(url,'upload','width=580,height=350,titlebar,resizable=0,scrollbars,status=0,left=0,top=0');
if (window.focus) {windowOpen.focus()} 
}
//-->
 

{exp:weblog:entry_form weblog="contest " return="site/index" preview="site/entry"}

<table style="width:475px;">
<tr>
<td>

<div class="contest_header">Your Name</div>
<input type="text" name="title" id="title" value="{title}" size="64" maxlength="100" onkeyup="liveUrlTitle();" /><br /><br />

{custom_fields}
<div style="margin: 10px 0 0 0;">{if required}* {/if}{field_label}</div>
{field_instructions}

{if textarea}
<textarea id="{field_name}" name="{field_name}" dir="{text_direction}" cols="50" rows="{rows}" onclick="setFieldName(this.name)">{field_data}</textarea>
{/if}

//Remove the Custom Field for uploading images field so as not to duplicate in the SAEF
{if textinput}
<input type="text" dir="{text_direction}" id="{field_name}" name="{field_name}" value="{field_data}" maxlength="{maxlength}" size="50" onclick="setFieldName(this.name)" />
{/if}

{if pulldown}
<select id="{field_name}" name="{field_name}">  
{options}<option value="{option_value}"{selected}>{option_name}</option>{/options}
</select>
{/if}

{/custom_fields}

<div  style="margin: 10px 0 0 0;">* Upload Your Image</div>
//hard coded upload field
{exp:file_upload:upload_form form_name="entryform" enctype="multipart/form-data" destination="Main Upload Directory" field_name="body" return="popups/file_upload_placement"}
<p style="margin: 5px 0 5px 0;"><input type='file' name='userfile' /></p>
<input type='submit' value='Upload' />
{/exp:file_upload:upload_form}

<div style="margin: 15px 0 0 0;">
<input type="submit" name="submit" value="Submit" />
</div>
</td>
</tr>
</table>

{/exp:weblog:entry_form}

This look right?

Profile

vinci

Posted: 31 January 2008 06:17 PM

[ Ignore ] [ # 10 ]

Newbie

Total Posts: 4

Joined 2007-11-10

did this solution work?

Im really struggling to get this module to work.

I need one “file upload” form or link to automatically determine which custom field to place the imge in.
Any help please?

Profile

Pie Man

Posted: 01 February 2008 07:11 AM

[ Ignore ] [ # 11 ]

Administrator

Total Posts: 3272

Joined 2006-10-18

After looking at this thread, it appears obvious that not all of you hardcode your entire SAEF form…

I would hardcode the entire SAEF form (it also gives you more control over styling, order, and placement:

Field 1: <input type="text" id="field_id_1" name="field_id_1" value="" maxlength="100" size="80" class="form" /><input type="hidden" name="field_ft_1" value="none" />
<a href="{path=saef/template/field1_upload" onClick="openUpload('upload_file'); return false"><img src="/images/upload_image_button.gif" width="109" height="23" /></a>

Field 2: <input type="text" id="field_id_2" name="field_id_2" value="" maxlength="100" size="80" class="form" /><input type="hidden" name="field_ft_2" value="none" />
<a href="{path=saef/template/field2_upload" onClick="openUpload('upload_file'); return false"><img src="/images/upload_image_button.gif" width="109" height="23" /></a>

Field 3: <input type="text" id="field_id_3" name="field_id_3" value="" maxlength="100" size="80" class="form" /><input type="hidden" name="field_ft_3" value="none" />
<a href="{path=saef/template/field3_upload" onClick="openUpload('upload_file'); return false"><img src="/images/upload_image_button.gif" width="109" height="23" /></a>

That would provide a link to the file upload window for each custom field… but each is set to a different template… and on that template you would change your custom field preference:

{exp:file_upload:upload_form form_name="entryform" enctype="multipart/form-data" destination="Main Upload Directory" field_name="field1" return="popups/file_upload_placement"}
<p style="margin: 5px 0 5px 0;"><input type='file' name='userfile' /></p>
<input type='submit' value='Upload' />
{/exp:file_upload:upload_form}

{exp:file_upload:upload_form form_name="entryform" enctype="multipart/form-data" destination="Main Upload Directory" field_name="field2" return="popups/file_upload_placement"}
<p style="margin: 5px 0 5px 0;"><input type='file' name='userfile' /></p>
<input type='submit' value='Upload' />
{/exp:file_upload:upload_form}

{exp:file_upload:upload_form form_name="entryform" enctype="multipart/form-data" destination="Main Upload Directory" field_name="field3" return="popups/file_upload_placement"}
<p style="margin: 5px 0 5px 0;"><input type='file' name='userfile' /></p>
<input type='submit' value='Upload' />
{/exp:file_upload:upload_form}