Help with HtmlInputFile question?

[Larry O via DotNetMonster.com]

Hi - I'm a newbie to .NET and I was hoping someone would be so kind as to
help me out with a question?

Specifiec in my .aspx file: <input type="file" size="50" id="FileToSend"
runat="server" NAME="FileToSend"> and in my class as: protected System.Web.UI.
HtmlControls.HtmlInputFile FileToSend;

When the user clicks the Browse... button, chooses a file and clicks Open,
I'd like to be able to "intercept" the File before it is displayed in the
(input) field?

That way I could add the File to a running list of Files they would like to
Add/Upload. The AOL (web) Mail system allows multi-file uploads this way -- I
was just trying to see if I could do the same?

Thanks for any help!

Larry

 

[S. Justin Gengo]

Larry,

You could attach a ontextchanged javascript to the input that would take the
text in the input and add it to a list box.

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

www.aboutfortunate.com

"Out of chaos comes order."
Nietzsche

 

[Larry O via DotNetMonster.com]

Thanks for the suggestion.

So if you don't mind, a bit more detail?

If in my .ascx "html" code I add something like: <input onchange="javascript:
Changed( this );" type="file" ...
I can get the javascript function to fire but how can I update the WebControl
and then get the page to redisplay? For example, in my UserControl class (in
my .ascx.cs file) I have the following definition:

protected System.Web.UI.WebControls.TextBox Name;

We'll say I would like the javascript() to update this Name control and then
"refresh" the page? It doesn't seem that I can do this, right? (note that the
alert does work)

<script language="javascript">
function Changed( textControl )
{
alert( textControl.value );
Name.Text = textControl.value;
}
</script>

Thanks again for the help!

Larry

Larry,

You could attach a ontextchanged javascript to the input that would take the
text in the input and add it to a list box.

Hi - I'm a newbie to .NET and I was hoping someone would be so kind as to
help me out with a question?

[quoted text clipped - 17 lines]

Larry

 

[S. Justin Gengo]

Larry,

You'll need to look up a bit of javascript, but you can assign values to any
control on the page via javascript. So you could get the file path, add it
to a list box, and then delete the file path from the original input. I
wouldn't even worry about posting back until after your user has entered all
the files. Then give them a button to save the files that does the post back
after the list is complete.

To get you started here's the javascript to add an item to a listbox:

listbox.options[listbox.options.length] = new Option("Test", 15, false,
false);

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

www.aboutfortunate.com

"Out of chaos comes order."
Nietzsche

Thanks for the suggestion.

So if you don't mind, a bit more detail?

If in my .ascx "html" code I add something like: <input
onchange="javascript:
Changed( this );" type="file" ...
I can get the javascript function to fire but how can I update the
WebControl
and then get the page to redisplay? For example, in my UserControl class
(in
my .ascx.cs file) I have the following definition:

protected System.Web.UI.WebControls.TextBox Name;

We'll say I would like the javascript() to update this Name control and
then
"refresh" the page? It doesn't seem that I can do this, right? (note that
the
alert does work)

<script language="javascript">
function Changed( textControl )
{
alert( textControl.value );
Name.Text = textControl.value;
}
</script>

Thanks again for the help!

Larry

Larry,

You could attach a ontextchanged javascript to the input that would take
the
text in the input and add it to a list box.

Hi - I'm a newbie to .NET and I was hoping someone would be so kind as
to
help me out with a question?

[quoted text clipped - 17 lines]

Larry

 

[Larry O via DotNetMonster.com]

Thanks again.

Sorry for asking again but given what you describe, my previous example
should update the Name field, right? But it's not. I've done this many times
before with .asp with not problems -- isn't this different because I'm using
runat="server"? How do I flush the changes to the Name control so they
visually appear??

Thanks.

Larry

Larry,

You'll need to look up a bit of javascript, but you can assign values to any
control on the page via javascript. So you could get the file path, add it
to a list box, and then delete the file path from the original input. I
wouldn't even worry about posting back until after your user has entered all
the files. Then give them a button to save the files that does the post back
after the list is complete.

To get you started here's the javascript to add an item to a listbox:

listbox.options[listbox.options.length] = new Option("Test", 15, false,
false);

Thanks for the suggestion.

[quoted text clipped - 41 lines]

 

[S. Justin Gengo]

Larry,

No problem! Don't worry, we'll get it.

Sorry, I wasn't clearer. I'm saying that I think you should do this all
client side. I would remove the runat=server from the input field altogether
and just use a javascript to move the contents of the input from the input
field to the list box. Then afte the user is done getting all the file names
they want to upload into the list box use a submit button, perhaps called
upload and below the list box, to do the post back.

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

www.aboutfortunate.com

"Out of chaos comes order."
Nietzsche

Thanks again.

Sorry for asking again but given what you describe, my previous example
should update the Name field, right? But it's not. I've done this many
times
before with .asp with not problems -- isn't this different because I'm
using
runat="server"? How do I flush the changes to the Name control so they
visually appear??

Thanks.

Larry

Larry,

You'll need to look up a bit of javascript, but you can assign values to
any
control on the page via javascript. So you could get the file path, add it
to a list box, and then delete the file path from the original input. I
wouldn't even worry about posting back until after your user has entered
all
the files. Then give them a button to save the files that does the post
back
after the list is complete.

To get you started here's the javascript to add an item to a listbox:

listbox.options[listbox.options.length] = new Option("Test", 15, false,
false);

Thanks for the suggestion.

[quoted text clipped - 41 lines]

Larry

 

[Larry O via DotNetMonster.com]

Hi,

Well I got it to somewhat work but I believe I have a fundamental problem
mixing javascript with my <form> which is runat=server. This web application
is all runat=server and the page that I'm trying to integrate this change on
uses .NET features such as <asp:RegularExpressionValidator ...> So what
happens when my (javascript-written) data is visually on the page and a
Validator "refreshes" the page, the data is gone.

Here's my (non runat=server) code snippets...

First, I simply add the onchange():

<input onchange="javascript: Changed( this );" type="file" size="50"
id="FileToSend"
runat="server" NAME="FileToSend">

Then I just place a div tag where I want to display the Filename each time,
and an input field to house the data:

<div id="thediv"></div>
<input type=hidden id="thehidden">

Finally, the javascript:
<script language="javascript">
function Changed( theControl )
{
document.getElementById("thediv").innerHTML =
document.getElementById("thediv").innerHTML + "<br>" + theControl.
value;
}
</script>

Again, this is in an .ascx file where the <form> definition is 3 levels
removed. So when the user adds a few filenames, the list is visually
shown/updated properly on the page, but once a validator kicks in (e.g. <asp:
RequiredFieldValidator) all of the filenames previously shown on the page
goes away.

Is there a way to inplement this via .NET instead of using javascript or is
there a simple way to fix this?

Thanks much!

Larry

Larry,

No problem! Don't worry, we'll get it.

Sorry, I wasn't clearer. I'm saying that I think you should do this all
client side. I would remove the runat=server from the input field altogether
and just use a javascript to move the contents of the input from the input
field to the list box. Then afte the user is done getting all the file names
they want to upload into the list box use a submit button, perhaps called
upload and below the list box, to do the post back.

Thanks again.

[quoted text clipped - 32 lines]

 

[S. Justin Gengo]

Larry,

Ok, I didn't know a post back was involved before the form is submitted. You
should go ahead and make your hidden input into a server side control. It
shouldn't affect your javascript. To do so declare an object with the same
name as your input like this:

Protected WithEvents FileToSend As
System.Web.UI.HtmlControls.HtmlInputHidden

When a postback occurrs get and then reset whatever is in the hidden input:

In your pageload sub:

Dim List As String = FileToSend.Value

FileToSend.Value = List


Or are you saying that the Validators are resetting the field when they run
clientside? (I don't think any fields should be lost unless a post back
occurrs...)

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

www.aboutfortunate.com

"Out of chaos comes order."
Nietzsche

Hi,

Well I got it to somewhat work but I believe I have a fundamental problem
mixing javascript with my <form> which is runat=server. This web
application
is all runat=server and the page that I'm trying to integrate this change
on
uses .NET features such as <asp:RegularExpressionValidator ...> So what
happens when my (javascript-written) data is visually on the page and a
Validator "refreshes" the page, the data is gone.

Here's my (non runat=server) code snippets...

First, I simply add the onchange():

<input onchange="javascript: Changed( this );" type="file" size="50"
id="FileToSend"
runat="server" NAME="FileToSend">

Then I just place a div tag where I want to display the Filename each
time,
and an input field to house the data:

<div id="thediv"></div>
<input type=hidden id="thehidden">

Finally, the javascript:
<script language="javascript">
function Changed( theControl )
{
document.getElementById("thediv").innerHTML =
document.getElementById("thediv").innerHTML + "<br>" +
theControl.
value;
}
</script>

Again, this is in an .ascx file where the <form> definition is 3 levels
removed. So when the user adds a few filenames, the list is visually
shown/updated properly on the page, but once a validator kicks in (e.g.
<asp:
RequiredFieldValidator) all of the filenames previously shown on the page
goes away.

Is there a way to inplement this via .NET instead of using javascript or
is
there a simple way to fix this?

Thanks much!

Larry

Larry,

No problem! Don't worry, we'll get it.

Sorry, I wasn't clearer. I'm saying that I think you should do this all
client side. I would remove the runat=server from the input field
altogether
and just use a javascript to move the contents of the input from the input
field to the list box. Then afte the user is done getting all the file
names
they want to upload into the list box use a submit button, perhaps called
upload and below the list box, to do the post back.

Thanks again.

[quoted text clipped - 32 lines]

Larry

 

[Larry O via DotNetMonster.com]

Hi,

I've fooled with this for many hours and unfortunately it's still not working.
Maybe a couple of pointed questions will help?

- If I have a hidden server control (runat=server) that I need to update from
within a Javascript script, is that possible? If so, would you be so kind as
to provide a simple working sample?

By the way, when Validators fire, they (apparently) do not alter server side
controls but do "clear" everything else.

Thanks.

Larry

Larry,

Ok, I didn't know a post back was involved before the form is submitted. You
should go ahead and make your hidden input into a server side control. It
shouldn't affect your javascript. To do so declare an object with the same
name as your input like this:

Protected WithEvents FileToSend As
System.Web.UI.HtmlControls.HtmlInputHidden

When a postback occurrs get and then reset whatever is in the hidden input:

In your pageload sub:

Dim List As String = FileToSend.Value

FileToSend.Value = List

Or are you saying that the Validators are resetting the field when they run
clientside? (I don't think any fields should be lost unless a post back
occurrs...)

Hi,

[quoted text clipped - 66 lines]

 

[Larry O via DotNetMonster.com]

Or might someone know how I could accomplish this without Javascript at all?
Basically how could I do the equavalent of capturing an onChange() event, but
call a .NET function instead of a JavaScript function??

Thanks!

Hi,

I've fooled with this for many hours and unfortunately it's still not working.
Maybe a couple of pointed questions will help?

- If I have a hidden server control (runat=server) that I need to update from
within a Javascript script, is that possible? If so, would you be so kind as
to provide a simple working sample?

By the way, when Validators fire, they (apparently) do not alter server side
controls but do "clear" everything else.

Thanks.

Larry

Larry,

[quoted text clipped - 23 lines]

 

[S. Justin Gengo]

Larry,

Here you go:

I did this pretty quickly, so it could use some cleanup, but I've verified
that everything works.

First the html for the design view:

<body>
<script language="javascript">
function addFile(fileName) {
textbox = document.getElementById('TextBox1');

if (textbox.value == '')
{
textbox.value = fileName;
}
else
{
textbox.value = textbox.value + '\n' + fileName;
}

}
</script>
<form id="frmLogin" runat="server">
<P><INPUT type="file" onchange="javascript:addFile(this.value);"></P>
<p>
<asp:TextBox id="TextBox1" runat="server" TextMode="MultiLine"
Height="68px" Width="352px" Wrap="False"
ReadOnly="True"></asp:TextBox>
<asp:RequiredFieldValidator id="RequiredFieldValidator1" runat="server"
ErrorMessage="RequiredFieldValidator"
ControlToValidate="TextBox1"></asp:RequiredFieldValidator>
</p>
<P>
<asp:TextBox id="TextBox2" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="RequiredFieldValidator2" runat="server"
ErrorMessage="RequiredFieldValidator"
ControlToValidate="TextBox2"></asp:RequiredFieldValidator></P>
<P>
<asp:Button id="Button1" runat="server" Text="Button"></asp:Button></P>
</form>
</body>

And here's a button click event handler for the code behind to verify it
works:


Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles Button1.Click
Dim Files() As String = TextBox1.Text.Split(Chr(13))

For Each FileName As String In Files
Response.Write(FileName & "<br>")
Next
End Sub


--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

www.aboutfortunate.com

"Out of chaos comes order."
Nietzsche

Or might someone know how I could accomplish this without Javascript at
all?
Basically how could I do the equavalent of capturing an onChange() event,
but
call a .NET function instead of a JavaScript function??

Thanks!

Hi,

I've fooled with this for many hours and unfortunately it's still not
working.
Maybe a couple of pointed questions will help?

- If I have a hidden server control (runat=server) that I need to update
from
within a Javascript script, is that possible? If so, would you be so kind
as
to provide a simple working sample?

By the way, when Validators fire, they (apparently) do not alter server
side
controls but do "clear" everything else.

Thanks.

Larry

Larry,

[quoted text clipped - 23 lines]

Larry

 

[S. Justin Gengo]

Larry,

Change the form tag back to Form1.

I just noticed that it wasn't. I used a "Lab" project I fool around with all
the time when answering people's questions and I must have changed the
form's name at some point and not changed it back.

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

www.aboutfortunate.com

"Out of chaos comes order."
Nietzsche

Larry,

Here you go:

I did this pretty quickly, so it could use some cleanup, but I've verified
that everything works.

First the html for the design view:

<body>
<script language="javascript">
function addFile(fileName) {
textbox = document.getElementById('TextBox1');

if (textbox.value == '')
{
textbox.value = fileName;
}
else
{
textbox.value = textbox.value + '\n' + fileName;
}

}
</script>
<form id="frmLogin" runat="server">
<P><INPUT type="file" onchange="javascript:addFile(this.value);"></P>
<p>
<asp:TextBox id="TextBox1" runat="server" TextMode="MultiLine"
Height="68px" Width="352px" Wrap="False"
ReadOnly="True"></asp:TextBox>
<asp:RequiredFieldValidator id="RequiredFieldValidator1" runat="server"
ErrorMessage="RequiredFieldValidator"
ControlToValidate="TextBox1"></asp:RequiredFieldValidator>
</p>
<P>
<asp:TextBox id="TextBox2" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="RequiredFieldValidator2" runat="server"
ErrorMessage="RequiredFieldValidator"
ControlToValidate="TextBox2"></asp:RequiredFieldValidator></P>
<P>
<asp:Button id="Button1" runat="server" Text="Button"></asp:Button></P>
</form>
</body>

And here's a button click event handler for the code behind to verify it
works:


Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles Button1.Click
Dim Files() As String = TextBox1.Text.Split(Chr(13))

For Each FileName As String In Files
Response.Write(FileName & "<br>")
Next
End Sub


--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

www.aboutfortunate.com

"Out of chaos comes order."
Nietzsche

Or might someone know how I could accomplish this without Javascript at
all?
Basically how could I do the equavalent of capturing an onChange() event,
but
call a .NET function instead of a JavaScript function??

Thanks!

Hi,

I've fooled with this for many hours and unfortunately it's still not
working.
Maybe a couple of pointed questions will help?

- If I have a hidden server control (runat=server) that I need to update
from
within a Javascript script, is that possible? If so, would you be so kind
as
to provide a simple working sample?

By the way, when Validators fire, they (apparently) do not alter server
side
controls but do "clear" everything else.

Thanks.

Larry

Larry,

[quoted text clipped - 23 lines]

Larry

 

[Larry O via DotNetMonster.com]

Thanks! Will take a look at this...

Larry,

Change the form tag back to Form1.

I just noticed that it wasn't. I used a "Lab" project I fool around with all
the time when answering people's questions and I must have changed the
form's name at some point and not changed it back.

Larry,

[quoted text clipped - 86 lines]