fileupload inside tab control


G

gremlin321

i have a tab control inside updatepanel and when trying to upload file i only
see that
fileupload.filename is empty. placing upload control outside tab control
with adding trigger works fine however. is there any way to get this to work
with the tab control?

here is a mockup of what i have
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="with_tab.aspx.cs"
Inherits="WebApplication2.with_tab" %>

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit"
tagprefix="cc1" %>

<!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>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div style="height: 536px">


<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional">

<ContentTemplate>
<cc1:TabContainer ID="TabContainer1" runat="server"
ActiveTabIndex="0"
Height="304px" Width="1150px" oninit="TabContainer1_Init">
<cc1:TabPanel ID="TabPanel1" runat="server"
HeaderText="TabPanel1" Height ="200">
<HeaderTemplate>
TabPanel1
</HeaderTemplate>

<ContentTemplate>
<br />
<br />
<asp:Button ID="Button1" runat="server"
onclick="Button1_Click1" Text="Update" Width=80 />
<br />
<br />
<asp:FileUpload ID="FileUpload1" runat="server"
Height="35px" Width="392px" />

<br />
</ContentTemplate>

</cc1:TabPanel>
</cc1:TabContainer>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
 
Ad

Advertisements

B

bruce barker

the tab is fine, the fileupload will not work inside an update panel
unless a full postback is done. so if a fileupload is rendered in the
update panel (tab picked), turn async postback off in the updatepanel.

-- bruce (sqlwork.com)
 
Ad

Advertisements

Joined
Jan 25, 2012
Messages
1
Reaction score
0
file upload control is not working in tabcontainer in asp.net

Hi all,

i am using ajax tabcontainer in my web page in this i have 3 tab panels in my first tab panel i have file upload control and one button. when i click on the button uploaded file should sace in images folder present in the solution.

here, After i uploaded the file when i click on the button i am checking for (Fileupload1.HasFile != false) here hasfile is false always. can any one please help me to solve this.

Here is my code: (client side)

<asp:TabContainer ID="tc1" runat="server" ActiveTabIndex="0" OnDemand="true" AutoPostBack="false"
OnActiveTabChanged="ActiveTabChangedServer">
<asp:TabPanel ID="TabPanel1" runat="server" HeaderText="Utility Logo" OnDemandMode="Always">
<ContentTemplate>
<div id="Div2" class="form-content" runat="server">
<table width="100%">
<tr>
<td class="warning-msg" align="center">
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</td>
</tr>
<tr>
<td class="subHeading">
<h1>
<asp:Label ID="Label2" runat="server" Text=" Upload Utility Logo "></asp:Label>
</h1>
</td>
</tr>
<tr>
<td align="center">
<asp:panel ID="pnlUtilityLogo" runat="server">
<table width="100%" cellpadding="6">
<tr>
<td align="left" class="content-td1">
<b>Logo</b>
</td>
<td align="left" class="content-td2">
<%-- <asp:AsyncFileUpload ID="flupLogo" runat="server" Width="212px" CssClass="{required:true}">
</asp:AsyncFileUpload>--%>
<asp:FileUpload ID="flupLogo" runat="server" Width="212px" CssClass="{required:true}">
</asp:FileUpload>
</td>
</tr>
<tr>
<td>
</td>
<td class="content-td2">
<asp:Button ID="btnSubmitLogo" runat="server" Text="Upload" CssClass="button" OnClick="btnSubmitLogo_Click"
OnClientClick="return CheckFileExistence()" />
</td>
</tr>
</table>
</asp:panel>
</td>
</tr>
</table>
</div>
</ContentTemplate>
</asp:TabPanel>
<asp:TabPanel ID="TabPanel2" runat="server" HeaderText="Configure State & Country"
OnDemandMode="Always">
<ContentTemplate>
</ContentTemplate>
</asp:TabPanel>
</asp:TabContainer>
</div>
</asp:Content>
java script:
<script type="text/javascript">
function CheckFileExistence() {
var filePath = document.getElementById('<%= this.flupLogo.ClientID %>').value;
if (filePath.length < 1) {

alert("File Name Can not be empty"); return false;
}
var ext = filePath.substring(filePath.lastIndexOf('.') + 1).toLowerCase();
if (ext == "png") {
return true;
}
alert('The file extension ' + ext.toUpperCase() + ' is not allowed!');
return false;
}
</script>
server side function:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{

}
}

protected void btnSubmitLogo_Click(object sender, EventArgs e)
{
if (flupLogo.HasFile && flupLogo.FileName != string.Empty && flupLogo.FileContent.Length > 0)
{
try
{
flupLogo.PostedFile.SaveAs(Server.MapPath("~/images/") + "\\" + flupLogo.FileName.ToString());
lblWarningMsg.Text = "Successfully Uploaded";
}
catch (Exception ex)
{
lblWarningMsg.Text = "Selected file is not an image.<br />" + ex.Message;
}
}
}
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top