user1089345 user1089345 - 1 year ago 78
ASP.NET (C#) Question

Javascript code is not working on putting html code inside 'form' tag. why?

this is my code

I have a aspx file. I have two javascripts code in it. I have a css code also. I need to fade out the label on button click. It is working when I without use form tag and why not working on using form tag.

<!DOCTYPE html>

<html xmlns="">
<head runat="server">

<style type="text/css">
margin:0 auto;
box-shadow: 10px 10px 5px #888888;

<script src="google.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$(".btn1").click(function () {
$("#dvMsg").fadeOut(5000, 0, 0);


<form id="form1">
<div id="dvMsg" class="notification" runat="server" visible="true">
<asp:Label ID="lblMsg" runat="server" Text="This is just "></asp:Label>

<button class="btn1">Fade out</button>


If I remove form tag, label is fading out properly. But if I put html code inside tag label is not fading out. Kindly reply

Answer Source

As mentioned in this post and in MDN reference, the default type for a button is submit, which behaves differently when the button is in a form. To avoid sumbitting the form and get the result that you expect, you should set the button type to button:

<button class="btn1" type="button">Fade out</button>