Есть свой виджет который делает банер.
В виджет нада загружать картинку, но послее ее загрузки кнопка "Сохранить" не активируется (не снимается атрибут disabled), и чтобы ее активировать надо изменить input куда отправляется путь к картинке.
Пробовал затригерить события, но никак.
Сделал костыль через setInterval который постоянно активирует кнопку.
Кроме того, код который должен отрабатывать при клике на кнопку "Загрузить изображение" не отрабатывает.
код:
<?php
class Banner_Widget extends WP_Widget{
public function __construct()
{
// Add Widget scripts
add_action('admin_enqueue_scripts', array($this, 'scripts'));
$args = [
'name' => 'Банер',
'description' => 'банер в шапке'
];
parent::__construct('Banner_widget', 'Банер', $args);
}
/**
* Front-end display of widget.
*
* @see WP_Widget::widget()
*
* @param array $args Widget arguments.
* @param array $instance Saved values from database.
*/
public function widget( $args, $instance ) {
$image = ! empty( $instance['image'] ) ? $instance['image'] : get_template_directory_uri() . '/assets/img/logo.png';
echo <<<EOT
<div class="banner">
<div class="banner_dark"></div>
<img src="$image" alt="">
</div>
EOT;
}
/**
* Back-end widget form.
*
* @see WP_Widget::form()
*
* @param array $instance Previously saved values from database.
*/
public function form( $instance ) {
$image = ! empty( $instance['image'] ) ? $instance['image'] : '';
?>
<p>
<label for="<?php echo $this->get_field_id( 'image' ); ?>"><?php _e( 'Выберите изображение:' ); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id( 'image' ); ?>" name="<?php echo $this->get_field_name( 'image' ); ?>" type="text" value="<?php echo esc_url( $image ); ?>" />
<button class="upload_image_button button button-primary">Загрузить изображение</button>
</p>
<script>
jQuery(document).ready(function ($) {
setInterval(function(){
jQuery('#widget-banner_widget-2-savewidget').val('Сохранить').prop('disabled', false);
}, 500);
$('.upload_image_button').on("click", function (e) {
e.preventDefault();
var $button = $(this);
// Create the media frame.
var file_frame = wp.media.frames.file_frame = wp.media({
title: 'Select or upload image',
library: { // remove these to show all
type: 'image' // specific mime
},
button: {
text: 'Выбрать'
},
multiple: false // Set to true to allow multiple files to be selected
});
// When an image is selected, run a callback.
file_frame.on('select', function () {
// We set multiple to false so only get one image from the uploader
var attachment = file_frame.state().get('selection').first().toJSON();
$button.siblings('input').val(attachment.url);
/*$button.parents('.widget-inside').trigger('input');
$('#widget-banner_widget-2-savewidget').trigger('input');
$('#widget-banner_widget-2-savewidget').trigger('change');*/
jQuery('#widget-banner_widget-2-savewidget').val('Сохранить').prop('disabled', false);
//$('#widget-banner_widget-2-savewidget').val('Сохранить');
//$('#widget-banner_widget-2-savewidget').val('Сохранить').prop('disabled', false);
//$('#widget-banner_widget-2-savewidget').prop('disabled', false);
file_frame.close();
});
// Finally, open the modal
file_frame.open();
});
});
</script>
<?php
}
/**
* Sanitize widget form values as they are saved.
*
* @see WP_Widget::update()
*
* @param array $new_instance Values just sent to be saved.
* @param array $old_instance Previously saved values from database.
*
* @return array Updated safe values to be saved.
*/
public function update( $new_instance, $old_instance ) {
$instance = array();
$instance['image'] = ( ! empty( $new_instance['image'] ) ) ? $new_instance['image'] : '';
return $instance;
}
public function scripts()
{
wp_enqueue_script( 'media-upload' );
wp_enqueue_media();
wp_enqueue_script('our_admin', get_template_directory_uri() . '/assets/js/our_admin.js', array('jquery'));
}
}