I am facing an issue with my script - the problem arises when trying to display errors. The error message appears but does not function properly, causing a break after the submit button. Essentially, if the fields are empty, an error should be displayed, and while it does work in doing so, the display of the error seems to halt the process.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<form method="post">
<input type="text" id="text_field1" />
<input type="text" id="text_field2">
<button type="submit" id="submit_button">Submit</button>
<button type="submit">Submit</button>
<p id="error_resp"></p>
</form>
<script>
$("#submit_button").click(function() {
if ($("#text_field1").val() == "")
$('#error_resp').text('please fill the required field');
else if ($("#text_field2").val() == "")
$('#error_resp').text('please fill the required field');
else
return true;
});
</script>