Support
Account
Hi @jonathan
Thank you for your replay!
The way I described my situation was too bad to be understood, I think… (because of my bad command of English…)
Anyway, I made it by (you might call) “custom Javascript hacking” + using ACF hook finally.
The attachment is partly in Japanese. so please bear with it.
As you see, my relationship field is shown as split 2 column. (I do not know how they call it.)
First, I used ACF hook ‘acf/fields/relationship/result’ to insert some kind of flag for “cannotselect” item like below.
add_action('acf/fields/relationship/result', 'add_extra_to_title' ,10 ,4);
function add_extra_to_title( $title, $post, $field, $post_id ) {
//prepare Jap translation for post_status
$poststatus_jp = array(
'draft' => '下書き',
'private' => '非公開',
'pending' => 'レビュー待ち',
'future' => '予約投稿',
);
$post_status = get_post_status( $post->ID );
//add flag for "cannotselect" item
if( $post_status != "publish" )
{
$title .= '<span class="cannotselect"> *<span>';
}
//replace Eng to Jap.
if( $post_status != "publish" )
{
if(isset( $poststatus_jp[ $post_status ] ) ){
$post_status_jp = $poststatus_jp[ $post_status ];
}
$title = str_replace( "($post_status)" , "($post_status_jp)" , $title );
}
//if it's post, add category name to it's title.
$thisPost = get_post( $post->ID );
$thisPosttype = $thisPost->post_type;
$thisTerms = wp_get_post_terms( $post->ID, 'category' );
if( $thisPosttype == 'post' && !empty($thisTerms) )
{
$title .= " [" . $thisTerms[0]->name . "]";
}
return $title;
}
Next, using setTimeout + jQuery, add “cannotselect” class to li element which include span.cannotselect.
Plus, apply “pointer-events : none;” + pale pink background to li.cannotselect to be noticeable.
javascript part
function watchAcfRelItem()
{
if( $( ".acf-rel-item" ).length > 1 ){
$('.acf-rel-item span.cannotselect').each( function(){
$(this).parent().parent().addClass('cannotselect');
});
}
setTimeout( watchAcfRelItem, 1000 );
}
watchAcfRelItem();
css part
li.cannotselect .acf-rel-item {
background: pink;
pointer-events : none;
cursor: not-allowed;
opacity: 0.5;
}
li span.cannotselect{
display: none;
}
As you see, it’s ungly… but seems working so far.
If you have any better idea, please tell it to me.
I will appreciate your kindness greatly!
Thank you again for reading my bad English!
