Kompx.com or Compmiscellanea.com

JavaScript form submit

Windows : Internet Explorer 4.01+, Firefox 1.0+, Google Chrome, Opera 3.0+, Safari 3.1+, SeaMonkey 1.0+ [ 1 ].

Linux : Firefox 1.0+, Google Chrome / Chromium, Opera 5.0+, SeaMonkey 1.0+ [ 2 ].

Submitting a form using JavaScript. A dropdown list (form + select + multiple options) is processed without any submit button. Example:

HTML / XHTML. Code:

<form action="action.php" method="post">

<select name="page" required="required" onchange="this.form.submit()">

<option value="" selected="selected" disabled="disabled"> --- Select a page --- </option>

<option value="http://www.kompx.com/en/os/linux-1.htm">Linux</option>

<option value="http://www.kompx.com/en/os/windows-1.htm">Windows</option>

<option value="http://www.kompx.com/en/os/dos-1.htm">DOS</option>

</select>

<noscript><input type="submit" value="Submit" /></noscript>

</form>

When an option has been chosen from the dropdown list, the form's state is changed. So the onchange event occurs and JavaScript code in onchange is executed: the process of the form submission in started by the script, not by clicking submit button which is absent.

Some server-side script [ 3 ] is meant then to handle the form action. The script is supposed to get what the form sends and have it processed. A PHP script in action.php is used in the example:

<?php

if (isset($_POST["page"])) {

    header("Location: $_POST[page]");

    exit;

} else {

    echo "No options selected";

}

$_POST is an array of variables passed to the current script via the HTTP POST method. So $_POST[page] contains the content of the value attribute in a select option. That is, a URL. It is passed from form to PHP script and the script redirects browser to the URL / page selected.

HTML code of <noscript><input type="submit" value="Submit" /></noscript> is present in the form as a fallback in case JavaScript happens to be turned off. Then there is a submit button to appear and the form is usable anyway.


[ 1 ]

As well as Netscape 3.04+, Mozilla 0.6+.

[ 2 ]

As well as Netscape 3.04+, Mozilla 0.6+.

[ 3 ]

If a CMS is used, form action may be handled by some of its inbuilt means.


Aliosque subditos et thema

 

Renaming folders in DOS

 

Renaming a folder in DOS by MOVE command: MOVE FOLDER1 FOLDER2 - Renames FOLDER1 into FOLDER2 The method works in Windows command prompt as well. [ 1 ] MS-DOS 6.0+ tested - but it also may happen to work well under other versions of MS-DOS or other DOS'es.

CSS centering floated elements

 

Centering an inline block containing several inline elements. The block is centered horizontally - [ Open demo page ]. Sometimes there is a need to have a centered group of floated elements, which is to serve as a title or a pagination box. Since this group of floated elements is going to be used as a title for content blocks of various dimensions or pagination box may grow or shrink in its size, then the width of the group of floated elements is to vary unpredictably as well. So a method of centering based on using a certain known width of the box is not going to work. And as an extra to the task there is a desirable condition: the title or pagination box has to be centered once and for all at the time of the box creation, so that this group of floated elements may be reused without any extra work over it: just place the complex where you need it and put the text or / and images you want to inside it - the group is centered anyway. This problem can be solved by several methods using several technologies: CSS, CSS + JavaScript, CSS + HTML (<table></table> tags system). The CSS centering floated elements is the most simple and reliable. So, here a pure CSS centering of floated elements is discussed. CSS centering floated elements: 1. First, a more simple case, css centering of a title box consisting of floated elements: images and text: HTML / XHTML. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>CSS centering floated elements: 1</title> <meta http-equiv="Content-Type" content="text/html; charset=Windows-1252" /> <link rel="stylesheet" type="text/css" href="css.css" /> </head> <body> <div class="box"> <span class="title-box"> <img src="snowflake.gif" width="37" height="34" alt="" class="title-imgs" /> <span class="title-text">CSS centering floated elements</span> <img src="snowflake.gif" width="37" height="34" alt="" class="title-imgs" /> </span> </div> </body> </html> CSS.