J. Chavez J. Chavez - 1 month ago 14
Javascript Question

Jquery Dialog close unexpectedly using ASP Master Page

When i press the "Specify Services" button the dialog appears but it seems that is doing a postback and the the dialog is closing unexpectedly

<asp:Content ID="Content0" ContentPlaceHolderID="ContentPLaceHolderHeader" runat="server">
<script type="text/javascript">
$( function() {
var dialog;


dialog = $( "#dialog-form" ).dialog({
autoOpen: false,
height: 400,
width: 350,
modal: false,
buttons: {

}
});


$( "#spc" ).button().on( "click", function() {
dialog.dialog( "open" );

});
} );
</script>

</asp:Content>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<button id="spc">Specify Services</button>
<div id="dialog-form" title="Create new user">
<p class="validateTips">All form fields are required.</p>

<form>
<fieldset>
<label for="name">Name</label>
<input type="text" name="name" id="name" >
<label for="email">Email</label>
<input type="text" name="email" id="email" >

<input type="submit" tabindex="-1" style="position:absolute; top:-1000px">
</fieldset>
</form>
</div>

</asp:Content>


I have tried not using the Master Page/Content and that works fine.

Answer

By default the button tag acts as a submit button. So if you do not want it to do a postback you need to specify the button type.

Specify Services

Button types