[Gelöst] limit number of characters in cred forms input fields – textarea and input

[Author]

Artikel

[michaelR-26]

I found a solution on this site to limit the number of characters in a single text area and show a countdown next to the text area. It works well. But I also need to limit the amount of characters ina few other fields - some text areas and some single line inputs. Any way this is possible?

You can see it in action here versteckter Link

Once logged in, go to the front end and cllick the Account Information tab and then on the blue Edit Your Booth button.

(function($) {
$.fn.extend( {
limiter: function(limit, elem) {
$(this).on("keyup focus", function() {
setCount(this, elem);
});
function setCount(src, elem) {
var chars = src.value.length;
if (chars > limit) {
src.value = src.value.substr(0, limit);
chars = limit;
}
elem.html( limit - chars );
}
setCount($(this)[0], elem);
}
});
})(jQuery);

var elem = jQuery("#chars");
jQuery("textarea[name='wpcf-exhibitor-info-introduction']").limiter(1000, elem);

[Luo Yang]

Hello,

You can try these:
1) In the field "Exhibitor Address", add below HTML codes:

<b>Characters left:</b><span id="chars2">1000</span>

2) Add below JS codes just below those JS codes you mentioned above:

var elem2 = jQuery("#chars2");
jQuery("textarea[name='wpcf-exhibitor-address']").limiter(1000, elem2);

Since the credentials you provided is not an admin account, I can not test it in your website, but it works fine in my localhost, see screenshot limiter.JPG

[michaelR-26]

Thanks. That worked great for the other fields that are textareas, but how can I acheive the same for single line input fields?

[michaelR-26]

My issue is resolved now. Thank you!