Add class to or wrap .mktoFormRow | Community
Skip to main content
T
TK-2
Level 2
March 29, 2021
Solved

Add class to or wrap .mktoFormRow

  • March 29, 2021
  • 2 replies
  • 4200 views

Hello!

Maybe there is a better way of doing this, but I have a situation where I need to style a form row based on the field within.

 

Does anyone have an idea on how I could add an a additional class to (or wrap) mktoFormRow with something that is referencing the specific field inside of it?

 

For instance, if I had:

 

<div class = "mktoFormRow"> <label for "FirstName" id="LblFirstName" ... ></label> <input></input>

 

How could I add something to that parent div so it looks like this?

<div class = "mktoFormRow input-id-FirstName">

 

 

Thanks for any ideas and suggestions!

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by SanfordWhiteman

Download FormsPlus::Tag from here and upload it to your Design Studio.

 

Then include it like:

<!-- FormsPlus::Tag Library --> <script id="teknklFormsPlus-Tag-0.2.4" src="https://pages.example.com/rs/123-ABC-DEF/teknkl-formsplus-tag-0.2.4.js"></script> <!-- /FormsPlus::Tag Library -->

(replacing the src w/the actual path in your Marketo instance).

 

There's no reason not to have FormsPlus::Tag always loaded — it's integral to advanced forms behaviors and styles. As you'll see, it tags all parent elements with the inputs they contain, using a data- attribute.

 

The script can go anywhere after your form embed; on a Marketo LP, place it just inside the closing </body>.

2 replies

Dave_Roberts
Dave_Roberts
Level 10
March 29, 2021

What are you trying to solve for here -- like why do you want to wrap the parent element based on the field? Is it a styling thing? Would it be for just one field or many? 

 

There's a few ways to go about this:

1. You could use a script solution to do exactly what you're asking. eg. find a specific field by id="" and add that value as a class to the .mktoFormRow. 

2. You might be able to get away without a script by using CSS and/or adding your field into a fieldset which might help you delineate a "field inside a fieldset" (the one) from a "field not inside a fieldset" (the rest).

 

Let me know what you had in mind as a use-case, and if it's possible to share a link to a page w/ the form on it for reference, that would help to get you a better solution that's more plug-n-play from anyone here in the community.

SanfordWhiteman
SanfordWhitemanAccepted solution
Level 10
March 29, 2021

Download FormsPlus::Tag from here and upload it to your Design Studio.

 

Then include it like:

<!-- FormsPlus::Tag Library --> <script id="teknklFormsPlus-Tag-0.2.4" src="https://pages.example.com/rs/123-ABC-DEF/teknkl-formsplus-tag-0.2.4.js"></script> <!-- /FormsPlus::Tag Library -->

(replacing the src w/the actual path in your Marketo instance).

 

There's no reason not to have FormsPlus::Tag always loaded — it's integral to advanced forms behaviors and styles. As you'll see, it tags all parent elements with the inputs they contain, using a data- attribute.

 

The script can go anywhere after your form embed; on a Marketo LP, place it just inside the closing </body>.

    T
    TK-2Author
    Level 2
    March 29, 2021

    @sanfordwhiteman - incredible! Exactly, what I was looking for.

     

    Thanks so much!

      Terms & ConditionsAccessibility statement

      Loading footer...