Validation Form Replicating

Question

I have a form that when is submitted it checks if the user selected the field, and if didn't it gives a message to fill, but if i keep clicking the message keeps duplicating, triplicating and goes on... How can i make the message appear only one time? Here is the code

$( "#myform" ).submit(function( event ) {
  var met = $("#mySelect").val();
  if (met === "0"){

    $( ".msn" ).append( "Select a Field" );
    return false 
  }else{
    $( "#myform" ).submit();
    }

});

Answer 1

Since the problem is on the appended label try this:

$( "#myform" ).submit(function( event ) {
  var met = $("#mySelect").val();

  if (met === "0"){
    // Clear .msn 
    $(".msn").empty();

    // Append label
    $( ".msn" ).append( "Select a field" );

    return false 
  }else{
      $( "#myform" ).submit();
    }

});

Check this updated fiddle.

Answer 2

Use .one function

$( "#myform" ).one('submit', function( event ) {
  var met = $("#mySelect").val();
  if (met === "0"){

    $( ".msn" ).append( "Select a Field" );
    return false 
  }else{
    $( "#myform" ).submit();
    }

});