Javascript not working

bravo14 · January 30, 2014

I have a couple of functions as shown below

 
function displayTrackingNumber()
{
if (document.getElementById('cboOrderStatus').value == 'Shipped') {
        document.getElementById('txtTrackingNumber').style.display = '';
document.getElementById('txtTrackingNumber').focus();
    } else {
        document.getElementById('txtTrackingNumber').style.display = 'none';
    }
}
 
function blankTrackingNumber()
{
if(this.value =='Tracking Number') {
this.value ='';
}
}
function checkTrackingNumber()
{
if(this.value =='Tracking Number') {
alert("Please enter a Tracking Number!");
}
if(this.value =='') {
alert("Please enter a Tracking Number!");
}
}

They are implemented on the page as shown here

<input name="txtTrackingNumber" id="txtTrackingNumber" value="Tracking Number" style="display:none" onkeydown='blankTrackingNumber()' onblur='checkTrackingNumber()' />

But when I leave the field nothing is happening and there is nothing appearing in the console and when I press a key on the keyboard the value 'Tracking Number is staying in the field.

Ch0cu3r · January 31, 2014

Thought of using the HTML5 placeholder attribute instead.

But to answer you question you need to call the blankTrackingNumber on the focus event not keydown event

<script>
function displayTrackingNumber()
{
    console.log(document.getElementById('cboOrderStatus').value);
    if (document.getElementById('cboOrderStatus').value == 'Shipped') {
            document.getElementById('txtTrackingNumber').style.display = '';
            document.getElementById('txtTrackingNumber').focus();
    } else {
        document.getElementById('txtTrackingNumber').style.display = 'none';
    }
}
function blankTrackingNumber(elm)
{
    if(elm.value == elm.defaultValue) {
        elm.value ='';
    }
}
function checkTrackingNumber(elm)
{
    if(elm.value == undefined || elm.value =='' || elm.value == elm.defaultValue) {
        alert("Please enter a Tracking Number!");
        elm.value = elm.defaultValue;
    }
}
</script>
<body onload="displayTrackingNumber()">
<form>
    <input type="text" id="cboOrderStatus" name="cboOrderStatus" value="Shipped" />
    <input name="txtTrackingNumber" id="txtTrackingNumber" value="Tracking Number" style="display:none" onfocus="blankTrackingNumber(this)" onblur='checkTrackingNumber(this)' />
</form>
</form>

Sign In

Javascript not working

Recommended Posts

bravo14

Link to comment

Share on other sites

Ch0cu3r

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information