[Pro] Form---Attachment, original submit button and email verification

Freeway
1

Greetings.

I am using formtoemailpro as the script for my forms. So far, so good. I have a couple of issues though that I need some direction on.

My customer wants to be able to add an option on the form for users to attach a photo or file of sorts. Is there any way that I can set this up in freeway that would allow for the addition of an attachment ?

Also, can I design my own “submit” button ?

Finally, is there a way that the submit process could force the customer to put in an email address for validation purposes? The client is asking for the information to be validated before being submitted to the business for publication on their cable tv network.

Thanks for the assistance.

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

2

On Mar 22, 2011, at 11:21 AM, sampolfonz wrote:

Greetings.

I am using formtoemailpro as the script for my forms. So far, so
good. I have a couple of issues though that I need some direction on.

My customer wants to be able to add an option on the form for users
to attach a photo or file of sorts. Is there any way that I can set
this up in freeway that would allow for the addition of an
attachment ?

According to the documentation for this processor, you certainly can.
Read on and decide for yourself whether the security ramifications are
worth the benefit.

Attach file uploads
The script will handle file uploads of any file type and send them
as attachments to the email that is sent to you. There is no limit
to the number of attachments you can send. You do not need to make
any configuration changes to the script to allow attachments, they
will be detected automatically but you must remember to code your
form correctly. The instructions tell you how to do this. You can
block files of certain types you specify or alternatively you can
specify the only file types you will accept. You can also set
maximum file size limits.

As far as preparing your form in Freeway, you need to do two things.
First, you have to add an attribute to the form itself, telling the
server and browser that it contains mixed content. From the main menu,
choose Page / Form Setup, then click on the Extended Form sub-tab.
Click new, and enter the following Name/Value pair:

  • Name: enctype
  • Value: multipart/form-data

Next, you need a file input. Tim Plumb has written an Action which
turns a normal Text input into a File input, or you can simply sketch
or insert a Text input field (just as you would any other form field)
on your page, and then while that input is selected, choose Item /
Extended from the main menu, and add a new Name/Value pair to it:

  • Name: type
  • Value: file

Make sure that you name this file input something meaningful, like
‘user_upload_file’, using the Name field in the third tab from the
left of the Inspector. Your form handler script will do the rest.

Please be sure that your client has a “sandboxed” computer, running
all the best anti-virus and anti-spyware medicine you can find, and
that they use this computer for accepting mail only while logged in as
a non-admin user. It’s a very good idea to have everything locked down
by a serious security professional if your client is using Windows,
and to delete Outlook or Outlook Express entirely from this computer,
substituting Mozilla Thunderbird or another security-minded e-mail
application.

Finally, even though it’s nearly impossible to infect a Mac through an
infected e-mail message, it’s still possible to pass along windows
virii through a Mac, so don’t figure you’re safe just because your Mac
didn’t blow up.

Walter

Also, can I design my own “submit” button ?

Finally, is there a way that the submit process could force the
customer to put in an email address for validation purposes? The
client is asking for the information to be validated before being
submitted to the business for publication on their cable tv network.

Thanks for the assistance.

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

3

Look at the Validation suite of Actions, at ActionsForge. Note that
these are using JavaScript to validate the addresses, so they’re not
bulletproof and are quite trivial to bypass (just turn off JS in your
browser). But they’re a good first step.

Ideally, you would send an auto-reply e-mail to each person who
submits to this form, with a unique link they need to click in order
to validate their address before you take them seriously. That makes
it quite automatic to know which addresses work, because if you can’t
send them mail, then they did it wrong.

But that’s not something I saw in a cursory glance over your form
processing script. That sort of detail is something that a custom
application (written just for this project) would be able to do.

Walter

On Mar 22, 2011, at 11:41 AM, Walter Lee Davis wrote:

Finally, is there a way that the submit process could force the
customer to put in an email address for validation purposes? The
client is asking for the information to be validated before being
submitted to the business for publication on their cable tv network.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

4

Thanks, Walter.

I will get to this later today.

Mighty, thanks !!

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

5

Walter,

I am working on the upload file (discussed above).

As soon as I add an the item attributes type, and file as detailed the html on my page no longer will layout properly as I have typed. For instance, if I have a paragraph in three lines, after I add the item attribute, the paragraph goes to two lines and runs off the page.

I can’t see what in the addition would be affecting this to cause this kind of behavior.

Any ideas?

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

6

And,

I have noticed when I attach a file, if I change my mind and want to change to another file there is no way to clear the field and start again.

Ideas?

Thanks,

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

7

Can you post a link? When you’re choosing the element to extend in the
Extended dialog, are you sure that the tab is selected? You
can’t have the

tab selected or this will fail.

Walter

On Mar 23, 2011, at 10:04 AM, sampolfonz wrote:

Walter,

I am working on the upload file (discussed above).

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

8

This is up to the browser; generally, choosing a different file
replaces the existing file. There’s no reason to remove the value
altogether. If you wanted to skip upload, you would need to reload the
page without submitting the form.

Walter

On Mar 23, 2011, at 10:21 AM, sampolfonz wrote:

And,

I have noticed when I attach a file, if I change my mind and want to
change to another file there is no way to clear the field and start
again.

Ideas?

Thanks,

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

9

The site is on a temporary at

www.mrwebstuff.com

the page is :

http://www.mrwebstuff.com/psaform.html

The html is supposed to line up left-right with the PSA Request Form header. On my layout, the first paragraph is 3 lines long But, as soon as I applied the action, the copy stretched and now the paragraph is only two lines long.

Thanks for the help.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

10

File inputs are enormous, especially in Safari. Try making a lot more
space for it than you have. The easiest way to do this is to cut the
file input to the clipboard, then draw an HTML box where you want it
to appear, giving it loads of extra width, and then double-click
inside that box so you see a flashing text cursor. Finally, paste from
the clipboard. Your extended file input element will appear as an
inline object, and you shouldn’t have this problem any more.

Also, check this line for typos:
“Requested date to START aiging your PSA.”

Walter

On Mar 23, 2011, at 11:01 AM, sampolfonz wrote:

The site is on a temporary at

www.mrwebstuff.com

the page is :

http://www.mrwebstuff.com/psaform.html

The html is supposed to line up left-right with the PSA Request Form
header. On my layout, the first paragraph is 3 lines long But, as
soon as I applied the action, the copy stretched and now the
paragraph is only two lines long.

Thanks for the help.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

11

Will do.

Thanks,

And…two more things regarding this form. Is there any way to change the button to say ‘upload’ or something else instead of browse ??

Next, how can I limit this text area to 25 words. They really want a limit here and I am not sure if I can set a limit for input of words.

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

12

On Mar 23, 2011, at 11:22 AM, sampolfonz wrote:

Will do.

Thanks,

And…two more things regarding this form. Is there any way to
change the button to say ‘upload’ or something else instead of
browse ??

No. Have a look at it in various different browsers – you’ll see that
each browser and platform defines its own view for the file input. All
part of the fun of HTML and browsers. Learn to let go of this vestige
of your print design past, it’s the only way forward.

Next, how can I limit this text area to 25 words. They really want
a limit here and I am not sure if I can set a limit for input of
words.

You can do this with JavaScript, but there’s no way to do it in the
HTML itself. Have a google for textarea limit and you should hit some
scripts for this. Usually they restrict by character count, but if you
wanted to do it by words, that shouldn’t be too hard to substitute.

Walter

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

13

Yes, my print past does influence a lot of what I am doing here. Old habits are hard to break.

I do, so so appreciate your time and effort in helping me.

As far as extra javascript code (once I find it)
Do I insert this as EXTENDED on this item ??

Or does the javascript have to be an entirely separate form element for the text area ??

Thanks,

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

14

JavaScript is a programming language, and you can insert “islands” of
this code into your html page within tags. You would enter
these using the Page / HTML Markup dialog.

If you wanted to do this the easiest way, I would recommend just using
the Protaculous Action, which will give you the bottom 30 stories of
the skyscraper you’re going to end up building for free, and then you
don’t need to use the HTML Markup dialog at all.

Apply Protaculous to the page, choose prototype-packed from the
Library picker, click on the top Function Body button, and paste in
this:

var psa = $('PSA-Type-Area');
Event.observe(window,'keydown', function(evt){
	var count = $F(psa).split(/b/).length;
	if(count > 25){
		alert('That's too much PSA for anyone!');
	}
});

That should do something, although I haven’t tested it. This is an
example of an “unobtrusive listener” style script. Instead of putting
an inline script on the textarea itself, we trap the keydown event
(which is fired every time you type anything in the browser) and then
use that to trigger a check to see how many words are in the psa
field. It relies on the ID of the textarea for its connection, so if
you rename that for any reason, be sure to update this script to match.

Walter

On Mar 23, 2011, at 11:52 AM, sampolfonz wrote:

Yes, my print past does influence a lot of what I am doing here.
Old habits are hard to break.

I do, so so appreciate your time and effort in helping me.

As far as extra javascript code (once I find it)
Do I insert this as EXTENDED on this item ??

Or does the javascript have to be an entirely separate form element
for the text area ??

Thanks,

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

15

Thanks, Walter.

Will work on it.

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

16

Voila !! Walter is a genius. Works great.

Thanks,

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

17

Walter,

I tried the word limit script in IE 8 on my parallels side of my mac and it just keeps typing past the 25 word limit. Is there a way that this script will work with IE?

Just checking…thanks for all your help.

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

18

It just doesn’t block? Or does it throw an error? The basic premise of
observing the keydown event is pretty portable, and I haven’t had any
issues with that part. If I have some time at the weekend I will give
this a try on IE8 here. I have the debugger installed on my copy, so
if there’s a bit of code here that’s not working, I should be able to
see it. Just post a link to the page so I can see that you’ve got
everything wired up correctly.

Walter

On Mar 25, 2011, at 3:13 PM, sampolfonz wrote:

Walter,

I tried the word limit script in IE 8 on my parallels side of my mac
and it just keeps typing past the 25 word limit. Is there a way
that this script will work with IE?

Just checking…thanks for all your help.

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

19

Greetings.

Yes, it doesn’t block. When I tested it it allowed me to keep typing without stopping the extra words and it would not throw up the error message.

The web page is up on the actual site. The form is not doing what it is supposed to. I have it set to “Required Fields”, and also to re-direct to a thank you page or error page. I will have to look into that as well.

Here is the page location:

http://www.winamac.tv/psaform.html

Thanks again,

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

20

You know, I think I may know what it is. Your textarea’s ID has some
dashes in it. Try removing those. Click once on the text field, then
look in the Title field on the Inspector. Take out the dashes from
there. Look also at the Name field in the third tab from the left in
the Inspector. Change it there as well.

Walter

On Mar 25, 2011, at 5:37 PM, sampolfonz wrote:

Greetings.

Yes, it doesn’t block. When I tested it it allowed me to keep
typing without stopping the extra words and it would not throw up
the error message.

The web page is up on the actual site. The form is not doing what
it is supposed to. I have it set to “Required Fields”, and also to
re-direct to a thank you page or error page. I will have to look
into that as well.

Here is the page location:

http://www.winamac.tv/psaform.html

Thanks again,

Rich

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options