So I have a very unique issue for a project I am working on and I cannot seem to figure it out. I will try my best to explain the task at hand.
I need to create an image uploader that will allow users to upload multiple images. Upon upload of their images, they will be required to submit a caption. Upon caption submission, the form will be sent to a script in our CMS (we use a provided CMS where code is extremely strange and out of our control). I have gotten this to work successfully using a single file upload, but whenever I attempt to run multiple files, I get a system error in our CMS.
I think a little back story can help you all to understand the situation a bit more. Before I got this project thrown at me, our company used some Yahoo multi file uploader with all the bells and whistles and things that make people smile. Well the problem is, the smiles started to go away when every one of our customers began complaining about files not uploading correctly. So my boss came to me (the so called nerd of the office) and asked if I knew anything about file uploads. Of course, I replied. But I had no idea what they were looking to do. He then explained the issue and asked if I thought I could duplicate what they currently had. Anyone in Corporate America knows that I should've said no, but they also understand the importance of me saying, yes.
In any event, it could possibly be my a** if this thing isn't functioning by COB Monday! I have all weekend to figure this thing out. Any help would be greatly appreciated.
My Form
I have a simple html form. It simply grabs the file and sends it to the server using a script provided to us by our CMS. We will never see what this script looks like but we do know that it works (seeing as the Yahoo file uploader worked...yes there were errors sometimes but overall it worked). So in the end, my HTML looked as follows:
<form id="myForm" action="some_crazy_url/to_our_cms/file_uploader" method="post" enctype="multipart/form-data" target="hiddenframe">
<input type="file" multiple="multiple" id="file_1" name="data" />
Caption: <textarea name="caption"></textarea>
<input type="submit" value="Submit Comment" />
</form>
<iframe style=”width:300px;height:300px;border:0px;” name="hiddenframe" id="hiddenframe_obj" />
The name of the input field HAS to be 'data', that's how it returns info to the CMS. The required fields are 'data', and 'caption', both of which I have. When you submit this form, the following information is returned:
NOTE: IGNORE THIS URL was actually a full blown URL but I removed it for obvious policy reasons.
To me, this looks like some type of JSON feed which is good. It found the two variables successfully and is ready to be saved. I understand how to get to this step when there is only one file I am dealing with. But how can I do this for multiple files? I have tried the following with my HTML and neither worked:
<form id="myForm" action="some_crazy_url/to_our_cms/file_uploader" method="post" enctype="multipart/form-data" target="hiddenframe">
<input type="file" multiple="multiple" id="file_1" name="data" />
<input type="file" multiple="multiple" id="file_2" name="data" />
Caption: <textarea name="caption"></textarea>
<input type="submit" value="Submit Comment" />
</form>
<iframe style=”width:300px;height:300px;border:0px;” name="hiddenframe" id="hiddenframe_obj" />
also tried...
<form id="myForm" action="some_crazy_url/to_our_cms/file_uploader" method="post" enctype="multipart/form-data" target="hiddenframe">
<input type="file" multiple="multiple" id="file_1" name="data[]" />
Caption: <textarea name="caption"></textarea>
<input type="submit" value="Submit Comment" />
</form>
<iframe style=”width:300px;height:300px;border:0px;” name="hiddenframe" id="hiddenframe_obj" />
Both of these return errors. I have posted them below responsibly:
1.)
2.)
I understand that my files are being processed correctly when processing one by one. This has to mean that it is possible to run some sort of script that allows for multiple versions of these files to be processed. I have some javascript/jquery/ajax know how, but not enough to understand what needs to be done here. I will be on this computer all day attempting to figure this thing out (there goes the weekend). I will reply to your responses, suggestions, tests immediately as well as expose as much information as I can without breaching policy. As I said before, any help would be greatly appreciated. Also, if you have any questions regarding anything I have went over in my question (regarding the CMS, form submission, deadline, my system, anything), feel free to ask. Fingers crossed! And as always, thanks in advance!!
BlkMaj