'Use Ajax to change payment plugins state
I tried to create plugin that to customize woocommerce payments setting page , I create it with ajax code but i cant complete the plugin and make it work. My js code
(function ($) {
$(document).on('change', '.wsd-plugin-controller-toggle', function () { //checkbox
let initiator = $(this),
data = {
'action_type': initiator.data('state'),
'plugin_slug': initiator.data('plugin-slug')
};
$.ajax({
url: plugins_controller.rest.endpoints.update_state,
type: "POST",
data: data,
beforeSend: function (xhr) {
xhr.setRequestHeader('X-WP-Nonce', plugins_controller.rest.nonce);
initiator.closest('.wsd-toggler').find('.wsd-loading').toggleClass('visible');
},
success: function (response) {
console.log(response);
initiator.data('state', response.state);
if (initiator.data('reload')) {
location.reload();
}
$(document).trigger('wsd-plugin-state-updated', [initiator, response]);
initiator.closest('.wsd-toggler').find('.wsd-loading').toggleClass('visible');
},
error: function (response) {
console.log('error ', response);
initiator.prop('checked', false);
$(document).trigger('wsd-plugin-state-update-failed', [initiator, response]);
initiator.closest('.wsd-toggler').find('.wsd-loading').toggleClass('visible');
}
});
});
})(jQuery);
and my html code
<td class="title">
My Fatoorah
</td>
<td class="status">
<div class="wsd-toggler">
<input id="toggler-csCeE5" type="checkbox" class="wsd-toggler-input wsd-plugin-controller-toggle" data-plugin-slug="myfatoorah-woocommerce/myfatoorah-woocommerce.php" data-state="activate">
<label for="toggler-csCeE5" class="check-trail wsd-toggler-shape">
<span class="check-handler wsd-toggler-handler"></span>
</label>
<img src="\wordpress\wp-content\plugins\store_settings\assets\images\spinner.svg" class="wsd-loading" alt="loading">
</div>
</td>
<td class="moderate">
<select class="wsd-payment-popup-select wsd-hidden" onchange="location = this.value;">
<option selected="" disabled="" hidden="">إدارة</option>
<option value="/wordpress/wp-admin/admin.php?page=wc-settings&tab=checkout&section=myfatoorah_direct">
الدفع المباشر
</option>
<option value="/wordpress/wp-admin/admin.php?page=wc-settings&tab=checkout&section=myfatoorah_v2">
كارت
</option>
</select>
</td>
</tr>
And my main page php i add
add_action('admin_enqueue_scripts', 'load_payment_style');
function load_payment_style()
{
wp_enqueue_style('plugins_controller_style', plugins_url('style.css', __FILE__));
wp_enqueue_script('plugins_controller', plugins_url('plugins_controller.js', __FILE__));
wp_localize_script( 'plugins_controller', 'plugins_controller',
array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ,
'ajax_nonce' => wp_create_nonce( 'plugins_controller' ) ) );
}
I need to chang payment state (active / deactive) by toggler like this payment setting page
thank you
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
