By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
425,529 Members | 1,826 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 425,529 IT Pros & Developers. It's quick & easy.

Formatting: Focus in textarea: enter to submit form with serverside event trapping

P: n/a
Hi,

I have a problem with formatting a table including text fields wich can
contain up to 255 chars.

I need a table with 3 columns:
- First column 50 % over the with a rowspan of the total number of rows.
- Second column 25 %, no rowspan
- Third column 25 %, no rowspan

In the first column / cell contains a description. The next column a
caption, and the last column a edit field.

See http://www.winit.nl/sample/1.html
This shows the right layout (Using IE 6). If a text fields has the focus,
pressing enter will submit the form.

But when the text in the fields is to big, the layout is wrong (but still,
enter = submit)
See http://www.winit.nl/sample/2.html

To solve this problem, I replaced the input type=text with a textarea with
style overflow=hidden.
Only the enter key now gives a newline instead of a submit
See http://www.winit.nl/sample/3.html

The prevent newlines in the textarea i can use some client side scripting.
See http://www.winit.nl/sample/4.html

But how to submit the form using enter, and still be able to use the event
trapping of the submit button in the aspx page?
(Or how to use a input type = text resulting in the right layout)?

Perry
Nov 19 '05 #1
Share this Question
Share on Google+
10 Replies


P: n/a
Hey,

Instead of submit button put a button on the page and invoke form submit if
your layout is matched. You can still retain your textbox.
(e.g)
<input type=button onclick="test();">

<script>
function test()
{
if (condition)
document.form1.submit();
}
</script>
Hope this would solve your issue. Let me know if you need any other
clarification.

-Baskar BV-

"Perry van Kuppeveld" wrote:
Hi,

I have a problem with formatting a table including text fields wich can
contain up to 255 chars.

I need a table with 3 columns:
- First column 50 % over the with a rowspan of the total number of rows.
- Second column 25 %, no rowspan
- Third column 25 %, no rowspan

In the first column / cell contains a description. The next column a
caption, and the last column a edit field.

See http://www.winit.nl/sample/1.html
This shows the right layout (Using IE 6). If a text fields has the focus,
pressing enter will submit the form.

But when the text in the fields is to big, the layout is wrong (but still,
enter = submit)
See http://www.winit.nl/sample/2.html

To solve this problem, I replaced the input type=text with a textarea with
style overflow=hidden.
Only the enter key now gives a newline instead of a submit
See http://www.winit.nl/sample/3.html

The prevent newlines in the textarea i can use some client side scripting.
See http://www.winit.nl/sample/4.html

But how to submit the form using enter, and still be able to use the event
trapping of the submit button in the aspx page?
(Or how to use a input type = text resulting in the right layout)?

Perry

Nov 19 '05 #2

P: n/a
If i use a document.form1.submit(); i don't get the server side click event
in the aspx file. I need this event on the server.
Nov 19 '05 #3

P: n/a
To get around that, create a button that submits to the server (input
type=button runat=server id=btn)
And in the JavaScript submit that button btn.Submit(), which will trigger
its Post Back as well

HTH

"Perry van Kuppeveld" <no*****************@spam.com> wrote in message
news:%2****************@TK2MSFTNGP14.phx.gbl...
If i use a document.form1.submit(); i don't get the server side click
event in the aspx file. I need this event on the server.

Nov 19 '05 #4

P: n/a
I didnot get your question. Can you share the code which u have written?

-Baskar BV-

"Perry van Kuppeveld" wrote:
If i use a document.form1.submit(); i don't get the server side click event
in the aspx file. I need this event on the server.

Nov 19 '05 #5

P: n/a
I created a new C# webapp and placed the following code in webform class (In
design mode nothing is changed)
See the dif between pressing enter while the focus is in the textbox, or
clicking the submit button.

Code:
public class WebForm1 : System.Web.UI.Page
{
private void Page_Load(object sender, System.EventArgs e)
{
TextBox tb = new TextBox( );
tb.TextMode = TextBoxMode.MultiLine;
tb.Attributes["onkeypress"] = "if (event.keyCode == 13) {
document.forms[0].submit(); return false; }";
this.FindControl("form1").Controls.Add(tb);

Button b = new Button();
b.Text = "Submit";
b.Click +=new EventHandler(b_Click);
this.FindControl("form1").Controls.Add(b);
}

override protected void OnInit(EventArgs e)
{
InitializeComponent();
base.OnInit(e);
}

private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}

private void b_Click(object sender, EventArgs e)
{
Response.Write("Submit");
}
}
Nov 19 '05 #6

P: n/a
Hey,

try the code given below.
<script>
function test()
{
document.form1.button1.click();
}
</script>
<form method="post" name="form1" onsubmit="test();" runat=server>
<input type=text>
<input type=button onclick="button_click" runat=server>
</form>
the code will invoke client "test" function which then invokes button1 click
event. So if the user submits the form by pressing enter you could check for
the format validation and submit or not accordingly.

"Perry" wrote:
I created a new C# webapp and placed the following code in webform class (In
design mode nothing is changed)
See the dif between pressing enter while the focus is in the textbox, or
clicking the submit button.

Code:
public class WebForm1 : System.Web.UI.Page
{
private void Page_Load(object sender, System.EventArgs e)
{
TextBox tb = new TextBox( );
tb.TextMode = TextBoxMode.MultiLine;
tb.Attributes["onkeypress"] = "if (event.keyCode == 13) {
document.forms[0].submit(); return false; }";
this.FindControl("form1").Controls.Add(tb);

Button b = new Button();
b.Text = "Submit";
b.Click +=new EventHandler(b_Click);
this.FindControl("form1").Controls.Add(b);
}

override protected void OnInit(EventArgs e)
{
InitializeComponent();
base.OnInit(e);
}

private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}

private void b_Click(object sender, EventArgs e)
{
Response.Write("Submit");
}
}

Nov 19 '05 #7

P: n/a
I don't think this will work:

If i click the button script button_click will be executed, and that is not
available.

I will post a new question with the code provided in the previous post, so
it's back on the top.

Thanks anyway
"BASKAR BV" <BA******@discussions.microsoft.com> wrote in message
news:EC**********************************@microsof t.com...
Hey,

try the code given below.
<script>
function test()
{
document.form1.button1.click();
}
</script>
<form method="post" name="form1" onsubmit="test();" runat=server>
<input type=text>
<input type=button onclick="button_click" runat=server>
</form>
the code will invoke client "test" function which then invokes button1
click
event. So if the user submits the form by pressing enter you could check
for
the format validation and submit or not accordingly.

"Perry" wrote:
I created a new C# webapp and placed the following code in webform class
(In
design mode nothing is changed)
See the dif between pressing enter while the focus is in the textbox, or
clicking the submit button.

Code:
public class WebForm1 : System.Web.UI.Page
{
private void Page_Load(object sender, System.EventArgs e)
{
TextBox tb = new TextBox( );
tb.TextMode = TextBoxMode.MultiLine;
tb.Attributes["onkeypress"] = "if (event.keyCode == 13) {
document.forms[0].submit(); return false; }";
this.FindControl("form1").Controls.Add(tb);

Button b = new Button();
b.Text = "Submit";
b.Click +=new EventHandler(b_Click);
this.FindControl("form1").Controls.Add(b);
}

override protected void OnInit(EventArgs e)
{
InitializeComponent();
base.OnInit(e);
}

private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}

private void b_Click(object sender, EventArgs e)
{
Response.Write("Submit");
}
}

Nov 19 '05 #8

P: n/a
You need to write the button_click event for the button. You can do that by
double clicking the button in the design view. In that case, your code will
be like
<input type=button runat=server name="button1">. The click event will be
bound to the code behind.

-Baskar BV-
"Perry van Kuppeveld" wrote:
I don't think this will work:

If i click the button script button_click will be executed, and that is not
available.

I will post a new question with the code provided in the previous post, so
it's back on the top.

Thanks anyway
"BASKAR BV" <BA******@discussions.microsoft.com> wrote in message
news:EC**********************************@microsof t.com...
Hey,

try the code given below.
<script>
function test()
{
document.form1.button1.click();
}
</script>
<form method="post" name="form1" onsubmit="test();" runat=server>
<input type=text>
<input type=button onclick="button_click" runat=server>
</form>
the code will invoke client "test" function which then invokes button1
click
event. So if the user submits the form by pressing enter you could check
for
the format validation and submit or not accordingly.

"Perry" wrote:
I created a new C# webapp and placed the following code in webform class
(In
design mode nothing is changed)
See the dif between pressing enter while the focus is in the textbox, or
clicking the submit button.

Code:
public class WebForm1 : System.Web.UI.Page
{
private void Page_Load(object sender, System.EventArgs e)
{
TextBox tb = new TextBox( );
tb.TextMode = TextBoxMode.MultiLine;
tb.Attributes["onkeypress"] = "if (event.keyCode == 13) {
document.forms[0].submit(); return false; }";
this.FindControl("form1").Controls.Add(tb);

Button b = new Button();
b.Text = "Submit";
b.Click +=new EventHandler(b_Click);
this.FindControl("form1").Controls.Add(b);
}

override protected void OnInit(EventArgs e)
{
InitializeComponent();
base.OnInit(e);
}

private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}

private void b_Click(object sender, EventArgs e)
{
Response.Write("Submit");
}
}


Nov 19 '05 #9

P: n/a
Thanks, it's working

Perry


"BASKAR BV" <BA******@discussions.microsoft.com> wrote in message
news:37**********************************@microsof t.com...
You need to write the button_click event for the button. You can do that
by
double clicking the button in the design view. In that case, your code
will
be like
<input type=button runat=server name="button1">. The click event will be
bound to the code behind.

-Baskar BV-
"Perry van Kuppeveld" wrote:
I don't think this will work:

If i click the button script button_click will be executed, and that is
not
available.

I will post a new question with the code provided in the previous post,
so
it's back on the top.

Thanks anyway
"BASKAR BV" <BA******@discussions.microsoft.com> wrote in message
news:EC**********************************@microsof t.com...
> Hey,
>
> try the code given below.
> <script>
> function test()
> {
> document.form1.button1.click();
> }
> </script>
> <form method="post" name="form1" onsubmit="test();" runat=server>
> <input type=text>
> <input type=button onclick="button_click" runat=server>
> </form>
> the code will invoke client "test" function which then invokes button1
> click
> event. So if the user submits the form by pressing enter you could
> check
> for
> the format validation and submit or not accordingly.
>
> "Perry" wrote:
>
>> I created a new C# webapp and placed the following code in webform
>> class
>> (In
>> design mode nothing is changed)
>> See the dif between pressing enter while the focus is in the textbox,
>> or
>> clicking the submit button.
>>
>> Code:
>>
>>
>> public class WebForm1 : System.Web.UI.Page
>> {
>> private void Page_Load(object sender, System.EventArgs e)
>> {
>> TextBox tb = new TextBox( );
>> tb.TextMode = TextBoxMode.MultiLine;
>> tb.Attributes["onkeypress"] = "if (event.keyCode == 13) {
>> document.forms[0].submit(); return false; }";
>> this.FindControl("form1").Controls.Add(tb);
>>
>> Button b = new Button();
>> b.Text = "Submit";
>> b.Click +=new EventHandler(b_Click);
>> this.FindControl("form1").Controls.Add(b);
>> }
>>
>> override protected void OnInit(EventArgs e)
>> {
>> InitializeComponent();
>> base.OnInit(e);
>> }
>>
>> private void InitializeComponent()
>> {
>> this.Load += new System.EventHandler(this.Page_Load);
>> }
>>
>> private void b_Click(object sender, EventArgs e)
>> {
>> Response.Write("Submit");
>> }
>> }
>>
>>
>>


Nov 19 '05 #10

P: n/a
Hey, that was my suggestion!!

Haha, just kdding, nice you go it working
"Perry van Kuppeveld" <no*****************@spam.com> wrote in message
news:uN**************@TK2MSFTNGP12.phx.gbl...
Thanks, it's working

Perry


"BASKAR BV" <BA******@discussions.microsoft.com> wrote in message
news:37**********************************@microsof t.com...
You need to write the button_click event for the button. You can do that
by
double clicking the button in the design view. In that case, your code
will
be like
<input type=button runat=server name="button1">. The click event will be
bound to the code behind.

-Baskar BV-
"Perry van Kuppeveld" wrote:
I don't think this will work:

If i click the button script button_click will be executed, and that is
not
available.

I will post a new question with the code provided in the previous post,
so
it's back on the top.

Thanks anyway
"BASKAR BV" <BA******@discussions.microsoft.com> wrote in message
news:EC**********************************@microsof t.com...
> Hey,
>
> try the code given below.
> <script>
> function test()
> {
> document.form1.button1.click();
> }
> </script>
> <form method="post" name="form1" onsubmit="test();" runat=server>
> <input type=text>
> <input type=button onclick="button_click" runat=server>
> </form>
> the code will invoke client "test" function which then invokes button1
> click
> event. So if the user submits the form by pressing enter you could
> check
> for
> the format validation and submit or not accordingly.
>
> "Perry" wrote:
>
>> I created a new C# webapp and placed the following code in webform
>> class
>> (In
>> design mode nothing is changed)
>> See the dif between pressing enter while the focus is in the textbox,
>> or
>> clicking the submit button.
>>
>> Code:
>>
>>
>> public class WebForm1 : System.Web.UI.Page
>> {
>> private void Page_Load(object sender, System.EventArgs e)
>> {
>> TextBox tb = new TextBox( );
>> tb.TextMode = TextBoxMode.MultiLine;
>> tb.Attributes["onkeypress"] = "if (event.keyCode == 13) {
>> document.forms[0].submit(); return false; }";
>> this.FindControl("form1").Controls.Add(tb);
>>
>> Button b = new Button();
>> b.Text = "Submit";
>> b.Click +=new EventHandler(b_Click);
>> this.FindControl("form1").Controls.Add(b);
>> }
>>
>> override protected void OnInit(EventArgs e)
>> {
>> InitializeComponent();
>> base.OnInit(e);
>> }
>>
>> private void InitializeComponent()
>> {
>> this.Load += new System.EventHandler(this.Page_Load);
>> }
>>
>> private void b_Click(object sender, EventArgs e)
>> {
>> Response.Write("Submit");
>> }
>> }
>>
>>
>>


Nov 19 '05 #11

This discussion thread is closed

Replies have been disabled for this discussion.