How to lock WooCommerce date created on administration area

Hello there someone helped me, regarding my case on woocommerce, I want to lock the date created on woocommerce back-end area when you add order on back-end area.

I have found the same case here - link here

Is there any available snippets that doesn't require any JavaScript

Solution

So there we go. You first need to create a admin.js file in your child theme. You can put this into a folder named js:

- ChildTheme
   - js
    - admin.js

After this we need to include this file into WordPress. For this you need to put this part of code into your functions.php file:

/**
 * Add ressources to dashboard page
 */
add_action( 'admin_enqueue_scripts', 'admin_enqueue_styles' );
function admin_enqueue_styles() {
    wp_enqueue_script( 'admin-js', get_stylesheet_directory_uri() . '/js/admin.js' );
}

Now your admin.js is known within the WordPress backend. Open now the file and put this into your file to disable the date and time input of WooCommerce orders:

jQuery(document).ready(function () {
    jQuery(".order_data_column .date-picker, .order_data_column .hour, .order_data_column .minute").prop('disabled', true);
});

Save it and upload it onto your server. Clean the cookies and reload the page. The date and time input should be now disabled. Let me know if it works for you.

UPDATE

If you want to use CSS, you should not just disable all date-picker classes. I would be more specific here and just disable the date pickers you really want to disable:

.order_data_column .date-picker,
.order_data_column .hour,
.order_data_column .minute {
    pointer-events: none;
}

And to make it more fancy, you can set the cursor for the wrapper to not-allowd:

#order_data .order_data_column .form-field {
    cursor: not-allowed;
}

This goes into your admin.css file.

Bot solutions are working. Both of them has advantages and disadvantages.

The JS solution is HTML based because this sets a disabled parameter to each specified input field. This is a backend-code solution.

The CSS solution don't disables the input at all. You just disable the cursor click to this specific field. So this is a view-based solution.