How to use default media upload in plugin page

Posted: June 5, 2015 in Uncategorized
Tags: , , , , ,

PHP CODE

wp_enqueue_media();

 

 

HTML CODE
<a class="ls_test_media" href=";">Click To Attach File</a>

<span style="display:none;" class="txt_show_des">Selected File</span>
<a href="" class="show_fplink" target="_blank"></a>

jQuery Code

jQuery(document).ready(function($) {
//uploading files variable
var custom_file_frame;
var click_btn_obj ;
jQuery(document).on(‘click’, ‘.ls_test_media’, function(event) {
event.preventDefault();
click_btn_obj=$(this);
//If the frame already exists, reopen it
if (typeof(custom_file_frame)!==”undefined”) {
custom_file_frame.close();
}

//Create WP media frame.
custom_file_frame = wp.media.frames.customHeader = wp.media({
//Title of media manager frame
title: “Sample title of WP Media Uploader Frame”,
/*library: {
type: ‘image’
},*/
button: {
//Button text
text: “insert File”
},
//Do not allow multiple files, if you want multiple, set true
multiple: false
});

//callback for selected image
custom_file_frame.on(‘select’, function() {

var attachment = custom_file_frame.state().get(‘selection’).first().toJSON();
var get_img_path = attachment.url;
//alert(get_img_path);
// alert(click_btn_obj);
//$(click_btn_obj).siblings(‘.txt_admin’).val(get_img_path);
// $(click_btn_obj).siblings(‘.file_result’).html(get_img_path);
$(click_btn_obj).siblings(‘.show_fplink’).attr(‘href’,get_img_path);
$(click_btn_obj).siblings(‘.show_fplink’).html(get_img_path);
$(click_btn_obj).siblings(‘.set_filepath_hidden’).val(get_img_path);
$(click_btn_obj).siblings(‘.txt_show_des’).show();

/*var selection = custom_file_frame.state().get(‘selection’);
selection.map(function(attachment) {
attachment = attachment.toJSON();
//alert(attachment.url);
});*/
//do something with attachment variable, for example attachment.filename
//Object:
//attachment.alt – image alt
//attachment.author – author id
//attachment.caption
//attachment.dateFormatted – date of image uploaded
//attachment.description
//attachment.editLink – edit link of media
//attachment.filename
//attachment.height
//attachment.icon – don’t know WTF?))
//attachment.id – id of attachment
//attachment.link – public link of attachment, for example “”http://site.com/?attachment_id=115″&#8221;
//attachment.menuOrder
//attachment.mime – mime type, for example image/jpeg”
//attachment.name – name of attachment file, for example “my-image”
//attachment.status – usual is “inherit”
//attachment.subtype – “jpeg” if is “jpg”
//attachment.title
//attachment.type – “image”
//attachment.uploadedTo
//attachment.url – http url of image, for example “http://site.com/wp-content/uploads/2012/12/my-image.jpg&#8221;
//attachment.width
});

//Open modal
custom_file_frame.open();
});

});

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s