Solved

Uploadify tutorial with insert/update for PHP and MySQL

Posted on 2010-09-24
6
7,263 Views
Last Modified: 2013-12-12
Hello,
I'm trying to use Uploadify (http://www.uploadify.com), pretty nice jQuery script when it comes to upload files on the server with included examples, and a real pain - mostly cause of lack of documentation - when it comes to use it with a record insert or update (with PHP and MySQL)

This is my flow:
I have a form with some fields and an "uploadified" file field
When I complete to upload a file, I should have in return a hidden file field with the full path of the uploaded file
At this point, the file is uploaded and the form is ready to be inserted in the database (I'll store only the path of the file, non the "BLOB" image)

Seems pretty straight, insn't it? Well, it's a real pain
'Til now I can upload a file and get the hidden field, but here I come with a big trouble...
I use a PHP class to upload and manipulate the uploaded file (mostly images), so that files that accidentally have the same name automatically get an incremental number (myPicture.jpg, myPicture_1.jpg, myPicture_2.jpg, etc...); well, Uploadify simply ignore this: if I upload the file "myImage.jpg" and there's yet a "myImage.jpg" on the server, the PHP class renames it in "myImage_1.jpg", while Uploadify still retains "myImage.jpg", so that it's unuseful...
In other words, Uploadify uses the filename that it supposes to be, NOT the real file name as returned by the PHP class

Is there a comprehensive Uploadify + Insert/update + PHP + MySQL tutorial out there?

I attach the files I'm using: please create a database, execute the uploads.sql file, modify connection setting in /Connections/connIWF.php and launch the /uploadify/index.php
upload.zip
0
Comment
Question by:ivanhalen
  • 3
  • 2
6 Comments
 
LVL 16

Expert Comment

by:CodedK
ID: 33771045
Hi.
Its simple really.
Uploadify uses a randomizer and you can also send a variable FROM js TO PHP.
Uploadify ( parameters) one of those parameters is "scriptData" you can pass for example the unique id of the field you want to update or just a random 6 digit.

Then from php use it like this:
 md5($_REQUEST['your var with random number'] + image name)  
Working like this you ll never need name changes
0
 

Accepted Solution

by:
ivanhalen earned 0 total points
ID: 33771731
CodedK, I can use "scriptData" but this sounds more like "you can send the new name to rename your pictures" rather than "you can retrieve the real name in this way", that is what I was looking for

The solution that I found is really simple: in the PHP manipulation file I output the new image name with a simple echo statement and then I use the "response" argument in the onComplete method to fill a hidden field

That's all


'onComplete': function(event, queueID, fileObj, response) {
  $("#my_hidden_field_ready_for_db_insert").val(response);
}

Open in new window

0
 
LVL 16

Expert Comment

by:CodedK
ID: 33776457
This is one of the things i thought you would not have problem to deal with!

Of course afterwards you can echo the response since uploadify has a callback waiting for a response.
But what i'm telling you is a way (that everyone uses) so uploadify wont ever replace an existing file.

I was answering this from my mobile and it was hard to write a complete answer.
The manual you are looking for is here :
http://www.scribd.com/doc/19252816/Uploadify-v210-Manual

The tutorial is here:
http://www.cagintranet.com/archive/how-to-implement-uploadify-into-an-application/

But i've read those one year before and i must tell you that there are a LOT of problems that they dont mention.

Hiding names on complete and then with an AJAX saving the name to the database is not really complete.

You will have many issues and you will have to change .htaccess files , configuration files in the server, folder permissions, post data size etc.

When uploadify meets an error it will have 3 ways to deal with it.

        'onError'       : function (a, b, c, d) {
                            if (d.status == 404)
                             alert('Error occured. Try again.');  //Could not find upload script.
                            else if (d.type === "HTTP")
                             alert('error '+d.type+": "+d.status);
                            else if (d.type ==="File Size")
                            alert(c.name+' '+d.type+' Limits: '+Math.round(d.sizeLimit/1024)+'KB');
                            else
                             alert('error '+d.type+": "+d.text);
                            },

There are a lot of errors that will not meet the criteria to make uploadify stop and then you will have a record to your database and no file to the server !

The way to go is with in the php script not on complete !


Inside php last line :


      $tempFile = $_FILES['Filedata']['tmp_name'];  /// <<<<
      $targetPath = $_SERVER['DOCUMENT_ROOT'] . $_REQUEST['folder'] . '/';
        $encoded_filename =
           md5( $stick."-".$_FILES['Filedata']['name']).".".strtoupper(findexts($_FILES['Filedata']['name']));
        $targetFile =  str_replace('//','/',$targetPath) .$encoded_filename;


$sql_statment = "UPDATE image_field SET my_image='/s_".RemoveExtension($encoded_filename).".".strtoupper(findexts($targetFile))."' WHERE id=".$_REQUEST['stick']."";


Using this way along with an echo and onComplete you will never have a record without an image.

If you need any help completing the task i will be here.


Hope this is helpful.
0
Space-Age Communications Transitions to DevOps

ViaSat, a global provider of satellite and wireless communications, securely connects businesses, governments, and organizations to the Internet. Learn how ViaSat’s Network Solutions Engineer, drove the transition from a traditional network support to a DevOps-centric model.

 

Author Comment

by:ivanhalen
ID: 33776592
Quote: "There are a lot of errors that will not meet the criteria to make  uploadify stop and then you will have a record to your database and no  file to the server !"

Well, as I wrote in my first post, I was looking for a tutorial where file upload and insert/update database are two different processes

In the first, I upload a picture and, in return, I get a hidden field filled (if no upload took place, or if something went wrong, the hidden field is never filled and my validation - client or server side - alerts me about this, preventing from going further... so I guess I can still deal with onComplete)

In the second, I have all the form fields filled and I can insert/update database

Seems that your code does upload and database stuff all at once, that's not what I was looking for...
0
 
LVL 16

Expert Comment

by:CodedK
ID: 33777097
Ok
0
 

Expert Comment

by:sanjshah12
ID: 34393461
does anyone have an asp version of using Uploadify?
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

How to build a simple, quick and effective accordion menu using just 15 lines of jQuery and 2 css classes
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

830 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question