WebDeveloper.com �: Where Web Developers and Designers Learn How to Build Web Sites, Program in Java and JavaScript, and More!   
Web Developer Resource Directory WebDev Jobs
Animated GIFs
CSS Properties
HTML 4.01 Tags
Site Management
WD Forums

    Web Video
    Expression Web



    Forum, Blog, Wiki & CMS

 Site Management
    Domain Names
    Search Engines
    Website Reviews

 Web Development
  Business Issues

    Business Matters

    The Coffee Lounge
    Computer Issues

DR. WEBSITE: Submitting Forms Using Enter Key; How To Rotate Text

By David Fiedler and Scott Clark

Dear Dr. Website®: I've organized form fields neatly in a table, and now I would like to be able to use the Enter key to submit the form. How can I do that?

In order for a form to be submitted when the Enter key is pressed, the form must contain only one entry field. If there is more than one entry field (text, radio button, select, etc.), then the submit() event must be called, either by the standard method--clicking on the submit button--or through calling it by JavaScript's onClick, OnFocus, onChange, and onBlur events, as is done in this example with two radio buttons:

 <head> <script language="JavaScript"> var msg ="I'm using JavaScript to create a confirmation message. Please tell me that's okay!"; function confirmit(){ if(confirm(msg)==true){document.newsubmit.submit();} else alert('Sorry, you can\'t play with us and have to leave right now!'); } </script> <title></title> </head> <body> <form method="post" action="http://www.yourdomain.com/cgi-bin/doit.cgi" name="newsubmit"> <input type=text name="save" size=35> <B>Name for File</b><br> <input type=file name="uploadf" size=35 ><br> <input type=radio onClick="confirmit();return false" name="doit"> Submit It Right Now! <input type=radio onClick="alert('okay, we didn\'t want it anyway!')" name="doit"> I'd rather not! </form> 
The above example depicts a form which is submitted using a radio button. The radio button's onClick event calls the confirmit() function, which in turn submits the form.

This way, when a user has filled in the form and tabs to the first radio button, he can then use the spacebar to submit the form. This would allow him to keep his hands on the keyboard rather than having to use the mouse to click on a submit button.

This code also contains a confirmation/rejection message that pops up when the user tries to submit the form, by using JavaScript confirm() and alert() methods within the confirmit() function.

This can come in handy when you want to verify your users have read a release statement, or remind them of some fact, or address additional issues before proceeding.

Text-Rotation Tips

Dear Dr. Website®:

How can I display rotated text in a browser? I want to create a table and put text rotated 90 degrees in a column. Any ideas?

There are many things that HTML lets you do with text, but rotating it isn't yet one of them. It does seem like a logical thing to do in many cases, especially where tables are concerned, though. The amount of space on a Web page is fairly limited, so rotating a long description can make your table look neater.

The easiest way to rotate text on a Web page is simply to create your text in a graphics program, style and size it to match your Web page, rotate as necessary, and save it (as a transparent GIF if necessary) so that the background will blend in with your page.

The GIF format is most efficient for this sort of artwork, in any case. Then, just take the finished GIF file and work it into your table in the correct spot.


Webdeveloper.com's home page

Back to Home Page

Keywords: html
Date: 19970929

HTML5 Development Center

Recent Articles