Question

I would like to change the value of an input field when the form is submitted depending on it’s content.

Currently I have this and expect I am a long way from what I actually need, can’t seem to find the info I am after to make it all work together.

Any help appreciated.

<script type="text/javascript">
function vet()
{
    if(this.abc.value.indexOf("CW-") >= 0)
    {
    return true;
    }
    else
    {
    this.abc.value = 'CW-' + this.abc.value; return true;
    }
}
</script>

<form name="simple1" method="get" onsubmit="vet()" action="simple.php">
<input class="saip1" name="abc" type="text" value="Input Value" onfocus="this.value='';"/>

Basically I want to check that the user has included “CW-” (or indeed any case variant of that cw- cW- Cw-) at the beginning of their value. If they have just return the value as it is. If not I would like to add CW-.

After some reading I tried the indexOf approach but I don’t really understand javascript and am sure I have done something wrong.

Answer 1

Your approach is fine but you were making it a little complicated.

Also, it’s good practice to use onsubmit etc. through JavaScript instead of through HTML. You could also do this for onfocus.

http://jsfiddle.net/PTspF/

HTML:

<form id="simple1" method="get" action="simple.php">

    <input class="saip1" name="abc" type="text" value="Input Value" onfocus="this.value='';"/>

</form>

JavaScript:

You could check for an indexOf of 0 as you wish “CW-” to appear at the beginning of the string. The toUpperCase() makes cw- CW- so that variations also are found correct.

window.onload=function() {
  document.getElementById("simple1").onsubmit=function() {
    if (this.abc.value.toUpperCase().indexOf("CW-") !== 0) {
      this.abc.value = 'CW-' + this.abc.value; // prepend if not present
    }
  }
}