Back to Top

How to add Custom Field in Quick Edit menu WordPress?

Add Custom Field in QuickEdit Option Wordpress

In previous article, I have explained about To Create custom field in Woocommerce Products Admin Panel and today I continue with article with to add quick edit custom box in WordPress.

In this article, You will get an idea to add custom box into quick edit option provided into WordPress.

So, let’s understand the code. First of all will add action hook ‘quick_edit_custom_box’ which is used to add HTML field into quick edit section.

add_action( 'quick_edit_custom_box', 'add_to_bulk_quick_edit_custom_box', 10, 2 );

function add_to_bulk_quick_edit_custom_box( $column_name, $post_type ) {
    switch ( $post_type ) {
        case 'product':
        switch( $column_name ) {
            case 'product_checkbox': global $post;
            ?> 
php break; } break; }

Next, action hook is about to write javascript code which add the script into footer and append, remove and set a value of the field into quick edit custom box.

QuickEdit means inline update code and field value so for that we have to call ajax request which will update information into a database without refreshing a page. so, here you can see, I have called ajax function.

Must Read: WordPress : To add custom post type into RSS

add_action('admin_footer', 'myown_quick_edit_javascript');
function myown_quick_edit_javascript() 
{
    global $current_screen,$post;
    if (($current_screen->post_type != 'product')) return;
    ?>
    

This is PHP function which is used for responding an ajax request and update value of the field into a database.

function ajaxDataSubmit(){
    global $wpdb;
    $id = $_POST['id'];
    echo $id;
    die;
}

Here is the action hook used for ajax request and will store information of field into a database.

add_action('wp_ajax_ajaxDataSubmit', 'ajaxDataSubmit');//Logged in users
add_action('wp_ajax_nopriv_ajaxDataSubmit', 'ajaxDataSubmit'); // For not logged in users
add_filter('post_row_actions', 'myown_expand_quick_edit_link', 10, 2);

function myown_expand_quick_edit_link($actions, $post) {
    global $current_screen;
    if (($current_screen->post_type != 'product'))
    return $actions;
    $nonce = wp_create_nonce( 'product_checkbox'.$post->ID);
    $myfielvalue = get_post_meta( $post->ID, 'product_checkbox', TRUE);
    $actions['inline hide-if-no-js'] = '<a href="#" class="editinline" title="';
    $actions['inline hide-if-no-js'] .= esc_attr( __( 'Edit this item inline' ) ) . '"';
    $actions['inline hide-if-no-js'] .= " onclick=\"set_custom_value('{$myfielvalue}')\" >";
    $actions['inline hide-if-no-js'] .= __( 'Quick Edit' );
    $actions['inline hide-if-no-js'] .= '';
    return $actions;
}

'post_row_actions' action hook is used to expand quick edit box with adding a custom field into that box.

Read about: Introduction to Transient API in WordPress

Next, is to save data into WordPress and below action hook is used to store the custom field value into the database when passing data into a post.

add_action('save_post', 'myown_save_quick_edit_data');
function myown_save_quick_edit_data($post_id) { // print_r($_REQUEST);
    // verify if this is an auto save routine.
    if ( defined('DOING_AUTOSAVE') && DOING_AUTOSAVE )
    return $post_id;
    // Authentication passed now we save the data
    if ('product' == $_POST['post_type']) {
        $my_fieldvalue = esc_attr($_REQUEST['product_checkbox']);
        if (isset($_REQUEST['product_checkbox']) && $my_fieldvalue != '')
        {
            update_post_meta( $post_id, 'product_checkbox','yes');
        }
        else
        {
            update_post_meta( $post_id, 'product_checkbox', 'no');
        }
    }
    return $my_fieldvalue;
}

Storing of data is done. So that’s it our code is also done. You can use this code to add the custom field into Quick Edit option provided by WordPress.

Hope this helps someone else out.As always, thanks for reading. Don't Forget to Follow us on Twitter or Subscribe us to Get the Latest Updates.

Comments (1)

  1. thanks for this post …

    i am looking for this way to edit custom field data in wordpress admin panel but i don’t think can do it …

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Most Popular Posts

Top 10 JavaScript Charting Libraries

Posted on 4 years ago

Bhumi

Ajax Synchronous and asynchronous requests

Posted on 2 years ago

Bhumi

How to Animate SVG Image with example

Posted on 4 years ago

Bhumi

Hello world

Updated 1 week ago

Nick Carter

In depth Understanding of Laravel Core

Updated 2 months ago

Bhumi

ECMAScript 6 New Features – 2

Updated 1 year ago

Bhumi

The Reader’s Poll – June 2015

Posted on 4 years ago

Bhumi

The Reader’s Poll – August 2014

Posted on 4 years ago

Bhumi

The Reader’s Poll – June 2014

Posted on 5 years ago

Bhumi

The Readers’ Poll – May 2014

Posted on 5 years ago

Bhumi

The Readers’ Poll – August 2013

Posted on 5 years ago

Bhumi