Carriage Return and Button clicking events

Source: Internet
Author: User
Introduction

A typical data input page usually consists of multiple form areas used to collect user input and a submit button. To create such a page, you need to add some appropriate Web controls on the ASP. NET page-some textbox and checkboxlist, and perhaps a button control. After the user interface is complete, the project also needs to create an event processing process to process the button click event, and add the code to run... Maybe you want to store the data in the database or send the information to someone by email.

When entering such a page, you probably experienced the following: when you enter the textbox, click the Enter key, and the page will be submitted. This is a function provided by the browser. You do not need to move the mouse to submit the page. For example, if you access Google, the input focus is immediately located in the search box. After you enter the query content, you can click the Enter key to view the results.

Although some ASP. NET developers believe that when an ASP. NET page is clicked and the page is submitted, the Click Event of the page button control is triggered. Sometimes this is not the case. In this short article, we will see when the user clicks the Enter key to submit the page, the Click Event of the button control will not be triggered, and we will look at the actual situation. You will learn more.


Origin of the Enter key submission page

(If an irrelevant section is omitted in the middle ...)

When a page contains multiple submit buttons, the Return key is used to submit the page with a potential problem. In this case, when the Enter key is clicked, which button should be associated with the page submission? In my experience, the browser will use the first button in the HTML Tag. Use the Enter key to submit the click events of the page and button controlWhen the Enter key is clicked on the ASP. NET page with multiple single-row textbox controls, the page is submitted and the click event of the first button control displayed on the HTML page is fired. This is what we expected. However, some strange things happen on Internet Explorer. If the page contains only one single row Textbox, the button control event will not be triggered! The page is submitted, but the click event is not processed-this is where you use the logic code to process user input-it is not executed. Why? The key to the problem is how to submit the form control in Internet Explorer after you click the Enter key on a single-line textbox page. Specifically, Internet Explorer does not include the name and value of the submit button in the submitted content. Since the name and value of the button are not submitted back to the server, the ASP. NET Server cannot determine what caused the submission, so the Click Event of the corresponding button control cannot be triggered. To better understand this problem, let's assume that we have a page that contains many single-line textbox names from textbox1 to textboxn and a button called btnsubmit, the value of the button is click me! (The value of a button is the text displayed on the button ). When a user fills out the page and clicks enter in a Textbox, the page is submitted and sent back to the following string (included in the submitted content ): textbox1 = value1 & textbox2 = value2 & textboxn = valuen & btnsubmit = click me! Value1... Valuen is the content input to textbox1 to textboxn. After the ASP. NET page is submitted, it analyzes this string to know that this submission is caused by the btnsubmit button control. It will trigger the Click Event of the web control, and your event processing code can be executed. If you only have a single line of text input box, the strings contained in the submitted content will ignore btnsubmit = click me !. That is to say, if you only include a single row input box called textbox1, you will get the following submitted content:

Textbox1 = value1

There is no information about which button triggers this submission. The ASP. NET Server Side cannot correctly trigger the Click Event of the button. Therefore, when internetexplorer is used, clicking enter will not trigger the Click Event of the button control-other browsers, such as firebox, always submit the button values and names, even if there is only one text input box.Provide an example

If a page on your website contains a single Textbox Control, users using Internet Explorer cannot press enter in the textbox to get the appropriate effect. That is to say, they will be submitted when they click the Enter key page, but no matter what code you write during the click event processing of the button, it will not be executed. Therefore, it seems that nothing has happened to the user. To overcome this problem, you can use the following method-simply add another Textbox Control to the page. This will allow Internet Explorer to send back the value and name of the button control when you click the Enter key. Of course, you don't want users to see two Textbox, so use a little CSS to hide the second textbox. That is to say, if the original code is as follows:

<Form runat = "server">
Name: <asp: textbox runat = "server" id = "txtname"/>
<Br/>
<Asp: button runat = "server" text = "Click me! "/>
</Form> Add another Textbox Control to solve the Enter key problem in IE, but hide the second textbox. Your user will only see one: <form runat = "server">
Name: <asp: textbox runat = "server" id = "txtname"/>
<Br/>
<Asp: textbox runat = "server" style = "visibility: hidden; display: none;"/>
<Asp: button runat = "server" text = "Click me! "/>
</Form>
So far! Conclusion

In this article, we have analyzed that using some browsers, in some cases, clicking the Enter key may lead to page submission but will not trigger the Click Event of the button control. Without creating a page containing a single Textbox Control, you can easily solve this limitation. More appropriately, if you only need a textbox in some cases, add a "man-made" textbox-A textbox that is only used to solve this problem. As discussed above, you can use a little bit of CSS to hide these "man-made" textbox. In addition, you can use JavaScript to disable or ensure that the return key is used to submit the page. You must read the following article: Form submission and enter key? Using JavaScript to prevent or trigger form submission when enter is hit FAQs relating to 'pressing enter key for form submission'

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.