Set min of required characters of field.

bfuchs
bfuchs used Ask the Experts™
on
Hi Experts,

How can I change the code below to

1- Only popup once.
2- Do not let the user exit the field without either entering required quantity of characters or leave it blank.

   $("textarea[id*=Treatments_Administered]")
       .attr("minlength", 100)
       .on("change blur", function() {
           if($(this).val().replace(/^\s*|\s*$/g,"").length<100) {
               alert("You must enter at least 100 characters!");
           }
   });

Open in new window


Thanks
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
leakim971Multitechnician
Top Expert 2014

Commented:
give this a try :
   $("textarea[id*=Treatments_Administered]")
       .attr("minlength", 100)
       .on("change", function() {
           if($(this).val().replace(/^\s*|\s*$/g,"").length<100) {
               alert("You must enter at least 100 characters!");
               $(this).focus();
           }
   });

Open in new window

Hi,

This does not prevent users from exiting these fields with the mouse.
How can we accomplish this?

Thanks,
Ben
This is not possible to prevent user to quit the form or popup, you can only alert user that is trying to quit
using beforeunload.

I'm using these scripts
https://github.com/rubentd/dirrty
https://github.com/simontaite/jquery.dirty

Then validate on submit using server side validation (PHP/ASP)
Ensure you’re charging the right price for your IT

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

leakim971Multitechnician
Top Expert 2014

Commented:
try this :
   $("textarea[id*=Treatments_Administered]")
       .attr("minlength", 100)
       .on("change", function() {
           if($(this).val().replace(/^\s*|\s*$/g,"").length<100) {
               alert("You must enter at least 100 characters!");
setTimeout(function() {
               $("textarea[id*=Treatments_Administered]").focus();
}, 350);
           }
   });

Open in new window

@Leakim,

Yours works.

Just need to see why I'm getting the popup message twice.

Thanks,
Ben
leakim971Multitechnician
Top Expert 2014

Commented:
not sure why you get the alert twice.

try to replace :
.on("change", function() {

by :
.on("blur", function(e) {
     e.preventImmediatePropagation();
Hi,

At the moment I have this and its letting me exit w/o any msg.

   $("textarea[id*=Treatments_Administered]")
       .attr("minlength", 100)
    .on("blur", function(e) {
     e.preventImmediatePropagation();
           if($(this).val().replace(/^\s*|\s*$/g,"").length<100) {
               alert("You must enter at least 100 characters!");
               setTimeout(function() {
                   $("textarea[id*=Treatments_Administered]").focus();
               },350);
           }
   });

Open in new window


Thanks,
Ben
Multitechnician
Top Expert 2014
Commented:
typo, replace : e.preventImmediatePropagation();
by : e.stopImmediatePropagation();


   $("textarea[id*=Treatments_Administered]")
       .attr("minlength", 100)
    .on("blur", function(e) {
     e.stoptImmediatePropagation();
           if($(this).val().replace(/^\s*|\s*$/g,"").length<100) {
               alert("You must enter at least 100 characters!");
               setTimeout(function() {
                   $("textarea[id*=Treatments_Administered]").focus();
               },350);
           }
   });

Open in new window

See attached error

Thanks,
Ben
Untitled.png
leakim971Multitechnician
Top Expert 2014

Commented:
e.stopImmediatePropagation()

Open in new window


and not

e.stoptImmediatePropagation()
Both issues solved.
Thank you!
leakim971Multitechnician
Top Expert 2014

Commented:
you welcome,
sorry for the typo, I'm tired

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial