Quick Edit Custom Fields with Toolset

  • gcoyle1

    (@gcoyle1)


    3 years, 4 months ago

    I am currently working on developing a functionality that would be very helpful for my website. I would like to be able to edit the custom post fields I have created using the plugin ‘Toolset’ using the word press’s quick edit functionality. In it’s current state my code is able to correctly update the data point the exists for my custom ‘Post Order’ field. The only issue I am running into now is getting the html input box that I’ve added to the ‘Quick Edit’ form to populate with the current ‘Post Order’ data for which ever post I click the ‘Quick Edit’ button on. Currently the code pulls the data for only the page on the top row. The problem is that I need it do be able to distinguish which row I am clicking quick edit on and then populate the input field for ‘Post Order’ on the quick edit form with the post’s respective data.

    I’ve attached the code I have written to this post. Any insight on how I could accomplish populating that input field based on which post is chosen for quick edit would be incredible!

    Here is my ‘functions.php’ file

    <?php
add_post_type_support( 'page', 'excerpt' );
/*
function wpdocs_theme_add_editor_styles() {
add_editor_style( 'editor-style.css' );
}
add_action( 'admin_init', 'wpdocs_theme_add_editor_styles' );
*/


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

function quick_edit_fields( $column_name, $post_type){

	switch ( $column_name ){
		
		case 'wpcf-post-order': {
			$post_id_test = get_the_ID(); // getting the post id
			$order_value = get_post_meta($post_id_test,'wpcf-post-order',true);	// returning custom 'Post Order' data point		
		?>
			<fieldset class='inline-edit-col-left'>
				<div class='inline-edit-col'>
					<label>
						
						<input type='number' name='order' value='<?php echo $order_value ?>'> Post Order
					</label>
				</div>
			</fieldset>
			
			<?php
			$post_id_test = NULL;
			break;
					
		}			
	}	
}

add_action('save_post', 'quick_edit_save');

function quick_edit_save($post_id){
	
	if ( ! wp_verify_nonce( $_POST['_inline_edit'], 'inlineeditnonce')){
		return;
	}
	
	$order = ! empty($_POST['order']) ? absint($_POST['order']) : 0;
	update_post_meta($post_id, 'wpcf-post-order', $order);
	
}

    Please let me know if I can provide any clarification regarding the code or my desired outcome!

Viewing 1 replies (of 1 total)
  • Moderator bcworkz

    (@bcworkz)

    3 years, 4 months ago

    I don’t really know how the quick edit feature really works, but after a little investigation perhaps I can shed a little light on the subject. You may already know some of this, but it’s all news to me.

    There’s only one quick edit form for the entire list table page. Most of the fields in the form are initially blank or contain placeholders. When you click a post’s quick edit action link, jQuery moves the form to the relevant location and causes it to become visible after it had populated the fields with the values for the chosen post.

    You’ll need to do the same for your fields. Add click event listeners to the quick edit action links to trigger you jQuery script. As usual, the item clicked is available as this. Because the form may have been populated for another post, clear any existing field values. The current post ID can be extracted from one of the DOM containers in which this occurs. Walk up the DOM tree until you get to an element where the ID can be determined. You can get your associated values for the current post via Ajax or API request. Assign the returned values to their respective form fields.

    The jQuery that WP uses for its part in this is in /wp-admin/js/inline-edit-post.js. It may serve as a useful guide towards your own efforts.

Viewing 1 replies (of 1 total)

The topic ‘Quick Edit Custom Fields with Toolset’ is closed to new replies.