Announcement

Collapse
No announcement yet.

How to upload a file using a form

Collapse
This topic is closed.
X
This is a sticky topic.
X
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • How to upload a file using a form

    The following tutorial will show you how to accomplish file uploads. However, since September 2006, the new Advanced BlueVoda Form Processor will do the same and much more. So please have a look at that also. And, since Jan 2007, ABVFP will also attach the files to the email that you receive with th erest of the form info.

    Please also note that since summer 2008 BlueVoda's embedded Form processor, also has the ability to upload files to the server, and it will include the link to download the files, in the mail that you receive with the rest of the form info.

    This tutorial is going to show you how to upload a file on your site using a form made in BlueVoda and a php script.
    We assume that you are familiar with the basics about creating a form in BlueVoda, as well as with the basic php script provided there. If you are not, please read first the BlueVoda Form Tutorial 1

    The below is an example of PHP script you may use for processing your forms data and uploading single files.. Please follow the instructions that follow to the letter. Please note that this is only an example script, that can be customized to better suit your needs.

    Let’s start by explaining what we will do:
    • We will create a form in BlueVoda.
    • We will create a php script to process our form. Since we usually want a size limit for the files to be uploaded, this script will also check the file size, and if bigger than what we have set as maximum, will redirect the visitor to an error page. When informed about the error, he can use a “Back to form” button, to return to the form.
    • The script will also send an email to our email address, to inform us that a new file has been uploaded, and will provide us the link to this file.
    • We will create a “Thankyou Page, to inform our visitor that his file has been uploaded.
    • We will also create the necessary folder, where uploaded files will reside.
    The working plan of our procedure is like in the following image:




    Let’s start by creating a form. It will have some contact information, as well as an upload field.

    It will look like the following image:




    Please note that, in order to have the form work with the script as it is, the email field MUST be called email” and the upload field MUST be called upload”. It is also advisable that you name your Submit button "submit", all lowercase letters, as we have implemented three lines of code that will take care NOT TO INCLUDE the Submit button title and value, but this code will only work if the button is named "submit".
    Set the form properties in:

    Form name: Uploadform
    Action: uploadaction.php
    Method: POST
    Encoding Type: multipart/formdata

    As shown in the following image:





    Now, let’s create the php script that will do the work.

    Please copy the following code:

    <?php

    // Receiving variables

    @$email = addslashes($_POST['email']);
    @$upload_Name = $_FILES['upload']['name'];
    @$upload_Size = $_FILES['upload']['size'];
    @$upload_Temp = $_FILES['upload']['tmp_name'];


    // Validation for max file size

    if ($upload_Size>0)
    {
    if( $upload_Size >1000000)
    {
    //delete file
    unlink($upload_Temp);
    header("Location: error.html");
    exit;
    }
    $uploadFile = "uploads/".$upload_Name ;

    @move_uploaded_file( $upload_Temp , $uploadFile);
    chmod($uploadFile, 0644);
    $upload_URL = "http://www.yourdomain.com/uploads/".$upload_Name ;
    }

    //Sending Email to form owner

    $mailto = "youremail@yourdomain.com";
    $mailsubj = "Enter Your Subject Here";
    $mailhead = "From: $email\n";
    reset ($HTTP_POST_VARS);
    $mailbody = "Values submitted from web site form :\n";
    while (list ($key, $val) = each ($HTTP_POST_VARS))
    {
    if ($key!="submit")
    {
    $mailbody .= "$key : $val\n";
    }
    }
    $mailbody .= "upload: $upload_URL\n";
    mail($mailto, $mailsubj, $mailbody, $mailhead);

    header("Location: thankyou_page.html");

    ?>
    Please note that there are four parts in blue in the above code.

    Open Notepad. Paste the above code. Now, change the above four parts in Blue with your actual values:

    1000000 is the limit file size, in bytes ( 1 Mb = 1000000 bytes). You can set it to be whatever you want.
    http://www.yourdomain.com/uploads is yourdomain name and folder (uploads) where the file will be uploaded. Please do not change the "uploads" part, as you would also need to modify the script.
    Enter Your Subject Here : this is the email subject, change it to whatever you want.
    Values submitted from web site form : : is the first line of your email. Change it to whatever you like.

    Once you are done with the changes, click on File, Save As, select File Type : All files, and save the script on your computer as “uploadaction.php

    Now lets create the Thankyou page. It will be a simple BV page, and will look like the following:




    Make sure to put your menubar in this page, so the visitors can go on navigating your site.

    Ok, we now need the error page: We will also create it in BV, and it will look as follows:




    Make sure to
    • Include your menubar: so, if the visitor CANNOT reduce his file size under the allowed limit, he will at least be able to continue navigating your dite.
    • Add a “Back to form” button. This one is easy. Select from the form toolbar, in BV, “Advanced”, double click the text to make it “Back to form”, then right click it and select Properties, just like in the image below:
    In the Advanced Button properties window that will appear, select the following (as in the image)


    Name: optional, “Back”
    Value: optional, “Back”
    Button Type: “On Click”
    OnClick Action: “Go to the previous Page”
    just like in the image below:


    If you wish you can also change the button style, but this goes beyond this tutorial purposes.


    So, now you have the following BV pages:
    • uploadform
    • thankyou_page
    • error
    Publish these pages in your public_html folder.

    Open BlueFTP, connect, and UPLOAD the “uploadaction.php” file that you created in Notepad, in public_html also.

    There is ONE LAST STEP: you need to create the “uploads” folder, for the files to be uploaded. So while you are in BlueFTP, click anywhere on the right window (the one with your site content). Now click on File, New Folder, and create this new folder named “uploads”. If you name it anything else, you will need to change the script accordingly. Now right click your new created folder, and set the permissions to 777.

    Congratulations! You are done. Test your form.

    Troobleshooting:

    If the filename has blank spaces, the URL of the file that you will receive in your email, will be broken. In that case, clicking on the link will not work. You need to either download the file from your site using BlueFTP, or, if you want to see the file in your browser, you will need to copy the entire link in your browser’s address bar.





    VodaHost

    Your Website People!
    1-302-283-3777 North America / International
    02036089024 / United Kingdom
    291916438 / Australia

    ------------------------

    Top 3 Best Sellers

    Web Hosting - Unlimited disk space & bandwidth.

    Reseller Hosting - Start your own web hosting business.

    Search Engine & Directory Submission - 300 directories + (Google,Yahoo,Bing)



  • #2
    Re: How to upload a file using a form

    I can see that your not a L.G. for nothing

    Thats a great tip, and will try it out soon.

    Thanks *****..
    Have fun
    Regards..... David

    Step by Step Visual Tutorials for the complete beginner
    Newbies / Beginners Forum
    FREE Membership Login Scripts: - Meta Tags Analyzer
    My Social Networking Site - Free Contact Forms
    Finished your New website!! Now get it noticed Here:

    Comment


    • #3
      Re: How to upload a file using a form

      Nice one, Mon General!!
      Last edited by VodaHost; 05-13-2006, 04:01 PM.

      VodaHost

      Your Website People!
      1-302-283-3777 North America / International
      02036089024 / United Kingdom
      291916438 / Australia

      ------------------------

      Top 3 Best Sellers

      Web Hosting - Unlimited disk space & bandwidth.

      Reseller Hosting - Start your own web hosting business.

      Search Engine & Directory Submission - 300 directories + (Google,Yahoo,Bing)


      Comment


      • #4
        Re: How to upload a file using a form

        wow thanks! your the man, thanks for the tip it will definetly help out.

        Raf..

        Comment


        • #5
          Re: How to upload a file using a form

          Now that Navaldesign has sorted out my form problem, I have another question. Is there any way that when someone uploads a file an automated e-mail is sent to them confirming that the file has been received? Almost like a receipt?

          Thanks again Navaldesign!
          http://www.pete-sloan.co.uk
          http://www.ragingmonkies.co.uk
          http://www.premiership-prediction.co.uk
          http://www.annacrook.co.uk
          http://www.kelsallfc.co.uk


          pete@pete-sloan.co.uk

          Comment


          • #6
            Re: How to upload a file using a form

            Yes, transform the above script as follows:

            <?php

            // Receiving variables


            @$email = addslashes($_POST['email']);
            @$upload_Name = $_FILES['upload']['name'];
            @$upload_Size = $_FILES['upload']['size'];
            @$upload_Temp = $_FILES['upload']['tmp_name'];


            // Validation for max file size

            if ($upload_Size>0)
            {
            if( $upload_Size >1000000)
            {
            //delete file
            unlink($upload_Temp);
            header("Location: error.html");
            exit;
            }
            $uploadFile = "uploads/".$upload_Name ;

            @move_uploaded_file( $upload_Temp , $uploadFile);
            chmod($uploadFile, 0644);
            $upload_URL = "http://www.yourdomain.com/uploads/".$upload_Name ;
            }

            //Sending Email to form owner

            $mailto = "youremail@yourdomain.com";
            $mailsubj = "Enter Your Subject Here";
            $mailhead = "From: $email\n";
            reset ($HTTP_POST_VARS);
            $mailbody = "Values submitted from web site form :\n";
            while (list ($key, $val) = each ($HTTP_POST_VARS))
            {
            if ($key!="submit")
            {
            $mailbody .= "$key : $val\n";
            }
            }
            $mailbody .= "upload: $upload_URL\n";
            mail($mailto, $mailsubj, $mailbody, $mailhead);

            // Autoresponder
            $mailto = $email;
            $mailsubj = "Copy of the info you Sumbitted";
            $mailhead = "From: your domain name or whatever you want\n";
            mail($mailto, $mailsubj, $mailbody, $mailhead);

            header("Location: thankyou_page.html");

            ?>


            As usual, replace the part in blue with your own Subject and "From....."
            Navaldesign
            Logger Lite: Low Cost, Customizable, multifeatured Login script
            Instant Download Cart: a Powerfull, Customized, in site, DB driven, e-products Cart
            DBTechnosystems.com Forms, Databases, Shopping Carts, Instant Download Carts, Loggin Systems and more....
            Advanced BlueVoda Form Processor : No coding form processor! Just install and use! Now with built in CAPTCHA!

            Comment


            • #7
              Re: How to upload a file using a form

              i have looked at this and done what it saids to do but i still can not get it to work i made the form but i dont get what is next can anyone help me make this page.i dont understand php

              Comment


              • #8
                Re: How to upload a file using a form

                Originally posted by jbyrd241
                i have looked at this and done what it saids to do but i still can not get it to work i made the form but i dont get what is next can anyone help me make this page.i dont understand php
                If you have built the form correctly, and you have published it, the next step is to build the "error" and "thankyou_page". Save them and publish them. Last, copy the above code in Notepad. Change the part in blue as per instructions. Save it as "uploadaction.php" on your computer. Use BlueFTP to upload it on your site.
                Navaldesign
                Logger Lite: Low Cost, Customizable, multifeatured Login script
                Instant Download Cart: a Powerfull, Customized, in site, DB driven, e-products Cart
                DBTechnosystems.com Forms, Databases, Shopping Carts, Instant Download Carts, Loggin Systems and more....
                Advanced BlueVoda Form Processor : No coding form processor! Just install and use! Now with built in CAPTCHA!

                Comment


                • #9
                  Re: How to upload a file using a form

                  *****,

                  yet another great resource for us to use.

                  thanks
                  Stevea

                  Comment


                  • #10
                    Re: How to upload a file using a form

                    Yet another great Tutorial. This Forum has got to be 'THE FOUNT OF ALL KNOWLEDGE'!

                    My thanks to you all!

                    Brian

                    Comment


                    • #11
                      Re: How to upload a file using a form

                      Can you spell out the upload to the public_html from notepad part in fine detail for a complete and total nubeee? Please and Thankyou!

                      Comment


                      • #12
                        Re: How to upload a file using a form

                        Open Notepad. Paste the above code. Now, change the above four parts in Blue with your actual values:

                        1000000 is the limit file size, in bytes ( 1 Mb = 1000000 bytes). You can set it to be whatever you want.

                        http://www.yourdomain.com/uploads is yourdomain name and folder (uploads) where the file will be uploaded. Please do not change the "uploads" part, as you would also need to modify the script.
                        Enter Your Subject Here : this is the email subject, change it to whatever you want.
                        Values submitted from web site form : : is the first line of your email. Change it to whatever you like.

                        Once you are done with the changes, click on File, Save As, select File Type : All files, and save the script on your computer as “uploadaction.php

                        I suggest that you save it inside your BlueVoda folder.

                        Sorry, but don't know how to make it simpler. Editing apart, the procedure is only 3 clicks.

                        As for the uploading part, open BlueVoda. Click on Tools, FTP Manager.

                        BlueFTP will appear, and your screen has your computer BlueVoda folder content in the left part.

                        Click on connect. If necessary, type in your IP, username and password, and click "connect". Now, the site content will appear in the right part of the screen.

                        Go to the left side, find the "uploadaction.php" file, and simply Drag and Drop it to the right part of the screen.
                        You are done!
                        Navaldesign
                        Logger Lite: Low Cost, Customizable, multifeatured Login script
                        Instant Download Cart: a Powerfull, Customized, in site, DB driven, e-products Cart
                        DBTechnosystems.com Forms, Databases, Shopping Carts, Instant Download Carts, Loggin Systems and more....
                        Advanced BlueVoda Form Processor : No coding form processor! Just install and use! Now with built in CAPTCHA!

                        Comment


                        • #13
                          Re: How to upload a file using a form

                          Thanks Navaldesign! I got it figured out.

                          Comment


                          • #14
                            Re: How to upload a file using a form

                            Hi Lt. General,

                            Please let me know what do you need to help me out on how to fix this script. I have my web page already complete but not able to launch because the image upload.

                            Thank you,
                            Edwin
                            cardone@coqui.net

                            Comment


                            • #15
                              Re: How to upload a file using a form

                              lol ty bud named folder upload instead of uploads. it works great now

                              Comment

                              Working...
                              X