check availability before submit form

check availability before submit form

Hi,
I have a form :

  1. <div>
    <form name="CreateIfaceEnvForm" id="CreateIcaceEnvForm" method="post" action="/Grouping/createIfaceEnv.do">

    <label for="disabled" class="formLabel">Disabled*</label>
    <select name="disabled" tabindex="1" id="disabled" class="criteria" title="Disabled"> <option value="F">Enabled</option>
    <option value="T">Disabled</option> </select>
    <br/> <br/>
    <label for="interfaceType" class="formLabel">environment*</label>
    <input type="text" name="interfaceEnvironment" size="10" tabindex="2" value="" id="interfaceEnvironment">
    <div>
    <span class="status"> </span>
    </div>
    <br/>
    <input id="createenv" type="submit" name="submit" class="submitbutton" tabindex="3" value='Create Environment' />
    <a href="/Grouping/listSAIAdmins.do?id=saiAdmins" tabindex="4" class="linkButton">Back To SAI ADMIN</a>
    </form>
    </div>

and my js code :

  1. $("#interfaceEnvironment").focusout(function () {
  2.                   console.log("inside blur");
  3.                 var env = $(this).val();
  4.                  $(".status").html("<img src='images/loading83.gif'><font color=gray> Checking availability...</font>"); 
  5.                 $.ajax({
  6.                   url: "isMetadataEnvAvailable.do",
  7.                   data: "envname=" + env ,
  8.                   success: function(response) {
  9.                        if(response.message === "exist"){
  10.                            $(".status").html("<font color=red face='arial, sans-serif' size='2px'> This environment already " + response.message + "</font>");   
  11.                            $("#createenv").attr("disabled", "disabled");
  12.                       }
  13.                        else{
  14.                         $(".status").html(response.message);  
  15.                         $("#createenv").removeAttr("disabled");
  16.                     }
  17.                   
  18.                  }
  19.               })            
  20.       
  21.            }); 










The check availability is working, but the end user got confused with this design, any thought or correction will be appreciated.
Thanks