콘텐츠로 건너뛰기
메뉴
커뮤니티에 참여하려면 회원 가입을 하시기 바랍니다.
신고된 질문입니다
2 답글
1591 화면

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!

아바타
취소
작성자 베스트 답변

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 :-)

아바타
취소
베스트 답변

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

아바타
취소
작성자

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