Skip Navigation

[Resolved] correct css to target a specific field on a form

This support ticket is created 2 years, 2 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Kolkata (GMT+05:30)

This topic contains 7 replies, has 2 voices.

Last updated by Minesh 2 years, 2 months ago.

Assisted by: Minesh.

Author
Posts
#2466221

Tell us what you are trying to do?
I have a particular custom field that is required for a form that will result in new post content, but I do not want that field to display in a second form to EDIT the post's content. I have tried targeting the field in css of the Edit Form to 'display: none;' but I am doing something wrong. I am using this css:

input[cred_field field='subscription-selection'] {
display: none;
}

How do I correctly target a specific form field in the css editor without using the 'Expert Mode' of the form builder? I can hide it in the expert mode but then it disappears when I want to go back to the drop and drop form builder.

Is there any documentation that you are following?

Is there a similar example that we can see?

What is the link to your site?

#2466411

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hello. Thank you for contacting the Toolset support.

As I understand, you want to display the specific field on the add post form but not on the edit post form. Is that correct?
- If yes, I will require to know what field you are talking about and where I can see it.

Can you please share problem URL and admin access details and let me review it and then I will be able to guide you in the right direction.

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I have set the next reply to private which means only you and I have access to it.

#2466789
2022-09-28_12-34-52.png

I am wanting to target one specific element and hide it via css. A copy of the form located here: (screen shot provided with which element I want to hide)
hidden link

How do correctly target with css this one element of the form group (the custom field 'wpcf-subscription-selection')?
I have a copy of this form that is not yet published and I want to hide that part on the copy. All the css I try does not work and I think I am not using the correct css to target the correct div class. I am not providing admin access as this is a question that can be answered without that.

#2467051

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

As I understand, you have two form one form to add new content and one form to Edit the existing content and you want that on Add new content form you want to keep the custom field "subscription-selection" and on Edit form you want to hide the custom field "subscription-selection".

So if there is no use of that custom field on Edit form, what if you just simple edit your edit form and just remove the custom field "subscription-selection" from your edit form. Does that makes sense?

However, here is the doc about how you can style the Toolset forms but it will require CSS knowledge:
- https://toolset.com/course-lesson/styling-front-end-forms/

#2467429

Yes, you are correct in your understanding that I need the "subscription-selection" to show only in the New Post Form and not in the Edit Post Form. The reason I cannot simply turn it off in the Edit Form is because the custom field "subscription-selection" is set up as a 'required' field. The New Post Form needs this element to have a value before submitting the form, but I do not see an option to remove it from the Edit Post Form -- it has a lock icon on it and I can't remove it.

So is using css to hide it the only workaround? Or is there something I am missing to make this custom field not required for the Edit Post form?

#2467469

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

So, what if you switch to the "Expert Mode" and then just try to remove the desired field, in this case "subscription-selection" and save the form. Does this helps?

#2467839
2022-09-30_15-51-04.png

That doesn't really help if I ever want to go back to the drag and drop view to move or change other things. It says when you leave Expert Mode that 'Changes that you make in the HTML editor will be lost if you switch back to the Visual editor.'

I ended up making that field NOT required to get around this.

#2468937

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

That doesn't really help if I ever want to go back to the drag and drop view to move or change other things. It says when you leave Expert Mode that 'Changes that you make in the HTML editor will be lost if you switch back to the Visual editor.'
==>
Yes, that's expected and that is why we added the notice there. Once yo switch to "Expert View" you should edit the form in expert mode otherwise the changes you made in expert view will be lost in Visual mode.

Ok. If you are fine with that you are welcome to mark resolve this ticket.