What is the simplest ajax upload plugin or script to be used with wordpress?

1 Views

I’m trying to use image upload in my theme’s options page and haven’t found yet a simple ajax upload script with many tutorials or a good documentation, I just want a simple straightforward script so I just edit the file path and couple other stuff, and of course that works with many uploaders on the page.

I tried plupload but it’s complicated for me because I don’t know anything about javascript, just a little jQuery understanding.

Read More

So are there any simple ajax uploaders with a good tutorial about it?

Post Views: 1

Related posts

Leave a Reply

2 comments

  1. I have used the native uploader with great results. Try adding this snippet of JS:

    jQuery('#upload_image_button').click(function() {
  formfield = jQuery('#fwpPhoto').attr('name');
  tb_show('', 'media-upload.php?type=image&TB_iframe=true');
  return false;
});

window.send_to_editor = function(html) {
  imgurl = jQuery('img',html).attr('src');
  jQuery('#fwpPhoto').val(imgurl);
  tb_remove();
}

    Then, in your HTML:

    <input id="fwpPhoto" name="facultyPhoto" value="">
<input id="upload_image_button" type="button" value="Upload Image">

    For Multiple Uploaders

    <input id="facultyPhoto-1" name="facultyPhoto-1" value="" class="fwpPhoto">
<input id="upload_image_button-1" class="uploadButton" type="button" value="Upload Image">
<input id="facultyPhoto-2" name="facultyPhoto-2" value="" class="fwpPhoto">
<input id="upload_image_button-2" class="uploadButton" type="button" value="Upload Image">
<input id="facultyPhoto-3" name="facultyPhoto-3" value="" class="fwpPhoto">
<input id="upload_image_button-3" class="uploadButton" type="button" value="Upload Image">
<input id="facultyPhoto-4" name="facultyPhoto-4" value="" class="fwpPhoto">
<input id="upload_image_button-4" class="uploadButton" type="button" value="Upload Image">

<script type="text/javascript">
    jQuery(document).ready(function($){
        var target = '';
        $('.fwpPhoto').each(function(index) {
            var field = index + 1; //because index starts at 0

            jQuery('#upload_image_button-'+field).click(function() {
                formfield = jQuery('#facultyPhoto-'+field).attr('name');
                target = '#'+formfield;
                tb_show('', 'media-upload.php?    type=image&amp;TB_iframe=true');
                return false;
            });
        });
        window.send_to_editor = function(html) {
            imgurl = jQuery('img',html).attr('src');
            jQuery(target).val(imgurl);
            tb_remove();
        }
    });
</script>