I've been trying to execute a javascript function just before submit on a
form that contains an <input type="file"> input field and it isn't working.
The reason I want to do this is the end users will be uploading files that
are between 1 and 2 Meg. in size, and they are not too knowledgeable about
computers. I want to disable the form buttons so they can't hit them after
they hit the "upload" button. We're trying to prevent them from repeatedly
hitting the "upload" button, or hitting some other button on the form in the
midst of the upload.
What I've run into is if I have the button control process a client-side
onclick event it runs my javascript, but then does not submit the form. It
does this no matter what kind of button control I've used. I've tried using
the <input type="submit"> standard HTML button, as well as the <asp:button>
control. I've also tried submitting the form from my javascript, and it
submits it to the server, but then the server side button click message
doesn't fire.
I'm wondering if it isn't working because this input tag is in the form, or
if I'm doing something wrong. Here's a sketch of the page:
<head>
<script type="text/javascript">
function DisableControls()
{
var w=document.getElementById("btnBack");
w.disabled=true;
var x=document.getElementById("btnUpload");
x.disabled=true;
var y=document.getElementById("inputFile");
y.disabled=true;
}
</script>
</head>
<body>
<form id="Form1" encType="multipart/form-data" runat="server">
...
<input id="inputFile" type="file" runat="server">
<asp:Button id="btnUpload" runat="server" Text="Upload"></asp:Button>
</form>
</body>
In my codebehind I have:
private void Page_Load(object sender, System.EventArgs e)
{
// add onclick client-side event to button
btnUpload.Attributes.Add("onclick", "DisableControls()");
}
// btnUpload is wired to this function on the server
protected void btnUpload_Click(object sender, System.EventArgs e)
{
...
}
