I have a page that I am working on that I’m linking multiple user controls to. The user control contains 3 buttons, an attach, clear and view button. When a user clicks on any control on the page, the resulting information is “dumped” into the last visible control on the page.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" MasterPageFile="DefaultPage.master" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<%@ Register tagName="FileHandler" src="FileHandling.ascx" tagPrefix="ucFile" %>
<asp:Content ID="Content1" ContentPlaceHolderID="Main" Runat="Server">
<asp:UpdatePanel ID="upPanel" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<table>
<tr>
<td>
<ucFile:FileHandler ID="fFile1" runat="server" />
</td>
<td>
<ucFile:FileHandler ID="fFile2" runat="server" />
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
All file handling and processing is handled within the control, with an event when the upload to the file server is complete via a file name that was generated. When either button is clicked, the file name is always stored internal to the control in the last control’s text box.
Control code:
<table style="width: 50%;">
<tr style="white-space: nowrap;">
<td style="width: 1%;">
<asp:Label runat="server" ID="lblFile" />
</td>
<td style="width: 20%;">
<asp:TextBox ID="txtFile" CssClass="backColor" runat="server" OnTextChanged="FileInformationChanged" />
</td>
<td style="width: 1%">
<%--<asp:Button runat="server" ID="btnUpload" CssClass="btn" Text="Attach" OnClick="UploadFile"/>--%>
<input type="button" id="btnUpload" class="btn" tabindex="30" value="Attach" onclick="SetupUpload();" />
</td>
<td style="width: 1%">
<%--<asp:Button runat="server" ID="btnClear" Text="Clear" CssClass="btn" OnClick="ClearTextValue"/>--%>
<input type="button" id="btnClearFile" class="btn" value="Clear" onclick="document.getElementById('<%=txtFile.ClientID%>').value = '';document.getElementById('<%=hfFile.ClientID%>').value = '';" />
</td>
<td style="width: 1%">
<a href="#here" onclick="ViewLink(document.getElementById('<%=hfFile.ClientID%>').value, '')">View</a>
</td>
<td style="width: 1%">
<asp:HiddenField ID="hfFile" runat="server" />
</td>
</tr>
</table>
<script type="text/javascript">
var ItemPath = "";
function SetupUpload(File) {
ItemPath = File;
VersionAttach('<%=UploadPath%>', 'true');
}
function UploadComplete(File) {
document.getElementById('<%=txtFile.ClientID%>').value = File.substring(File.lastIndexOf("/") + 1);
document.getElementById('<%=hfFile.ClientID%>').value = File;
alert('<%=txtFile.Text %>');
alert('<%=ClientID %>')
}
function ViewLink(File, Alert) {
if (File != "") {
if (File.indexOf("../data/") != -1) {
window.open(File, '_blank');
}
else {
window.open('../data/<%=UploadPath%>/' + File, '_blank');
}
}
else if (Alert == "") {
alert('No file has been uploaded for this field.');
}
}
</script>
The way I got this to work in my case was to put a title on the input button (client control), then passing the value of the clientid of the control that I wanted (textbox in this case) to the function in the onclick event (client event). I then “force” the consumer of the control to use this information when the button is clicked. The reason for the question here was to find out if there is a better way of accomplishing this within the control instead of making the consumer of the control handle the data. This does work for my purpose, it just doesn’t seem as clean as I would have liked.