Edit I realized my error shortly after posting this. The append should be html() or text()
Partial code:
<script type="text/javascript" language="javascript">
$(document).ready(function(){
$('#resetpassword').validate(
{rules: {
secretAnswer: {
required: true
}
},
messages: {
secretAnswer: {
required: "Please answer your security question"
}
},
submitHandler: function(form){
$.post("../BackgroundOperations/resetpassword.php",
$('#resetpassword').serialize(),
function(data){
if(data.status == 0){
$('#message').append("<span class='error'>Error: " + data.message + "</span>");
}
else{
$('.container').hide();
$('.short_explanation').hide();
$('#message').text(data.message);
}
},
"json");
}
});
});
</script>
</head>
<body>
<!-- Form Code Start -->
<div id='fg_membersite'>
<form id='resetpassword' method='post' accept-charset='UTF-8'>
<fieldset >
<legend>Reset Password</legend>
<div class='short_explanation'>* required fields</div>
<input type='text' class='spmhidip' name='<?php echo $vm->GetSpamTrapKey(); ?>' />
<div id="message"></div>
<div class='container'>
<label for='emailAddress' >Email Address:</label><br/>
<input type='text' name='emailAddress' id='emailAddress' maxlength="100" readonly="true" value="<?php echo $vm->GetEmailAddress() ?>" /><br/>
</div>
<div class='container'>
<label for='secretQuestion' >Security Question:</label><br/>
<input type='text' name='secretQuestion' id='secretQuestion' value='<?php echo $vm->GetSecretQuestion() ?>' maxlength="100" readonly="true" width="100" /><br/>
</div>
<div class='container'>
<label for='secretAnswer' >Answer:</label><br/>
<input type='text' name='secretAnswer' id='secretAnswer' maxlength="50" /><br/>
</div>
<div class='container'>
<input type='submit' name='Submit' value='Submit' />
</div>
</form>
I’m testing invalid input (wrong security answer). When I put the wrong answer and submit the form the <div id="message"> gets updated with the error message, but if I keep submitting invalid data the <div id="message"> keeps the old error message with a new one added on the end instead of having just a single message.
Instead of
use