# Limit character count on an embedded form

**URL:** <https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094>\
**Category:** APIs & Integrations\
**Tags:** forms\
**Created:** [April 24, 2019, 6:19am UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094 "2019-04-24T06:19:29Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![tommifin](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/tommifin/32/70874_2.png) [@tommifin](https://community.hubspot.com/u/tommifin)\
**Post date:** [April 24, 2019, 6:19am UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094/1 "2019-04-24T06:19:29Z")

</div>

Hi,

I’m trying to set a character count limit on a text field on an embedded HubSpot form. I found a jQuery example which I’ve added to my code but it doesn’t seem to work. Any ideas what’s wrong?  
The form loads and submits just as it should. The character limit just doesn’t work. There are no console errors on form submission either.

```auto
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
 hbspt.forms.create({
	portalId: "XXXXXX",
	formId: "ZZZZZZZZZZZZ",
 css: "",
 submitButtonClass: "my-submit",
 target: ".hubspot-form",
 onFormReady: function($form) {
$('input[name="short_description_for_integration_listing"]').attr('maxlength','300').change();
}
});
</script>

<div class="hubspot-form"></div>

```

---

<div class="post-metadata">

**Author:** ![IsaacTakushi](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/isaactakushi/32/70387_2.png) [@IsaacTakushi](https://community.hubspot.com/u/IsaacTakushi)\
**Post date:** [April 25, 2019, 5:53pm UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094/2 "2019-04-25T17:53:25Z")

</div>

Hi, @tommifin.

Properties with the _Multi-line text_ field type render as `<textarea>` objects instead of `<input>` objects. Try this selector:

`$('textarea[name="short_description_for_integration_listing"]').attr('maxlength','300').change();`

---

<div class="post-metadata">

**Author:** ![tommifin](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/tommifin/32/70874_2.png) [@tommifin](https://community.hubspot.com/u/tommifin)\
**Post date:** [April 29, 2019, 5:41am UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094/3 "2019-04-29T05:41:59Z")

</div>

Hi Isaac,  
Thanks for your response. I should’ve noticed that the field is different!  
I corrected the code but for some reason, the maxlength attribute is not added to the HTML tag when I check it on browser developer tools (Firefox). Is it possible that some of the new form styling options on HubSpot are affecting this?

Rendered textarea HTML:

`<textarea id="short_description_for_integration_listing-a81fabe5-ff11-42d0-91e7-1dce25f6cd47" class="hs-input" name="short_description_for_integration_listing" required="" placeholder="" data-reactid=".hbspt-forms-0.1:$5.1:$short_description_for_integration_listing.$short_description_for_integration_listing.0"></textarea>`

---

<div class="post-metadata">

**Author:** ![IsaacTakushi](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/isaactakushi/32/70387_2.png) [@IsaacTakushi](https://community.hubspot.com/u/IsaacTakushi)\
**Post date:** [April 29, 2019, 12:37pm UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094/4 "2019-04-29T12:37:51Z")

</div>

Hi, @tommifin.

It’s possible. Could you DM me a link to your form and/or landing page so I can take a closer look?

P.S I will be out of office from April 30 - May 8, so if you need an answer more quickly, please feel free to create another post citing this one or contact [HubSpot support](https://help.hubspot.com/).

---

<div class="post-metadata">

**Author:** ![bilob](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/bilob/32/64675_2.png) [@bilob](https://community.hubspot.com/u/bilob)\
**Post date:** [April 12, 2020, 10:58am UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094/5 "2020-04-12T10:58:33Z")

</div>

Hey Isaac,

I’m having a similar issue, I tried adjusting the code to match a textarea field, would you mind if I message you too please?

I’m using:

hbspt.forms.create({  
target: “.Belch”,  
portalId: “XXXXX”,  
formId: “XXXXXXXXXXX”,  
css: “”,  
onFormReady: function($form) {  
$(‘textarea[name=“message”]’).attr(‘maxlength’, ‘255’).change();  
},  
});

Thank you!

---

<div class="post-metadata">

**Author:** ![EPIWeb](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/epiweb/32/38114_2.png) [@EPIWeb](https://community.hubspot.com/u/EPIWeb)\
**Post date:** [April 13, 2020, 2:16pm UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094/6 "2020-04-13T14:16:45Z")

</div>

Hi bilob,

Have you had any success with character limit on your text field? I am having the same issue.

---

<div class="post-metadata">

**Author:** ![bilob](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/bilob/32/64675_2.png) [@bilob](https://community.hubspot.com/u/bilob)\
**Post date:** [April 13, 2020, 2:46pm UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094/7 "2020-04-13T14:46:04Z")

</div>

No luck on my end, hoping @IsaacTakushi might be able to help us @EPIWeb !

---

<div class="post-metadata">

**Author:** ![IsaacTakushi](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/isaactakushi/32/70387_2.png) [@IsaacTakushi](https://community.hubspot.com/u/IsaacTakushi)\
**Post date:** [April 14, 2020, 8:14pm UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094/8 "2020-04-14T20:14:43Z")

</div>

Hi, @bilob and @EPIWeb.

Apologies for the delayed response; I have been out of the office.

That snippet is still working for me. Have you set your forms to use raw HTML?

If the forms render in an `iframe`, as they do with the built-in themes, you won’t be able to modify them with jQuery.

 ![Set as raw HTML form.jpg](https://d2qpr2jzcazej7.cloudfront.net/original/3X/4/e/4e10d7b45cac8640b62933b7f2ee09ba61c02635.jpeg)

---

<div class="post-metadata">

**Author:** ![mansi\_govani](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/mansi_govani/32/102437_2.png) [@mansi\_govani](https://community.hubspot.com/u/mansi_govani)\
**Post date:** [November 10, 2020, 10:03pm UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094/9 "2020-11-10T22:03:10Z")

</div>

Hello @IsaacTakushi,  
I am not embeding the form. Is it possible to do the same with regular forms?  
Thank you in advance for your help!  
Mansi

---

<div class="post-metadata">

**Author:** ![IsaacTakushi](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/isaactakushi/32/70387_2.png) [@IsaacTakushi](https://community.hubspot.com/u/IsaacTakushi)\
**Post date:** [November 23, 2020, 12:53pm UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094/10 "2020-11-23T12:53:58Z")

</div>

Hi, [@mansi\_govani](https://community.hubspot.com/t5/user/viewprofilepage/user-id/150412).

Sincere apologies for the delayed response. Since leaving Developer Support, I check the Community less frequently.  
While it is not possible to impose a character limit on multi-line text fields in HubSpot’s forms editor, as long as the `form` element is not rendered in an `iframe` (as with _Free_ or _Starter_ subscriptions), you can modify the form using [HubSpot’s global form events](https://legacydocs.hubspot.com/global-form-events) and the JavaScript discussed above.

Said differently, you do not have to modify the form’s embed code to use the `onFormReady` global event to trigger custom JavaScript validation.

---

<div class="post-metadata">

**Author:** ![WTariq](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/wtariq/32/75413_2.png) [@WTariq](https://community.hubspot.com/u/WTariq)\
**Post date:** [August 29, 2022, 2:25pm UTC](https://community.hubspot.com/t/limit-character-count-on-an-embedded-form/14094/11 "2022-08-29T14:25:45Z")

</div>

Hi All,  
I figured this out this way:

```lia-code-sample
hbspt.forms.create({
 portalId: "123456",
 formId: "abcd-efg-hijk=lmno",
 onFormReady: function($form) {
 $form.find('textarea[name="what_are_you_planning"]').attr('maxlength','150');
 },
 });

```
