Raghavenda Bhat Raghavenda Bhat - 23 days ago 12
Javascript Question

stop form from refreshing

I have a form which accepts data from user , and gives a success message after sending a mail by calling a java service. After successful sending, user should get a success message. In my case the form is a pop - up. So on submitting the form posts the data and the popup refreshes / submits and no success pop up comes.
I am using the below code:

$( "#target" ).submit(function( event ) {
alert( "Mail Sent successfully" );
event.preventDefault();
});


But I dont want the above alert. I want my customized popup for success message, which is not an alert . For Example

$(document).ready(function(){
$( "#target" ).submit(function( event ) {
$( "#dialog" ).dialog();
event.preventDefault();
});
});

<div id="dialog" title="Basic dialog">
<p>Mail Sent successfully</p>
</div>


which is not working.

I also tried,
return false
in script and

<form method= "post" onsubmit= "return false()">


Any help appreciated

Answer

You are missing id="target" in form

<form method= "post" id="target">
  <input type="submit"/>  
</form>

<script>
$( "#target" ).submit(function( event ) {
  $( "#dialog" ).dialog();
  event.preventDefault();
});
</script>

Here is demo https://jsbin.com/duyevo/edit?html,js,output

Comments