UpdatePanel refreshing the whole page instead of the panel content - asp.net

EDIT: I have found my issue. I was using this line of code in the page load of my master page :
ScriptManager.RegisterStartupScript(Page, Me.GetType(), "fadeAllPartners", "fadeAll();", True)
I have this trouble in my master page contact form and in all the sub page form too.
In fact, I cannot get one update panel work..
I also tried to remove the triggers tag but without success.
All my page work with a master page which include the script manager here :
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager" runat="server" />
<div id="pageWrapper">
<asp:ContentPlaceHolder ID="ContentPlaceHolder" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
Here is one example of a form which refresh the whole page :
<asp:UpdatePanel runat="server" ID="UpdatePanelContacter" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="submitEmail" EventName="Click" />
</Triggers>
<ContentTemplate>
<div runat="server" id="BodyFooterForm" class="formSubmitEmail">
<h4>
<%=Resources.LangueRessources.FooterContactezNous%>
</h4>
<div class="centerFormContact">
<span id="lblCompany" runat="server" >
<%=Resources.LangueRessources.FooterFormContactCie%>
<b id="imgCompany" runat="server" ></b>
</span>
<input runat="server" type="text" id="txtCompany" >
<span runat="server" id="lblNom" >
<%=Resources.LangueRessources.FooterFormContactNom%>
<b id="imgNom" runat="server" ></b>
</span>
<input runat="server" type="text" name="txtNom" id="txtNom">
<span runat="server" id="lblEmail" >
<%=Resources.LangueRessources.FooterFormContactEmail%>
<b id="imgEmail" runat="server" ></b>
</span>
<input runat="server" type="text" name="txtEmail" id="txtEmail" >
<span runat="server" id="lblPhone" >
<%=Resources.LangueRessources.FooterFormContactPhone%>
<b id="imgPhone" runat="server" ></b>
</span>
<input runat="server" type="text" name="txtPhone" id="txtPhone" data-mask="(999) 999-9999" >
<span runat="server" id="lblTextarea" >
<%=Resources.langueRessources.FooterFormContactComments%>
<b id="imgTextArea" runat="server" ></b>
</span>
<textarea runat="server" id="txtTextarea" ></textarea>
<span id="lblEnvoyer" runat="server" >
<b id="imgEnvoyer" runat="server" ></b>
</span>
<asp:Button runat="server" ID="submitEmail" class="submit" OnClientClick="return ValidateContactForm()" OnClick="submitEmail_CLick" />
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
<div class="clear">
</div>
Thanks !

I have found my issue. I was using this line of code in the page load of my master page :
ScriptManager.RegisterStartupScript(Page, Me.GetType(), "fadeAllPartners", "fadeAll();", True)

Related

asp:Updatepanel, trouble with updatepanels as my pages are doing full postback everytime I click on a button

I am having a simple page which has two steps:
step 1: create a username and password when I click next button it has to go to step 2: to enter all the information.
When I click the next button, the step 2 page loads and immediately goes back to step 1. I tried putting the update panels around entire step 2 but then it doesnt allow me to click previous button or submit button. I also tried surrounding all my labels and textboxes with update panel leaving the previous and submit button but somehow it did not work too. Please help me out.
Also I have a bootstrap date picker included in this. I dont understand how to get the date entered in that box in code behind.
Here is my code:
Default.aspx
<%# Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Template/Main.Master" CodeBehind="Default.aspx.vb" Inherits="Library._Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap1-css">
<link rel="stylesheet" runat="server" media="screen" href="/css/StyleSheet.css" type="text/css" />
<link rel="stylesheet" runat="server" media="screen" href="~/css/StyleSheet3.css" type="text/css" />
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js" integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<%--<script type="text/javascript" src="/js/JavaScript.js"></script>--%>
<script type="text/javascript" src="/js/JavaScript1.js"></script>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<div class="container">
<div class="row">
<div class="span12">
<div class="" id="loginModal">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h2 class="col-xs-12 col-md-6" id="Heading1"> Welcome! </h2>
</div>
<div class="modal-body">
<div class="well">
<ul class="nav nav-tabs">
<li class="active">User Login</li>
<li>Manager Login</li>
<li>Create Account</li>
</ul>
<div id="myTabContent" class="tab-content">
<div class="tab-pane active in" id="Userlogin">
<div class="form-horizontal">
<fieldset>
<asp:UpdatePanel ID="uplogin" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSubmit" EventName="click" />
</Triggers>
<ContentTemplate>
<div class="control-group">
<asp:Label ID="lblUsername" runat="server" CssClass="col-xs-12" Text="UserName"></asp:Label>
<asp:TextBox ID="txtUsername" runat="server" CssClass="form-control"></asp:TextBox>
</div>
</ContentTemplate>
</asp:UpdatePanel>
<div class="control-group">
<asp:Label ID="lblPassword" runat="server" CssClass="col-xs-12" Text="Password"></asp:Label>
<asp:TextBox ID="txtPassword" TextMode="Password" CssClass="form-control" runat="server"></asp:TextBox>
</div>
<div class="control-group">
<div class="controls">
<asp:UpdatePanel ID="upLogin2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:button cssclass="btn btn-success btn-block" ID="btnULogin" runat="server" Text="Login"/>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</fieldset>
</div>
</div>
<div class="tab-pane fade" id="ManagerLogin">
<div class="form-horizontal">
<fieldset>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSubmit" EventName="click" />
</Triggers>
<ContentTemplate>
<div class="control-group">
<asp:Label ID="lblMUserName" runat="server" CssClass="col-xs-12" Text="UserName"></asp:Label>
<asp:TextBox ID="txtMUserName" runat="server" CssClass="form-control"></asp:TextBox>
</div>
</ContentTemplate>
</asp:UpdatePanel>
<div class="control-group">
<asp:Label ID="lblMPassword" runat="server" CssClass="col-xs-12" Text="Password"></asp:Label>
<asp:TextBox ID="txtMPassword" TextMode="Password" runat="server" CssClass="form-control"></asp:TextBox>
</div>
<div class="control-group">
<div class="controls">
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:button cssclass="btn btn-success" ID="btnMLogin" runat="server" Text="Login"/>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</fieldset>
</div>
</div>
<div class="tab-pane fade" id="create">
<div class="form-horizontal">
<fieldset>
<div class="container">
<div class="stepwizard col-md-offset-3">
<div class="stepwizard-row setup-panel">
<div class="stepwizard-step">
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="nav-item">
<asp:LinkButton ID="lnkbtnstep1" runat="server" CssClass="nav-link active" href="#step-1" data-toggle="tab" aria-controls="step1" role="tab" title="Step 1" Text="Step 1"></asp:LinkButton>
</li>
<li role="presentation" class="nav-item">
<asp:LinkButton ID="lnkbtnstep2" runat="server" CssClass="nav-link inactive" href="#step-2" data-toggle="tab" aria-controls="step2" role="tab" title="Step 2" Text="Step 2"></asp:LinkButton>
</li>
</ul>
</div>
</div>
</div>
<div role="form">
<div class="row setup-content tab-pane active" id="step-2">
<div class="col-xs-6 col-md-offset-3">
<div class="col-md-12">
<h3>Create Username and Password</h3>
<asp:UpdatePanel runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="prevBtn" />
</Triggers>
<ContentTemplate>
<div class="form-group">
<asp:Label ID="lblCUsername" runat="server" CssClass="col-xs-12" Text="UserName" class="form-control"></asp:Label>
<asp:TextBox ID="txtCUsername" runat="server" CssClass="form-control" required="required" placeholder="Enter Username"></asp:TextBox>
</div>
<div class="form-group">
<asp:Label ID="lblCPassword" runat="server" CssClass="col-xs-12" Text="Password" class="form-control"></asp:Label>
<asp:TextBox ID="txtCPassword" TextMode="Password" runat="server" CssClass="form-control" required="required" placeholder="Enter Password"></asp:TextBox>
</div>
</ContentTemplate>
</asp:UpdatePanel>
<div>
<asp:Button ID="prevBtn" runat="server" CssClass="btn btn-primary prevBtn btn-lg pull-left" Text="Previous" />
<asp:Button ID="btnSubmit" runat="server" CssClass="btn btn-primary btn-lg" Text="submit" />
</div>
</div>
</div>
</div>
</div>
<div class="row setup-content" id="step-1">
<div class="col-xs-6 col-md-offset-3">
<div class="col-md-12">
<h3>Add Information</h3>
<asp:UpdatePanel runat="server" UpdateMode="conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="nextBtn" />
</Triggers>
<ContentTemplate>
<div class="form-group">
<asp:Label ID="lblFirstName" runat="server" CssClass="col-xs-12" AssociatedControlID="txtFirstName" class="form-control" Text="FirstName"></asp:Label>
<asp:TextBox ID="txtFirstName" runat="server" CssClass="form-control" placeholder="Enter First Name"></asp:TextBox>
</div>
<div class="form-group">
<asp:Label ID="lblLastName" runat="server" CssClass="col-xs-12" AssociatedControlID="txtLastName" class="form-control" Text="LastName"></asp:Label>
<asp:TextBox ID="txtLastName" runat="server" CssClass="form-control" placeholder="Enter Last Name"></asp:TextBox>
</div>
<div class="form-group">
<asp:Label ID="lblAddress" runat="server" CssClass="col-xs-12" AssociatedControlID="txtAddress" class="form-control" Text="Address"></asp:Label>
<asp:TextBox ID="txtAddress" runat="server" CssClass="form-control" placeholder="Enter Address"></asp:TextBox>
</div>
<div class="form-group">
<asp:Label ID="lblDOB" runat="server" CssClass="col-xs-12" class="form-control" Text="Date Of Birth" Font-Bold="true"></asp:Label>
<div class="row">
<!-- Include Bootstrap Datepicker -->
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css" />
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker3.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.min.js"></script>
<div class="form-group">
<div class="col-xs-12 date">
<div class="input-group input-append date" id="datePicker">
<input type="text" class="form-control" name="date" />
<span class="input-group-addon add-on"><span class="glyphicon glyphicon-calendar"></span></span>
</div>
</div>
</div>
<script>
$(document).ready(function() {
$('#datePicker')
.datepicker({
format: 'mm/dd/yyyy'
})
.on('changeDate', function(e) {
// Revalidate the date field
$('#eventForm').formValidation('revalidateField', 'date');
});
$('#eventForm').formValidation({
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
name: {
validators: {
notEmpty: {
message: 'The name is required'
}
}
},
date: {
validators: {
notEmpty: {
message: 'The date is required'
},
date: {
format: 'MM/DD/YYYY',
message: 'The date is not a valid'
}
}
}
}
});
});
</script>
</div>
</div>
<div class="form-group">
<asp:Label ID="lblEmail" runat="server" CssClass="col-xs-12" AssociatedControlID="txtEmail" class="form-control" Text="Email"></asp:Label>
<asp:TextBox ID="txtEmail" runat="server" CssClass="form-control" placeholder="Enter Email"></asp:TextBox>
</div>
<div class="form-group">
<asp:Label ID="lblPhoneNumber" runat="server" CssClass="col-xs-12" AssociatedControlID="txtPhoneNumber" class="form-control" Text="Phone Number"></asp:Label>
<asp:TextBox ID="txtPhoneNumber" runat="server" CssClass="form-control" placeholder="Enter Primary Phone Number"></asp:TextBox>
</div>
<div class="form-group">
<asp:Label ID="lblSecondaryNumber" runat="server" CssClass="col-xs-12" AssociatedControlID="txtSecondaryNumber" class="form-control" Text="Secondary Phone Number"></asp:Label>
<asp:TextBox ID="txtSecondaryNumber" runat="server" CssClass="form-control" placeholder="Enter Secondary Phone Number"></asp:TextBox>
</div>
</ContentTemplate>
</asp:UpdatePanel>
<div>
<asp:Button ID="nextBtn" runat="server" CssClass="btn btn-primary nextBtn btn-lg pull-right" Text="Next" />
</div>
</div>
</div>
</div>
</div>
</fieldset>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Default.aspx.vb
Public Class _Default
Inherits Library.Helper
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not IsPostBack Then
txtUsername.Focus()
End If
End Sub
Protected Sub btnULogin_click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnULogin.Click
InitiateULogin()
End Sub
Protected Sub btnMLogin_click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnMLogin.Click
InitiateMLogin()
End Sub
Protected Sub btnSubmit_click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnSubmit.Click
InitiateCreateUserName()
InitiateAdd()
End Sub
Private Sub InitiateULogin()
Try
Dim conn As New Connection(Connection.EConnectionString.Library)
Using conn.Connection
Actions.ULogin(txtUsername.Text.Trim(), txtPassword.Text.Trim(), "User", conn.Connection)
End Using
Catch ex As Exception
Library.Helper.ShowMessage(ex.Message)
End Try
End Sub
Private Sub InitiateMLogin()
Try
Dim conn As New Connection(Connection.EConnectionString.Library)
Using conn.Connection
Actions.MLogin(txtMUserName.Text.Trim(), txtMPassword.Text.Trim(), "Manager", conn.Connection)
End Using
Catch ex As Exception
Library.Helper.ShowMessage(ex.Message)
End Try
End Sub
Private Sub InitiateCreateUserName()
Try
Dim conn As New Connection(Connection.EConnectionString.Library)
Using conn.Connection
Actions.CreateUserId(txtCUsername.Text, txtCPassword.Text, "User", conn.Connection)
End Using
Catch ex As Exception
Library.Helper.ShowMessage(ex.Message)
End Try
End Sub
End Class

link in the repeater first time only working inside the update panel control

I have link buttons for showing gridview and list view and also I have paging using datalist control all these being within the updatepanel.
Paging and listview link button and gridview link button working fine in the first load but the problem is when I'm doing any action within update panel like moving to next page or change gridview to listview then the <a> tag link within the repeator control is not working.
I have order buton inside the repeator control this will give the modal pop up for quantity selection and add to cart option but <a> tag not working it does not show modal.
This <a> tag is not working:
<a class="cur-pointer order button"
data-uid="<%#Container.DataItem("unit")%>"
data-uname="<%#Container.DataItem("UnitName")%>"
data-price="<%#Container.DataItem("price")%>"
data-pro-name="<%#Container.DataItem(productName)%>"
data-iid="<%#Container.DataItem("ItemId")%>">
<strong>
<asp:Literal runat="server" Text="<%$Resources:Resource,Order %>"></asp:Literal>
</strong>
</a>
full code here :
<div class="row" style="padding: 0px 0px 41px 0px;">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div class="sort-grid">
<div class="col-md-4 ">
<div class="sorting hiddenview">
<asp:LinkButton ID="gridlink" runat="server" CssClass="icongridlist"><i class="gridicon"></i></asp:LinkButton>
<asp:LinkButton ID="listlink" runat="server" CssClass="icongridlist"><i class="fa fa-list" style="color:#fff;"></i></asp:LinkButton>
</div>
</div>
<div class="col-md-4 col-md-offset-4">
<div class="sorting pagingdropdownmob">
<%-- style="width: 91px;"--%>
<h6>Show</h6>
<asp:DropDownList runat="server" ID="dropdownlist" Style="width: 42px;" AutoPostBack="True" OnSelectedIndexChanged="lbtnFirst_Click">
<%--AppendDataBoundItems = "true"--%>
<asp:ListItem Selected="True" Text="10" Value="10"></asp:ListItem>
<asp:ListItem Text="15" Value="15"></asp:ListItem>
<asp:ListItem Text="30" Value="30"></asp:ListItem>
<asp:ListItem Text="45" Value="45"></asp:ListItem>
</asp:DropDownList>
<div class="clearfix"></div>
</div>
<div class="sorting paginglistmob">
<h6>Page: </h6>
<%-- <asp:LinkButton ID="lbtnFirst" runat="server" CausesValidation="false" OnClick="lbtnFirst_Click" ></asp:LinkButton> --%>
<asp:LinkButton ID="lbtnPrevious" runat="server" CausesValidation="false" OnClick="lbtnPrevious_Click"><i class="fa fa-caret-left hoverclr"></i></asp:LinkButton>
<span>
<asp:DataList ID="dlPaging" runat="server" RepeatDirection="Horizontal" OnItemCommand="dlPaging_ItemCommand"
OnItemDataBound="dlPaging_ItemDataBound" Style="display: inline-block;">
<ItemTemplate>
<asp:LinkButton ID="lnkbtnPaging" runat="server" Style="color: #000;" CommandArgument='<%# Eval("PageIndex") %>'
CommandName="Paging" Text='<%# Eval("PageText") %>'></asp:LinkButton>
</ItemTemplate>
</asp:DataList>
<asp:LinkButton ID="lbtnNext" runat="server" CausesValidation="false"
OnClick="lbtnNext_Click"><i class="fa fa-caret-right hoverclr"></i></asp:LinkButton></span>
<%-- <asp:LinkButton ID="lbtnLast" runat="server" CausesValidation="false" OnClick="lbtnLast_Click">Last</asp:LinkButton></span>--%>
</div>
</div>
<div class="clearfix"></div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="row">
<asp:UpdatePanel ID="UpdatePanel3" runat="server" ChildrenAsTriggers="true">
<ContentTemplate>
<div class="single-pro">
<asp:PlaceHolder ID="phItem" runat="server" Visible="false">
<asp:Repeater ID="rptItem" runat="server">
<ItemTemplate>
<div class="col-md-3 col-sm-6 product-men">
<%-- col-md-4 col-sm-6--%>
<div class="men-pro-item simpleCart_shelfItem">
<div class="men-thumb-item">
<a href="javascript:void(0);">
<img alt="" class="pro-image-front" src="<%#Container.DataItem("ImageSrc")%>">
<img alt="" class="pro-image-back" src="<%#Container.DataItem("ImageSrc")%>">
</a>
<div class="men-cart-pro" style="padding-bottom: 8px;">
<div class="inner-men-cart-pro">
<asp:LinkButton runat="server"><i class="glyphicon glyphicon-zoom-in"></i> View</asp:LinkButton>
</div>
</div>
</div>
<%--men thumb item--%>
<div class="item-info-product ">
<h5 style="font-size: 16px; font-weight: 900; padding-left: 0px; padding-right: 0px; height: 42px; line-height: 17px;" class="m-none h-initial"><strong><%#Container.DataItem(productName)%></strong></h5>
<%--height:33px;--%>
<div class="info-product-price">
<strong><span class="item_price"><%#Container.DataItem("price")%> </span><%=GetGlobalResourceObject("Resource", "Currency")%><span> /<%#Container.DataItem("UnitName")%></span>
</div>
<div class="snipcart-details top_brand_home_details item_add single-item link-product-add-cart ">
<a class="cur-pointer order button" data-uid="<%#Container.DataItem("unit")%>" data-uname="<%#Container.DataItem("UnitName")%>" data-price="<%#Container.DataItem("price")%>" data-pro-name="<%#Container.DataItem(productName)%>" data-iid="<%#Container.DataItem("ItemId")%>"><strong>
<asp:Literal runat="server" Text="<%$Resources:Resource,Order %>"></asp:Literal></strong> </a>
</div>
</div>
<%-- item info product--%>
</div>
<%-- menproitem--%>
</div>
<%--colmd3--%>
</ItemTemplate>
</asp:Repeater>
</asp:PlaceHolder>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="row">
Because the Repeater is in an UpdatePanel, you need to rebind the data attributes after Async PostBack. Because the PostBack updates the UI and previous bindings are lost.
<script type="text/javascript">
$(document).ready(function () {
bindDataAttributes();
});
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(function () {
bindDataAttributes();
});
function bindDataAttributes() {
//call the jquery function that binds data-uid etc here
}
</script>
You need to populate the repeater on each postback. The best place for this is the OnInit event.

How to resolve this error in ASP.NET Web Forms 4.5.2: Invalid postback or callback argument?

I am a new ASP.NET Web Forms developer and I am currently using .NET Framework 4.5.2.I have a simple form that includes two textbox controls and two buttons. I am struggling right now with the button click event. When I click on the button, I got the following error and I don't know why.
I searched on the web and I couldn't find any solution to this. Could you please help me in this regard?
For your information, here's my ASP.NET Code:
<asp:UpdatePanel ID="upAdd" runat="server">
<ContentTemplate>
<div id="post-wrapper" class="row">
<div id="content" class="col-md-12 col-sm-12 col-xs-12">
<div id="login">
<div class="form-wrap">
<div role="form">
<div class="form-group">
<label for="email" class="control-label">Name</label>
<asp:TextBox ID="txtNameNew" runat="server" CssClass="form-control" placeholder="e.g. fire extinguisher"></asp:TextBox>
</div>
<div class="form-group">
<label for="key" class="control-label">Description</label>
<asp:TextBox ID="txtDescNew" runat="server" CssClass="form-control" placeholder="e.g. ........."></asp:TextBox>
</div>
<%--<div class="form-group">
<label for="key" class="control-label">ImagePath</label>
<asp:TextBox ID="TextBox2" runat="server" CssClass="form-control"></asp:TextBox>
</div>--%>
<asp:LinkButton ID="lbtnAdd" runat="server" CssClass="btn btn-primary"
OnClick="lbtnAdd_Click">
<span class="fa fa-plus"></span> Add</asp:LinkButton>
<asp:LinkButton ID="lbtnCancel" runat="server" CssClass="btn btn-default"
OnClick="lbtnCancel_Click">
<span class="fa fa-remove"></span> Cancel</asp:LinkButton>
</div>
<hr>
</div>
</div>
</div>
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="lbtnAdd" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="lbtnCancel" EventName="Click" />
</Triggers>
</asp:UpdatePanel>

<ASP:LOGIN> Control conflicts with other buttons on the page

I am not sure how to formulate the title of this issue. My problem is that I have a .ascx control which has control. When I make a page where I have buttons in the content, pressing the button causes Submit button to be fired.... I have absolutely no idea why this happens. Please give me any suggestions or idea how to fix this.
My Control code is :
<%# Control Language="VB" AutoEventWireup="false" CodeFile="TopRightMenuAnonn.ascx.vb" Inherits="Ctrls_TopRightMenuAnonn" %>
<ul class="nav pull-right" id="top-right_menu">
<li style="padding: 5px" class="dropdown">
<a class="dropdown-toggle" href="#" data-toggle="dropdown" style="padding:10px 15px;color: #73767D">Login<strong class="caret"></strong></a>
<div id="loginForm" class="dropdown-menu pull-right" style="padding: 15px;">
<asp:Login runat="server" ID="login1" DestinationPageUrl="~/Home.aspx">
<LayoutTemplate>
<asp:TextBox runat="server" ID="Username" style="margin-bottom:15px;" PlaceHolder="Username" Height="30px"></asp:TextBox>
<asp:TextBox runat="server" ID="Password" style="margin-bottom: 15px;" PlaceHolder="Password" Height="30px" TextMode="Password" />
<asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="Username" style="color: red" Text="Please enter an username."></asp:RequiredFieldValidator>
<asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password" style="color: red" Text="Please enter a password."></asp:RequiredFieldValidator>
<asp:Label ID="lblError" runat="server" Visible="false" Text=""></asp:Label>
<asp:Button ID="Login" runat="server" CommandName="Login" CssClass="btn btn-primary" style="clear: left; width: 100%; height: 32px; font-size: 13px;" Text="Sign In"></asp:Button>
Forgot password?<br />
<!--Fancybox for pass-->
<div style="display:none">
<div id="getpass" style="width: 100%;height:100%">
<span>Please enter your username to retrieve your password.</span>
<br />
<asp:TextBox runat="server" ID="txtForgotPass" PlaceHolder="Username" Height="30px" Width="100%" style="margin-top: 20px;margin-bottom:20px;"></asp:TextBox>
<asp:Button runat="server" ID="btnForgotPass" CssClass="btn btn-primary" style="clear:left;float: right;padding:10px" Text="Send My Password" />
</div>
</div>
<!--End of fancybox for pass-->
Forgot username?
<!-- Fancybox for user -->
<div style="display:none">
<div id="getuser" style="width: 100%;height: 100%">
<span>Please enter your e-mail to retrieve your username.</span>
<br />
<asp:TextBox runat="server" ID="txtForgotUser" PlaceHolder="example#materialconnexion.com" Height="30px" Width="100%" style="margin-top: 20px; margin-bottom: 20px;"></asp:TextBox>
<asp:Button runat="server" ID="btnForgotUser" CssClass="btn btn-primary" style="clear:left;float: right;padding: 10px" Text="Send My Username" />
</div>
</div>
<asp:ValidationSummary ID="ValidationSummary1" runat="server" ValidationGroup="login1" />
<!-- End of fancybox for user-->
</LayoutTemplate>
</asp:Login>
</div>
</li>
<li style="padding: 15px;border-left: 1px solid #999"><a style="padding: 0px !important;color: #73767D" href="../regtest.aspx">Register</a></li>
<li style="padding: 15px;border-left: 1px solid #999"><a style="padding: 0px !important;color: #73767D" href="../Pricing.aspx">Buy Credits</a></li>
</ul>
My control back-end code is(this is where shit happens and I cant figure out a way to make it work properly) :
Option Strict On
Partial Class Ctrls_TopRightMenuAnonn
Inherits System.Web.UI.UserControl
Protected Sub login1_LoggingIn(sender As Object, e As LoginCancelEventArgs) Handles login1.LoggingIn
Dim m As New MemberData(New MatconnDB(), login1.UserName)
If m.IsNew() Then
e.Cancel = True 'not in database
Return
End If
If m.ExpirationDate < Now() Then
e.Cancel = True
Return
End If
If m.Active = False Then
Return
End If
If m.unameEmail = False Then
Return
End If
If (MemberData.GetPassword(login1.UserName.ToString()) = MemberData.Encrypt(login1.Password.ToString())) Then
Session("User") = login1.UserName.ToString()
Response.Redirect("~/Home.aspx")
ElseIf MemberData.GetPassword(login1.UserName.ToString()) = login1.Password.ToString() Then
Session("User") = login1.UserName.ToString()
Response.Redirect("~/Home.aspx")
' Else
'I should put proper error messages here !!!!!!
End If
End Sub
End Class
My Master page file is :
<%# Master Language="VB" CodeFile="TopMenu.master.vb" Inherits="MasterPageLogged" AutoEventWireup="false" %>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>ssds</title>
</head>
<body>
<form id="form1" runat="server">
<div id="wrap">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container" id="cont_left-menu">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#left-menu">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="HomePage.aspx">
<img style="margin-top: -5px;" src="../images/mc-logo.jpg" />
</a>
</div>
<div class="collapse navbar-collapse" id="left-menu">
<ul class="nav navbar-nav">
<li>
Services
</li>
<li>
Tool
</li>
<li>
Work
</li>
<li>
Matter
</li>
<li>
About
</li>
<li>
Contact
</li>
</ul>
<asp:ContentPlaceHolder runat="server" ID="ContentTopMenuRight">
</asp:ContentPlaceHolder>
</div>
</div>
</nav>
<asp:ContentPlaceHolder runat="server" ID="ContentPlaceHolder1">
</asp:ContentPlaceHolder>
</div>
</form>
<link type="text/css" rel="stylesheet" href="../css/bootstrap.css"/>
<link type="text/css" rel="stylesheet" href="../css/bootstrap-theme.css"/>
<link type="text/css" rel="stylesheet" href="../css/Styles.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="../js/jquery.fancybox.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="../css/jquery.fancybox.css" type="text/css" media="screen" />
</body>
</html>
And my Simple test page is :
<%# Page Language="VB" AutoEventWireup="false" MasterPageFile="~/Masters/TopMenu.master" CodeFile="regtest.aspx.vb" Inherits="regtest" %>
<%# Register Src="~/Ctrls/TopRightMenuAnonn.ascx" TagName="TopRightMenuLogged" TagPrefix="tma" %>
<%# MasterType VirtualPath="~/Masters/TopMenu.master" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentTopMenuRight" runat="server">
<tma:TopRightMenuLogged ID="TopRightMenuLogged1" runat="server" />
</asp:Content>
<asp:Content ID="Content2" runat="server" ContentPlaceHolderID="ContentPlaceHolder1">
<div class="container">
<div class="col-md-6">
<asp:TextBox runat="server" ID="txtName" PlaceHolder="Name" class="txtedit"></asp:TextBox>
<asp:TextBox runat="server" ID="txtSurname" PlaceHolder="Surname" class="txtedit"></asp:TextBox>
<asp:TextBox runat="server" ID="txtMail" PlaceHolder="Email" class="txtedit"></asp:TextBox>
<asp:TextBox runat="server" ID="txtCompany" PlaceHolder="Company" class="txtedit"></asp:TextBox>
<asp:TextBox runat="server" ID="txtPass" PlaceHolder="Password" class="txtedit"></asp:TextBox>
<asp:TextBox runat="server" ID="txtPassV" PlaceHolder="Confirm Password" class="txtedit" AutoPostBack="True"></asp:TextBox>
<br />
<br />
<asp:CheckBox runat="server" ID="chkbox" Text="&nbspTerm and Conditions" style="margin-top: 10px" />
<br />
<br />
<br />
<br />
<asp:Button runat="server" ID="btnReg" Text="blqblq" />
<asp:Label runat="server" ID="lblText" Text=""></asp:Label>
<asp:Label runat="server" ID="lblCaption" Text=""></asp:Label>
</div>
</div>
</asp:Content>
Please advise..
Thanks in advance !
The MSDN docs page for the Button class states in a few places:
By default, all button controls submit the page when clicked.
It is unclear from your question which <asp:Button> control is causing the unwanted PostBack:
the one in your sample page (btnReg), or
one of the ones in your UserControl (Login, btnForgotPass, btnForgotUser)
However, if you don't want them to submit the page / cause a PostBack, then you need to
prevent that using client-side validation / etc, or
use a different control than <asp:Button> that does what you want it to.

Ajax Rating control in popup

I am developing a page to display some videos with asp .net fw3.5. The page will display a list of videos with thumbnails. When the user clicks a video thumb i will open a popup and show the video in the popup. There will be a rating control in the video.the user can vote for the video using the ajax rating control. the popup should remain shown after rating control is clicked.
I have done some of the coding but the problem is I cant get the current rating of the rating control without doing a postback. I can make the popup always visible by using an update panel but if i do so the close button of the modal popupextender doesnt work and i cannot close the modal popup. Here is my related code portion:
<asp:Button ID="Button1" runat="server" Style="display: none" />
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" OkControlID="btnOkay"
TargetControlID="Button1" PopupControlID="Panel1" PopupDragHandleControlID="PopupHeader"
Drag="true" BackgroundCssClass="ModalPopupBG">
</asp:ModalPopupExtender>
<asp:Panel ID="Panel1" runat="server" CssClass="PopupCss">
<table style="width: 100%; height: 100%;">
<tr>
<td>
<div id="mediaplayer">
JW Player goes here</div>
<script type="text/javascript">
jwplayer("mediaplayer").setup({
flashplayer: "jwplayer/player.swf",
file: "<%=videoName %>",
image: "<%=videoThumb %>",
width: "100%",
height: "100%"
});
</script>
</td>
<td valign="top" align="left" style="text-align: left;">
<div class="fb-like" data-send="true" data-layout="button_count" data-show-faces="true">
</div>
<br />
<div class="fb-comments" data-href="<%=videoLink%>"
data-num-posts="3" data-width="470">
</div>
<br />
<br />
<br />
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_preferred_1"></a><a class="addthis_button_preferred_2">
</a><a class="addthis_button_preferred_3"></a><a class="addthis_button_preferred_4">
</a><a class="addthis_button_compact"></a><a class="addthis_counter addthis_bubble_style">
</a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4f61d99d08697325"></script>
<!-- AddThis Button END -->
<br />
<br />
<asp:Rating ID="Rating1" runat="server" MaxRating="5" StarCssClass="ratingStar" FilledStarCssClass="ratingStarFilled"
AutoPostBack="true" OnChanged="VideoRatingChanged" EmptyStarCssClass="ratingStarEmpty"
WaitingStarCssClass="ratingStarEmpty">
<asp:HiddenField ID="HiddenField1" runat="server" Value='<%=videoId%>' />
</asp:Rating>
&nbsp (<%=voteCount%>)
<br />
Minder Score:
<%=minderScore %>
<br />
<div class="Controls" style="text-align: left;">
<input id="btnOkay" type="button" value="Kapat" />
</div>
</td>
</tr>
</table>
</asp:Panel>
How can i manage to have the desired functionality.
Any help will be appreciated.
Thanks
The easiest way to do it is to warp it with an UpdatePanel
<br />
<asp:UpdatePanel runat="server" ID="up1">
<ContentTemplate>
<asp:Rating ID="Rating1" runat="server" MaxRating="5" StarCssClass="ratingStar" FilledStarCssClass="ratingStarFilled"
AutoPostBack="true" OnChanged="VideoRatingChanged" EmptyStarCssClass="ratingStarEmpty"
WaitingStarCssClass="ratingStarEmpty">
<asp:HiddenField ID="HiddenField1" runat="server" Value='<%=videoId%>' />
</asp:Rating>
</ContentTemplate>
</asp:UpdatePanel>
For the part of total vote count, if you like to include it inside the UpdatePanel you need to change it with asp:literal controls, and render inside this control the results. So if you like to include this code inside the UpdatePanel, for automatic update them,
&nbsp (<%=voteCount%>)
<br />
Minder Score:
<%=minderScore %>
you need to write it as
&nbsp (<asp:Literal runat="server" id="txtVoteCount" />)
<br />
Minder Score: <asp:Literal runat="server" id="txtMinderScore" />
and on code behind place this values.
If you see this sample http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/Rating/Rating.aspx
and get the source code from the SDK, this is the way is doing it.

Resources