jQuery & WordPress Media Manager Question
I am looking for some help around jQuery and Wordpress. I have managed to get the default Wordpress media upload/manager working in a custom plugin I have written. Basically the plugin is a custom post page that allows users to post fitness updates to a fitness blog I run. I wanted to give users the ability to upload GPX and image files to their post. Using the default Wordpress media upload/manager made the most sense. After looking around the web it was pretty easy to implement but I am stuck on one part with the jQuery which I am the least familiar with. I am hoping that someone can get me pointed in the right direction. Here is the code that I have working up to a point right now.
In my custom post form I have image upload input field and button. Pretty straight forward HTML here.
- <label for="upload_image">
<input id="upload_image" type="text" size="36" name="upload_image" value="" />
<input id="upload_image_button" type="button" value="Upload Image" />
<div style="font-size:10px;">Upload a GPX file to be added to your fitness update.</div>
</label>
When the Upload Image button is clicked the default Wordpress media upload/manager launches in thickbox. I can upload the necessary file without issue. All controlled by Wordpress. Now the jQuery I am using was originally written for image uploads. It essentially pastes the uploaded image URL back to the form and into the text field from the above HTML form field. I am new to jQuery and this is where I need help. The jQuery to copy the image URL to the form is as follows and it works as long as I am using an image.
- $('#upload_image_button').click(function() {
formfield = jQuery('#upload_image').attr('name');
tb_show('', 'media-upload.php?TB_iframe=true');
return false;
});
window.send_to_editor = function(html) {
imgurl = $('img',html).attr('src');
jQuery('#upload_image').val(imgurl);
tb_remove();
}
I understand what is happening here. Now I need to change this part....
- imgurl = $('img',html).attr('src');
jQuery('#upload_image').val(imgurl);
If the file I have uploaded and requested to be sent back to my form text field is an image file then all works fine. But the file I am letting users upload is a GPX file and not an image file. ( GPX is essentially a XML formatted file that contains GPS data). When I upload a GPX the src (URL) is not sent back to the form. I know why since the file uploaded wouldn't have a 'img' tag or the attribute of 'src'. But I not sure what it would have for something other than an image file. Where does jQuery get that from?
I hope this is clear enough.