Information Box causing validation - asp.net

I have an ASP page in which I have a file uploader. This file uploader has a required field validator attached to it. When I choose the desired file to upload the file uploads successfully and an Information Box appears with a success message.
When I click OK on the Information Box to make it go away, it attempts to validate the whole page again and the Information Box won't disappear.
I have tried setting the CausesValidation property on the file uploader to false but no luck. I've also tried AutoPostBack and IsPostBack.
aspx code
<%# Page Title="Excel File Content Upload" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master"
CodeBehind="ExcelFileContentUpload.aspx.vb" Inherits="Company.Applications.ProductionEngine.UI.ExcelFileContentUpload" %>
<%# Register Src="~/GenericControls/UC_InformationMessageBox.ascx" TagName="InformationBox"
TagPrefix="uc" %><asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<h2>
<asp:Label ID="lblTitle" Text="Excel File Content Upload" runat="server" />
</h2>
<br />
<asp:FileUpload ID="fileUploader" runat="server" Width="400px"/>
<br />
<br />
Choose Year: <asp:DropDownList ID="ddlYear" runat="server"></asp:DropDownList>
Choose Month: <asp:DropDownList ID="ddlMonth" runat="server"></asp:DropDownList>
<br />
<br />
<asp:Button ID="btnDataUpload" runat="server" Text="Upload Data" CssClass="buttonBlue"
Visible="true" Width="115px"/>
<asp:UpdatePanel ID="MainContentUpdatePanel" runat="server">
<ContentTemplate>
<uc:InformationBox ID="InformationBox" runat="server" EnableViewState="true"/>
<asp:RequiredFieldValidator ID="rvfFileUploader" runat="server" ControlToValidate="fileUploader"
ErrorMessage="* Select an Excel file to upload" ForeColor="Red"></asp:RequiredFieldValidator>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
Page Load
#Region "PAGE LOAD"
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
'Load years and months into their respective dropdown lists
If Not Page.IsPostBack Then
Dim _currentYear As Integer = DateTime.Now.Year
Dim _previousYear As Integer = DateTime.Now.Year - 1
Dim _month = CultureInfo.CreateSpecificCulture("en").DateTimeFormat.MonthNames
For i As Integer = 0 To _month.Length - 1
ddlMonth.Items.Add(New ListItem(_month(i), i + 1).ToString())
Next
ddlYear.Items.Add(_currentYear)
ddlYear.Items.Add(_previousYear)
End If
End Sub
#End Region

<asp:Button ID="btnDataUpload" runat="server" Text="Upload Data" CssClass="buttonBlue" Visible="true" Width="115px" ValidationGroup="A" />
<asp:UpdatePanel ID="MainContentUpdatePanel" runat="server">
<ContentTemplate>
<uc:InformationBox ID="InformationBox" runat="server" EnableViewState="true"/>
<asp:RequiredFieldValidator ID="rvfFileUploader" runat="server" ControlToValidate="fileUploader" ErrorMessage="* Select an Excel file to upload" ForeColor="Red" ValidationGroup="A"></asp:RequiredFieldValidator>
</ContentTemplate>
</asp:UpdatePanel>
I think another option might be to take the InformationBox out of the UpdatePanel, and put the Button inside the panel, and use the defaultButton property. That works with asp:Panels easily enough.

Related

accessing usercontrol properties from codebehind

I have created a basic User Control with three drop down (Year,Month,Date) that exposes properties that
I wish to set from my code-behind page. This works fine
<%# Control Language="VB" AutoEventWireup="false" CodeFile="DateControl.ascx.vb" ClassName="DateControl"
Inherits="DateControl" %>
<%--<asp:ScriptManager ID="dd" runat="server">
</asp:ScriptManager>--%>
<div class="form-inline">
<div class="form-group">
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:DropDownList ID="ddlDay" OnSelectedIndexChanged="DDLActual_OnChange" runat="server" CssClass="form-control" />
<asp:DropDownList ID="ddlMonth" OnSelectedIndexChanged="DDLActual_OnChange" runat="server" CssClass="form-control" />
<asp:DropDownList ID="ddlYear" OnSelectedIndexChanged="DDLActual_OnChange" runat="server" CssClass="form-control" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
The problem started when i placed this usercontorl in repeater and try to access from codebehind on every item change by creating
method
<uc3:DateControl ID="txtDate" runat="server" Visible="false" OnChange="txtDate_PostBack" />
Protected Sub txtDate_PostBack(ByVal sender As Object, ByVal e As System.EventArgs)
Dim btndetails As DateControl = TryCast(sender, DateControl)
Dim ltrIsFormulaApplied As Literal = DirectCast(btndetails.FindControl("ltrIsFormulaApplied"), Literal)
End If
btndetails is showing nothing, i am not able to access values of other control, any help would be really appreciated..

Set the focus AND maintain the scroll position ASP.NET AJAXControlToolkit

I have a page that loads a data grid. The first column has link buttons with an edit command which calls a modal popup with the focus set on the first field which is either a text box or drop down list.
Now my issue is, when I scroll down on the data grid and select edit, the page scrolls upwards, pushing down the row in the data grid that I selected to edit, just before the modal pops up. The only way to maintain the scroll position is by removing the focus from my modal popup.
Is there any way to set the focus AND maintain the scroll position?
I am using ASP.NET Version 4.5.51650, AJAXControlToolkit Version 15.1.2, VB.NET
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<asp:DataGrid ID="DataGrid" runat="server">
<Columns>
<asp:TemplateColumn HeaderText="Name">
<ItemTemplate>
<asp:LinkButton ID="lb_Name" CommandName="Edit" runat=server />
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</asp:DataGrid>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" style="display:none" runat="server" />
<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender" TargetControlID="Button1" PopupControlID="ModalPopupExtender_Panel" runat="server" />
<asp:Panel ID="ModalPopupExtender_Panel" style="display:none" DefaultButton="ModalPopupExtender_Ok" runat="server">
<asp:Table runat="server">
<asp:TableRow>
<asp:TableCell>
<asp:Textbox ID="Textbox1" runat="server" />
</asp:TableCell>
</asp:TableRow>
</asp:Table>
<div>
<asp:Button ID="ModalPopupExtender_Ok" Text="Save" runat="server" />
<asp:Button ID="ModalPopupExtender_Cancel" Text="Cancel" runat="server" />
</div>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
Code Behind:
Private Sub BindDataGrid()
'code goes here
UpdatePanel1.Update()
End Sub
Private Sub DataGrid_EditCommand(ByVal source As Object, ByVal e As DataGridCommandEventArgs) Handles DataGrid.EditCommand
'code goes here
UpdatePanel2.Update()
Textbox1.Focus()
ModalPopupExtender.Show()
SetFocus uses javascript function "scrollIntoView" to scroll to the focused field, you can override it using the following code, this will scroll the page only if the field is not in the visible area,
$( document ).ready(function() {
HTMLInputElement.prototype.scrollIntoView = function(a) {
this.scrollIntoViewIfNeeded();
}
HTMLSelectElement.prototype.scrollIntoView = function(a) {
this.scrollIntoViewIfNeeded();
}
HTMLAreaElement.prototype.scrollIntoView = function(a) {
this.scrollIntoViewIfNeeded();
} });

TabPanel close button

I have an asp.net website in which I'm using an AJAX TabContainer. Within this container I have one TabPanel. Inside this panel I want to have a close button which would, upon clicking, close (visible=false) this panel.
Sample:
<cc1:TabContainer ID="tbcMain" runat="server" Width="100%" ActiveTabIndex="0" CssClass="Tab">
<cc1:TabPanel ID="tbp1" runat="server" Visible="false">
<HeaderTemplate>
<asp:Label ID="lbl_tbp1_Title" runat="server"></asp:Label>
<asp:ImageButton ID="imb_tbp1_Close" runat="server" ImageUrl="~/Images/cross.png" />
</HeaderTemplate>
<ContentTemplate>
some content
</ContentTemplate>
</cc1:TabPanel>
</cc1:TabContainer>
The button imb_tbp1_Close does not cause a postback. I belive it's something with the whole region of HeaderTamplate being clickable and thus my button stays behind (like a z-index of sorts).
How can I make my button receive the click and cause a postback?
Edit, the solution I'm using now:
Firstly I could use an actual button event in the code-behind but ImageButton control does not have the property UseSubmitBehavior to set it false. So I handle the event in my Page_Load.
<cc1:TabPanel ID="tbpCust_1" runat="server" Visible="false">
<HeaderTemplate>
<asp:Label ID="lbl_UC_CUSTO_1_Title" runat="server"></asp:Label>
<asp:ImageButton ID="imb_CUSTO_Close_1" runat="server" ImageUrl="~/Images/cross.png" OnClientClick="javascript:__doPostBack('imb_CUSTO_Close_1', '0')" />
</HeaderTemplate>
<ContentTemplate>
<ucCUSTO:UC_CUSTO ID="UC_CUSTO_1" runat="server" />
</ContentTemplate>
</cc1:TabPanel>
and in the code-behind:
Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
Dim evtTarg As String = Request.Form("__EVENTTARGET")
Dim evtArg As String = Request.Form("__EVENTARGUMENT")
If evtTarg = "imb_CUSTO_Close_1" Then
UC_CUSTO_1.clear_fields()
tbcStranke.Tabs(0).Visible = False
ElseIf evtTarg = "imb_CUSTO_Close_2" Then
UC_CUSTO_2.clear_fields()
tbcStranke.Tabs(1).Visible = False
End If
End Sub

Can't set ModalPopupExtender control values using UpdatePanel in ASP.NET

Working with asp.net, I have a gridview inside an update panel, populated with dynamic user controls (loaded in placeholder1 on rowdatabound). A user enters text in a textbox of the user control, clicks the "confirm" button of the user control, a modal popup displays a "confirmation" message with the user's value of the text box. The button click event of the user control handles setting the modal popup extender control values and shows the popup.
This works as expected when the gridview is not in an update panel/no update panel is used. Once I place the gridview in an update panel, when the modal popup appears, it doesn't show the values that were set in the button click event (I've confirmed the click event is firing, controls are being found, and values are getting set in the event). I must be missing something...and/or don't quite understand the architecture of the update panel and how it behaves with dynamic controls.
[code below has been simplified]
GRIDVIEW
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="gvSaleData" runat="server" DataKeyNames="ItemNumber"
AutoGenerateColumns="False" ShowFooter="True" />
<Columns>
<asp:TemplateField ShowHeader="false">
<ItemTemplate>
<div>
<asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
</div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
MODAL POPUP
<asp:modalpopupextender id="mp1" runat="server"
cancelcontrolid="btnCancel"
targetcontrolid="btnShow" popupcontrolid="pnlShow"
popupdraghandlecontrolid="PopupHeader" drag="true"
backgroundcssclass="ModalPopupBG">
</asp:modalpopupextender>
<asp:panel id="pnlShow" style="display:none" runat="server">
<div class="popupcontainer">
<div>Your Value: <asp:Label ID="lblUserValue" runat="server" Text=""></asp:Label></div>
<asp:Button ID="btnConfirm" runat="server" Text="Confirm"
onclick="btnConfirm_Click" CssClass="submit"/>
<asp:Button ID="btnCancel" runat="server" Text="Return"
onclick="btnCancel_Click" CssClass="submit"/>
</div>
</asp:panel>
USER CONTROL CODE BEHIND
protected void btnShowConfirmation_Click(object sender, EventArgs e)
{
AjaxControlToolkit.ModalPopupExtender mp =(AjaxControlToolkit.ModalPopupExtender)Page.FindControl("mp1");
Label lblUserValue = (Label)mp.FindControl("lblUserValue");
lblUserValue.Text = textbox1.Text;
mp.Show();
}
I only came across this question recently, a year after it was asked and am posting a solution in case any one else has the same problem.
The answer is to put the the ModalPopupExtender panel "pnlShow" inside an update panel with an AsycPostBackTrigger added whose ID is btnShowConfirmation.
If btnShowConfirmation is dynamically added it should be added to the UpdatePanel dynamically.
The attached example shows two buttons which raise the modal popup. The trigger reference to btnX is added in the aspx code,the btnY triger is added dynamically as an example.
[Aspx code]
<%# Page Language="vb" AutoEventWireup="false" CodeBehind="TestModalPopup.aspx.vb"
Inherits="USSGAinfo.TestModalPopup" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.modalPopupX
{
background-color: #DDFFDD;
border-width: 2px;
border-style: solid;
border-color: black;
padding-top: 20px;
padding-left: 10px;
width: 400px;
height: 150px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</ajaxToolkit:ToolkitScriptManager>
<!-- Hidden Field -->
<asp:UpdatePanel runat="server" ID="up1" ChildrenAsTriggers="false" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="OkButton" />
</Triggers>
<ContentTemplate>
<asp:Button runat="server" ID="btnX" Text="X" />
<asp:Button runat="server" ID="btnY" Text="Y" /><br />
<asp:Label runat="server">Confirm:</asp:Label><asp:Label runat="server" ID="lblResult"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
<asp:HiddenField ID="hidForModal" runat="server" />
<ajaxToolkit:ModalPopupExtender ID="MPE" runat="server" TargetControlID="hidForModal"
PopupControlID="pnlTarget" BackgroundCssClass="modalBackground" PopupDragHandleControlID="pnlTarget">
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="pnlTarget" Style="display: none" runat="server">
<asp:UpdatePanel runat="server" ID="up2" ChildrenAsTriggers="false" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnX" />
<%-- <asp:AsyncPostBackTrigger ControlID="btnY" />--%>
</Triggers>
<ContentTemplate> <asp:Panel runat="server" ID="Panel1" HorizontalAlign="Center" DefaultButton="OkButton"
CssClass="modalPopupX">
<asp:Table runat="server">
<asp:TableRow runat="server">
<asp:TableCell runat="server" ID="tcResult" HorizontalAlign="Center" Width="400px" Height="20px" BackColor="AntiqueWhite">Button Clicked:
<asp:label runat="server" ID="lblMPEResult"></asp:label>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
<br />
<asp:Button ID="OkButton" runat="server" Text="Yes" />
<asp:Button ID="CancelButton" runat="server" Text="No" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
</form>
</body>
</html>
[Code behind]
Public Class TestModalPopup
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
' Add btnY as trigger for ModalPopoup update panel
Dim trigger As New AsyncPostBackTrigger
trigger.ControlID = "btnY"
trigger.EventName = "Click"
up2.Triggers.Add(trigger)
End Sub
Private Sub btnX_Click(sender As Object, e As System.EventArgs) Handles btnX.Click
' Put button dependent info into ModalPopup and then show
lblMPEResult.Text = "XXX"
MPE.Show()
End Sub
Private Sub btnY_Click(sender As Object, e As System.EventArgs) Handles btnY.Click
' Put button dependent info into ModalPopup and then show
lblMPEResult.Text = "YYY"
MPE.Show()
End Sub
Private Sub OkButton_Click(sender As Object, e As System.EventArgs) Handles OkButton.Click
' Show that OK button was pressed and also information derived from the ModalPopup
lblResult.Text = lblMPEResult.Text
MPE.Hide()
End Sub
Private Sub CancelButton_Click(sender As Object, e As System.EventArgs) Handles CancelButton.Click
MPE.Hide()
End Sub
End Class

Ajax Extension (Timer) stopped working when I retrieve value from DataTable

Currently I have an Ajax Timer which executes a function every few second. It is working perfectly fine until I tried to retrieve data from a DataTable. I have no idea why. I have tried debugging. I even placed label on the page to check.
For example the Ajax Timer:
Protected Sub Timer1_Tick(sender As Object, e As System.EventArgs) Handles Timer1.Tick
Label1.Text = DateTime.Now.ToLongTimeString()
End Sub
The datalist (the one giving the problem):
Protected Sub dlOrgProfile_ItemCreated(sender As Object, e As System.Web.UI.WebControls.DataListItemEventArgs) Handles dlOrgProfile.ItemCreated
Dim bizLayerMgmt As BlOrganizations
Dim dt As DataTable
bizLayerMgmt = New BlOrganizations()
dt = bizLayerMgmt.getOrgDetails(userId).Tables(0)
ddl = CType(e.Item.FindControl("ddlCoType"), DropDownList)
Dim value As Integer = Convert.ToInt32(dt.Rows(0)(3)) 'I have narrowed the problem to this line, if I comment this line.. everything works perfectly
ddl.SelectedValue = value
End Sub
The problem lies in the dt.Rows(0)(3). I have no idea why. I need to use it to retrieve some data from the database.
Just in case if its the front-end side.. here's the markup for the site.
<div class="content">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:Timer ID="Timer1" runat="server" Interval="1000">
</asp:Timer>
<asp:DataList ID="dlOrgProfile" runat="server" DataSourceID="odsOrgDetails"
EnableTheming="True" RepeatLayout="Flow" ShowFooter="False" ShowHeader="False">
<ItemTemplate>
<h3>
<asp:TextBox ID="txBxCoName" runat="server" Text='<%# Eval("OrgName") %>'></asp:TextBox>
<div class="ddlSelect">
<asp:DropDownList ID="ddlCoType" runat="server" DataSource='<%# listOrgType() %>' DataTextField="OrganizationType" DataValueField="OrgTypeID" >
</asp:DropDownList>
</div>
<h3>
</h3>
<a id="linkCoImg" href="upload_co_logo.aspx">
<asp:Image ID="CoImg" runat="server" ImageUrl="~/logo/org/default.png" />
<span>Change</span> </a>
<br />
<div id="description">
<textarea id="taCoDesc" rows="2" cols="1"><%# Eval("Description") %></textarea>
</div>
<br />
<asp:Label ID="lblContacts" runat="server" Text="Contacts:"></asp:Label>
<br />
<div id="contacts">
<asp:TextBox ID="tbContactOffice" runat="server" CssClass="tbContacts"></asp:TextBox>
<asp:TextBox ID="tbContactFax" runat="server" CssClass="tbContacts"></asp:TextBox>
<asp:TextBox ID="tbContactMail" runat="server" CssClass="tbContacts2"></asp:TextBox>
</div>
<br />
<asp:Button ID="btnSave" runat="server" CommandArgument='<%# Eval("OrgID") %>'
CommandName="save" Text="Save" />
</h3>
</ItemTemplate>
</asp:DataList>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</div>
Okay I have resolved my own problem.. Still don't really get it why but this is what I did.. Instead of using ItemCreated, I used ItemDataBound.
Protected Sub dlOrgProfile_ItemDataBound(sender As Object, e As System.Web.UI.WebControls.DataListItemEventArgs) Handles dlOrgProfile.ItemDataBound
Dim bizLayerMgmt As BlOrganizations
Dim dt As DataTable
bizLayerMgmt = New BlOrganizations()
dt = bizLayerMgmt.getOrgDetails(userId).Tables(0)
ddl = CType(e.Item.FindControl("ddlCoType"), DropDownList)
Dim value As Integer = Convert.ToInt32(dt.Rows(0)(3))
ddl.SelectedValue = value
End Sub

Resources