Hello! We are using the Plumsail Public Forms and are trying to find a way to limit the number of characters in a multi-line text box to 3,000 characters. Has anyone done this? I know the attribute for HTML inputs, but I am not sure how that would be used in the designer.
Thanks!
Dear @kkreitzer,
Sure, we can help, but we might need a little more details to make it work with your situations specifically:
Do you want users to be able to input more than 3,000 characters, but then not being able to save the form, like validation? Or do you want some hard limit, when users are not even able to type in more than 3,000 characters?
Is this Multiline Field Plain Text or Rich Text? The value returned would be different, and if it’s Rich Text, there needs to be additional code to remove all the styling from the value.
Finally, do you want to include spaces as characters, or should only actual visible characters count?
In case you have a simple Plain Text Multiline Field, you can use the following code for validation, though it will include spaces as well:
fd.spRendered(function() {
fd.validators.push({
name: 'FieldLengthValidator',
error: "FIELD_NAME must be not longer than 3000 characters",
validate: function() {
if (fd.field('FIELD_NAME').value.length <= 3000) {
return true;
}
return false;
}
});
});Hi Nikita.
I've tried this exact code on a public form, changing the value to 600. However it doesn't prevent long submissions. Is there more code that I need in JS than this?
Below is exactly what I've entered. 'Instructions' is the internal name of the field.
fd.spRendered(function() {
fd.validators.push({
name: 'FieldLengthValidator',
error: "Instructions must be not longer than 600 characters",
validate: function() {
if (fd.field('Instructions').value.length <= 600) {
return true;
}
return false;
}
});
});
Hello @duncanw,
fd.spRendered is an event that used in SharePoint forms. For public forms please use fd.rendered event.
Please find more information about events for PUblic Forms here.
Hi, I need the solution for entering hard limits where the users will not be able to type in more than the character limit of 3,000. These limit should include spaces and punctuation. I need this for both Plain and Rich multiline text boxes.
I also have some situations where the limit is based on words, for example 200 word limit in multiline text boxes. Is that possible to have as hard limits as well.
Thank you.
Hello @Zusbry,
To hard limit the number of characters in the Plain text field, you can use this code:
text = fd.field('FIELD_NAME').value;
function limitCharacters(fieldName){
var newText = fd.field(fieldName).value;
if(fd.field(fieldName).value.length > 3000) {
fd.field(fieldName).value = text;
}
else {
text = newText;
}
}
fd.field('FIELD_NAME').$on('change', function(value) {
limitCharacters('FIELD_NAME');
});
If you need help with limiting the number of character in the Rich text field and setting the limit on word number, we can offer you a paid support. Please contact us via support@plumsail.com
Hello @Margo,
Thank you, I really do appreciate you taking the time. It works perfectly. I will followup on the decision for Rich text.
Thanks again.
Hi @Margo and @Nikita_Kurguzov.
What would the plain text validation be for restricting the following invalid characters in SharePoint?
~ " # % & * : < > ? / \ { | }.
Thanks,
stormanh
Hello @stormanh,
You can use the code below to validate the plain text field:
fd.spRendered(function() {
fd.field('Title').validators.push({
name: 'Invalid characters',
error: "Please remove invalid characters",
validate: function() {
var str = fd.field('Title').value;
return !/[~"#%&*:<>?/\{|}.]/g.test(str);
}
});
});Thank you @Margo!
Total newbie here with no formal training in coding...apologies for the likely incredibly simplistic questions...I'm using the Plumsail online form builder to make a public form that will use a process to auto-populate data into a PowerPoint template. I need to limit the number of characters as described above on multiple 'single line text' and 'Multiline text' (simple text) inputs in my form. each field may have a different max character count due to how the field input will fit into the final PPT.
My silly question is, with the code above...literally...where do I put it in the form builder? Is it in the 'style' of each single line text element? Or in the JavaScript Editor for the complete form? Or somewhere completely different?
Hello @dchapek,
You need to add the code to the JavaScript editor:
As you are designing a public form, you need to place the code within rendered function, like this:
fd.rendered(function () {
text = fd.field('Text1').value;
function limitCharacters(fieldName){
var newText = fd.field(fieldName).value;
if(fd.field(fieldName).value.length > 3) {
fd.field(fieldName).value = text;
}
else {
text = newText;
}
}
fd.field('Text1').$on('change', function(value) {
limitCharacters('Text1');
});
});
Replace Text1 with the internal name of the field.
You can find some code examples that might be useful for you in our documentation here.
Hi Nikita/Mnikitina,
1.) I am trying to get my single line of text to only allow numbers(numeric) and no alphabetical text. At the moment I cannot find any way of doing this?
2.) How can I make sure that when my field is limited to only allow 8 characters, that it will insert a leading 00 if there is only 6 characters typed in?
This is for my SharePoint Online forms
Please can you help
Kind regards,
Dina
Hello @Dina_Louw,
Welcome to Plumsail Community!
You can use this code to allow users to enter not more than 8 digits:
fd.spRendered(function() {
text = fd.field('Title').value;
fd.field('Title').$on('change', function(value) {
var newText = value;
if(value.length > 8 || /[^\d+$]/g.test(value)) {
fd.field('Title').value = text;
}
else {
text = newText;
}
});
});
And this code to insert a leading 0 if there is less than 8 characters typed in:
fd.spBeforeSave(function(spForm) {
var inpt = fd.field('Title').value;
if(inpt.length <8){
var diff = 8 - inpt.length;
var zrs = new Array(diff + 1).join(0);
fd.field('Title').value = zrs + inpt;
}
else {
fd.field('Title').value = inpt
}
return fd._vue.$nextTick();
});
Replace Title with the field internal name.
Thank you soooooooooooo much, this works absolutely perfect 