Reputation: 570
I am creating a plugin for courier service to book and track shipment from woocommerce order admin page. I am creating a column name Trax and here is the code
add_action( 'manage_shop_order_posts_custom_column', 'trax_value_function', 2 );
function trax_value_function($column) {
if ($column == 'trax') {
global $post;
$data = get_post_meta($post->ID);
$apiKey = get_option('trax_api');
$dvs_courier_tracking = get_post_meta( $post->ID, '_dvs_courier_tracking', true );
//model box
add_thickbox();
echo '<a href="#TB_inline?width=600&height=550&inlineId=modal-window-id" class="thickbox">Track Order</a>';
echo '<div id="modal-window-id" style="display:none;">';
$apiUrl = "https://sonic.pk/api/shipment/track?tracking_number=".$dvs_courier_tracking."&type=0";
$headers = ['Authorization:' . $apiKey, 'Accepts:' . 'application/json'];
$curl = curl_init();
curl_setopt($curl,CURLOPT_URL, $apiUrl);
curl_setopt($curl,CURLOPT_RETURNTRANSFER, true);
curl_setopt($curl, CURLOPT_HTTPHEADER, $headers);
curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
$buffer = curl_exec($curl);
curl_close($curl);
// Display Trax Courier Tracking;
$data = json_decode($buffer, true);
echo '<div class="dvs-right-50">';
echo '<strong>Tracking Details</strong>';
foreach ($data['details']['tracking_history'] as $a) {
echo '<br>';
echo '<strong>Date: </strong>' . $a['date_time'];
echo '<br>';
echo '<strong>Status: </strong>' . $a['status'];
echo '<br>';
echo '<strong>Reason: </strong>' . $a['status_reason'];
echo '<br>';
}
echo '</div>';
}
}
The code is working fine and give me output but it make Woocommerce admin order page very slow when i visit this link https://mywebsite.com/wp-admin/edit.php?post_type=shop_order
It take very long to load the page because for every order curl api runs and capture the json data. I want when I click the "Track Order" button then curl command run and display data in thickbox.
Please help.
Upvotes: 0
Views: 733
Reputation: 743
in this case you will need to include your function in an Ajax function and only fire it when that button is clicked. FOr this, you will need to insert some js code into the admin page on Woocommerce.
1 - Insert your function into Ajax fn:
add_action ( 'wp_ajax_' . 'track_order_now', 'trax_value_function' );
2 - Insert JS into the order page:
function js_enqueue() {
jQuery(document).ready( function($) {
var valueCheck;
$('#ProductNameID').on( 'change', function () {
valueSelect = $(this).val();
if ( parseInt ( valueSelect ) > 0 ) {
$.ajax(
ajaxurl, // The remote URL address that starts the remote execution of WP
{
type: 'POST', // you can choose among any of HTTP request methods
data: { action: 'track_order_now', // The name of the WP action
value: valueSelect, // The dataValues
// if you need it, other dataValues as elements of the object data
},
dataType: 'json', // we inform that we are going to receive PHP results as a JSON array
// ... other parameters for configuring the AJAX call if you need it
// Here the third section
});
}
});
});
}
add_action('admin_enqueue_scripts', 'js_enqueue');
3 - Add the 'Track Order Button'
function portals_link($actions, $post)
{
global $post;
// Check if the post type is Woocommerce order
if ($post->post_type=='shop_order')
{
$actions['request_portal'] = '<a class='track_order' href="'.$URL.'?ui=request" title="" rel="permalink">Request Portal</a>';
}
return $actions;
}
add_filter('post_row_actions', 'track_order', 10, 2);
More details here: http://www.joanmiquelviade.com/how-to-create-an-ajax-call-in-wordpress-step-by-step/
Hope this help, you will need to do extra work on your own. To program the whole plugin might some time, I'm open for hiring in case you need a full plugin for your project.
Upvotes: 0