CODEWITHSUNDEEP
javascript
Robert de Jonge
Robert de Jonge

Reputation: 119

Call javascript function on maxlength of textfield

I am looking for a script that calls for a JavaScript function automatically when reaching the maxlength of a text field.

I tried to modify this piece of Script which I found here ajax call after x characters

$("input#zipcode").live("keyup", function( event ){
    if(this.value.length == this.getAttribute('maxlength')) {
        if(!$(this).data('triggered')) {
            // set the 'triggered' data attribute to true
            $(this).data('triggered',true); 
            if ($(this).valid() == true ) { loadXMLDoc(); } 
        }
    } else { $(this).data('triggered',false); }
});

This is the part of code containing the loadXMLDoc part:

function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4)
    {
    document.getElementById("state_insert").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","state_insert.asp?zipcode="+document.getElementById('zipcode').value,true);
xmlhttp.send();
}

When the maxlength is reached, I want it to call for a "LoadXMLDoc" function which requires no additional parameters to be passed on.

At the moment I have it set to onblur="LoadXMLDoc()" Like this:

[input name='zipcode' type='text' class="form_elements" id='zipcode' tabindex='11' autocomplete='off' onchange="this.value=extractNumeric(this.value)" onkeypress="return isNumericKey(event)"  value='' size="4" maxlength="5" onblur="loadXMLDoc()" /]

I used the [ and ] because < and > are not allowed.

in the text field properties, but I would like that it loads as soon as the 5 digits of the Zip Code have been entered.

Thanks in advance :)

Robert.

Upvotes: 1

Views: 1217

Answers (1)

vusan
vusan

Reputation: 5331

You can do it with onkeypress event like:

onkeypress="return isNumericKey(event,this)"

along with the number it should also check for the max length. And the code should be like:

function isNumericKey(evt,zip) {
  // your Number 
  // check here

  var zipLen=zip.getAttribute('maxlength');
  var zipValueLen=zip.value.length;
  if(zipValueLen>=zipLen) { LoadXMLDoc(); return false;}
}

Upvotes: 0

Related Questions