[Resolved] Hide Username Dropdown in Post Relationship Form

[Author]

Posts

[Alok Sharma]

I want to hide the Username dropdown section (marked in red) in the post relationship form. I have added “display: none;” in Additional inline styles, but for some reason it is not taking effect.

Please refer to the attached screenshots.

[Jamal Supporter Languages: English (English ) French (Français ) Timezone: Africa/Casablanca (GMT+00:00)]

Hello and thank you for contacting the Toolset support.

To better assist you with this issue can you share a URL where we can see this form?

In the meantime, consider using a class name and CSS code in the CSS section of the form.

[Alok Sharma]

Hi Jamal,

You can find the admin details in this thread https://toolset.com/forums/topic/split-showing-the-list-of-related-posts-and-the-button-to-disconnect-them/

If not, then please enable private message so that I can provide the required details.

Thanks

[Jamal Supporter Languages: English (English ) French (Français ) Timezone: Africa/Casablanca (GMT+00:00)]

Unfortunately, the credentials were removed from that thread, I assume that it was marked as resolved, and that the system has removed them hidden link

I am setting your next reply to let you share credentials safely. ** Make a database backup before sharing credentials. **

[Jamal Supporter Languages: English (English ) French (Français ) Timezone: Africa/Casablanca (GMT+00:00)]

Thank you for the credentials. I assume that you are talking about this form hidden link

I can see two ways of hiding the relationship field and its label:
- Using the advanced mode and CSS.
- Using the user interface and Javascript.

Because the classname or the styles that we set on the user interface may only be applied to the relationship field, we do not have a way to hide its label.

- Using the advanced mode and CSS: You can add a custom CSS class(let's call it "hide") to the form-group class as shown in this screenshot hidden link
Then you can add the following CSS to make it invisible:

.hide { display: none; }

- Using the user interface and Javascript: You can add a custom CSS class(let's call it "js-hide") on the user interface hidden link
Then hide its parent form-group div using this Javascript:

jQuery(function($){
    $('.js-hide').each(function(){
        $(this).closest('.form-group').hide()
    })
})

I hope this helps. Let me know if you have any doubts about implementing any of these solutions.

[Alok Sharma]

Hi Jamal,

The 2nd solution was much easier to implement. The 1st solutions would have also worked, but I preferred to stick with the non-expert mode.

My issue is resolved now. Thank you!