Change value of a post-object field with custom jQuery

• raphael

• December 6, 2021 at 6:18 pm

Hi there,

I’m trying to change the value of a post-object field with some custom jQuery.

Basically, instead of having to search into a large list of post, I would like to display popular posts in some buttons, so the user can simply click on a popular post, and the value of the post-object will change.

Here is what I did on the acf/render_field :

add_action('acf/render_field/name=id_projet', 'show_field_details', 1);
function show_field_details($field) {
	$the_query = new WP_Query( array('post_type'=>'projet','posts_per_page'=>2) );
	if ( $the_query->have_posts() ) {
			echo "<div class='liste_projets_nouveaux'>";
	    while ( $the_query->have_posts() ) {
	        $the_query->the_post();
					echo "<a class='button' rel='".get_the_id()."'>".get_the_title()."</a>";
	    }
			echo "</div>";
	} else {
	    // no posts found
	}
	wp_reset_postdata();
}

And here is my jquery:

  jQuery('.liste_projets_nouveaux a').on( "click", function() {
    jQuery('#acf-field_61ab8de602ba7-input').val(jQuery( this ).attr("rel"));
    jQuery('#acf-field_61ab8de602ba7-input').trigger('change');
  });

But it’s not working..! I can see the value being changed in the hidden, but when we save the form, I have an error saying that the field is empty. So I’m guessing, I need to change the value of the select2 field, but I don’t know how..!

Any help would be very appreciated!

• raphael

• December 6, 2021 at 6:44 pm

I find a solution !

Here it is:

  jQuery('.liste_projets_nouveaux a').on( "click", function() {
    jQuery('#acf-field_61ab8de602ba7-input').val(jQuery( this ).attr("rel"));
    jQuery('#acf-field_61ab8de602ba7').val(jQuery( this ).attr("rel"));
  });