Skip to Content
Menu
This question has been flagged
2 Replies
1465 Views

Hey guys,


I hope you're all good.

Running an v16, EE, any idea of how you would achieve the following challenge:


Ensuring a max lenght (8 or 12 characters) is not exceeded when the final customer fills in the "custom attribute" form on the website.


This is the part of the code displaying that info (sorry for a picture, it seems to be broken everytime I paste it):


I can add a field with the length limit inside, but I have no idea how to check it on the website. 

Having no access to Python code makes it barely impossible, I guess.


Any genius idea?


Thanks in advance!

Avatar
Discard
Author Best Answer

OK, done!

It has to use JavaScript...

Basically, use a querySelector to get the field you want to update, i.e.

            var CustomChestInput = document.querySelector('input[value_id="' + WithChestID.value + '"]');

And then set a maxlegnth attribute :

            CustomChestInput.setAttribute('maxlength', maxLength);


I had to execute that code on the click on the radio button:

WithChestID.addEventListener('click', function() {
...
}

and put a timeout to let time for the text field to be generated

    setTimeout(function() {

...
}, 1000);

Most probably ugly code, but yet working :-)

Avatar
Discard
Best Answer

Hi,

If you need to limit the characters recorded in a input field to less than a particular value, you can use the maxlength attribute.

Suppose if you need the maximum character as 12, just add maxlength="12" along with the input field in the xml side.


Thanks

Avatar
Discard
Author

Hey Niyas, thanks for helping! Indeed, that should be working (if I try it in a web console, it does work!), but I can't achieve to set up the "maxlength" attribute in sale.variants code (as shown in my first post).

As the custom variant is chosen amongst radio choices, wherever I set "maxlength" it's ending up limitating the radio button, not the newly created custom text field.

Do you have any clue where this one (custom text field) is generated? It's not a view, would it be coming from JS ?

Screenshots of my tries to add the parameter "maxlength", and their effect : https://mega.nz/file/xQxCWZRK#LRgdNtI2LWjjz-BJlNfYlY50KRj1mB1OEgzLCPlS62A