This forum is a community forum meant for users of the plugin to collaborate and help solve issues with implementation, etc. Unfortunately, as the creator of the plugin, I do not have much time to attend to every request here as this is only a side project and I must work a full-time job to provide for my family. This is how I keep the Flash version free and the HTML5 version low cost.
UploadiFive 1.1.1 has been released which includes a small fix for added support on touch devices including iOS 6 devices.
Totally lost...Help passing parameters
  • I would post code, but nothing I've done is working and the more I look at it the more I'm going down the rabbit hole. Clearly I'm doing something wrong, but for all the posts I've read, I am lost w/o a GPS. Please help!

    What I want to do is upload a file, passing a field that has the name it should save as.

    Here is the code I've used...some is cribbed from other threads...


    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>UploadiFive Test</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js&quot; type="text/javascript"></script>
    <script src="jquery.uploadifive-v1.0.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="uploadifive.css">
    <style type="text/css">
    body {
    font: 13px Arial, Helvetica, Sans-serif;
    }

    .uploadifive-button {
    float: left;
    margin-right: 10px;
    }

    #queue {
    border: 1px solid #E5E5E5;
    height: 177px;
    overflow: auto;
    margin-bottom: 10px;
    padding: 0 3px 3px;
    width: 300px;
    }
    </style>
    </head>

    <body>
    <h1>UploadiFive Demo</h1>
    <form>
    <div id="queue"></div>
    <p>
    <input id="file_upload" name="file_upload" type="file" multiple="true">
    </p>
    <p>
    <label>New File Name
    <input type="text" name="newFilePrefix" id="newFilePrefix" value="testNewFilePrefixString">
    </label>
    </p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p> <a style="position: relative; top: 8px;" href="javascript:$('#file_upload').uploadifive('upload')">Upload Files</a></p>
    </form>
    <script type="text/javascript">
    $(function() {
    $('#file_upload').uploadifive({
    // Some options
    'method' : 'Post',
    'auto' : false,
    'queueID' : 'queue',
    'uploadScript' : 'uploadifive.php?newFileName=JamesWasHere',

    'onUploadStart' : function(){
    $('#file_upload').
    uploadifySettings('postData',{ 'newFilePrefix': $('#newFilePrefix').val() },0)},

    'onUploadComplete' : function(file, data) {
    console.log(data);
    console.log(file);
    },


    });
    });
    </script>
    </body>
    </html>


    On the server side I've tried this:

    <?php
    /*
    UploadiFive
    Copyright (c) 2012 Reactive Apps, Ronnie Garcia
    */

    // Set the uplaod directory
    $uploadDir = '/uploads/';
    $newFilePrefix = $_POST['newFilePrefix'];
    if (!empty($_FILES)) {
    $tempFile = $_FILES['Filedata']['tmp_name'][0];
    $uploadDir = $_SERVER['DOCUMENT_ROOT'] . $uploadDir;
    $targetFile = $uploadDir . $newFilePrefix . $_FILES['Filedata']['name'][0];


    // Validate the file type
    $fileTypes = array('jpg', 'jpeg', 'gif', 'png'); // Allowed file extensions
    $fileParts = pathinfo($_FILES['Filedata']['name'][0]);

    // Validate the filetype
    if (in_array($fileParts['extension'], $fileTypes)) {
    // Save the file
    move_uploaded_file($tempFile,($targetFile));
    echo 1;
    } else {
    // The file type wasn't allowed
    echo 'Invalid file type.';
    }
    }
    ?>
  • The problem is that you're using Uploadify calls with UploadiFive. uploadifySettings doesn't work with UploadiFive.

    Replace onUploadStart with onUpload and try this inside:

    $('#file_upload').data('uploadifive').settings.formData = { 'newFilePrefix': $('#newFilePrefix').val() },0)};
  • Ronnie,
    Thanks...

    When I plugged in your code I get a syntax error:

    'onUpload' : function(){$('#file_upload').data('uploadifive').settings.formData =
    { 'newFilePrefix': $('#newFilePrefix').val() },0)};



    I'm not sure I fully understood your code, but I was able to get rid of the syntax error by changing your line to


    'onUpload' : function(){$('#file_upload').data('uploadifive').settings.formData =
    {'newFilePrefix': $('#newFilePrefix').val()} },



    This got rid of the syntax error but now nothing shows in the box, and nothing gets uploaded.
  • As long as I'm asking for help...could you explain your code a bit...I've tried to decipher it, but I'm coming up empty, so I can't even debug it.
  • RonnieSan....are you here?
  • You can actually simplify the code I wrote a bit:
    'onUpload' : function(){this.settings.formData = {'newFilePrefix': $('#newFilePrefix').val()} }
    What's happening is right before upload, it's grabbing the value of the newFilePrefix field and updating the formData object to be sent with the upload. I replaced $('#file_upload').data('uploadifive') with 'this' because the function should be referencing the uploadifive object with 'this'.