HTML form post examples. HTML Forms

HTML form post examples. HTML Forms

21.03.2022

HTML tags that define HTML forms on the site

We create websites and individual pages on the Internet to communicate with visitors.

HTML forms are used to register visitors on the site, for interactive polls and voting, allow you to send messages, make purchases, and so on. HTML The form is created for one purpose: collecting and then transferring information for processing to a program script or by e-mail.

Sample HTML form | Enter the site

Tags, attributes and values

  • - determine the form.
  • name="" - defines the name of the form.
  • method="" - determines how the data is sent from the form. Values: "get" (default) and "post" . The "post" method is more commonly used, as it allows you to transfer large amounts of data.
  • action="" - determines the url by which the data is sent for processing. In our case - enter_data.php ..
  • - define such form elements as buttons, switches, text fields for data entry.
  • type="text" - defines a text field for data entry.
  • type="password" - defines a field for entering a password, while the text is displayed as asterisks or circles.
  • type="checkbox" - defines a radio button.
  • type="hidden" - defines a hidden form element - used to pass additional information to the server.
  • size="25" - length of the text field in characters.
  • maxlength="30" - the maximum allowed number of input characters.
  • value="" - defines the value that will be sent for processing if it refers to radio buttons or radio buttons. The value of this attribute as part of a text field or button will be shown as, for example, John or Login in the example above.

Sample HTML form | Comments on the site

HTML form example




Name



Mail








Tags, attributes and values

  • action="http://site/comments.php" - determines the url to which the data from the form will be sent.
  • id="" - defines the name, identifier of the form element.
  • name="" - defines the name of the form element.
  • - define a text field in the form.
  • cols="" - determines the number of columns of the form text field.
  • rows="" - Specifies the number of rows for the form text field.

If between put text, it will be shown inside the box as an example that is easy to remove.

Sample HTML form | Drop-down list

HTML forms




Tags, attributes and values

  • - define a list with items to choose from.
  • size="" - determines the number of visible list positions. If the value is 1 , we are dealing with a dropdown list.
  • - define positions (points) of the list.
  • value="" - contains the value that will be sent by the form to the specified url for processing.
  • selected="selected" - selects the list item as an example.

Sample HTML form | List with scroll bar

By increasing the value of the size="" attribute, we get a list with a scrollbar:

First position Second position Third position Fourth position

HTML forms




For this option, we use the multiple="multiple" flag, which makes it possible to select multiple items. Its absence allows you to select only one item.

  • type="submit" - defines a button.
  • type="reset" - defines a reset button.
  • value="" - defines the label on the button.
  • See additionally:

    Description

    Tag

    sets up a form on a web page. The form is intended for data exchange between the user and the server. The scope of forms is not limited to sending data to the server; using client scripts, you can access any element of the form, modify it and apply it at your discretion.

    A document can contain any number of forms, but only one form can be sent to the server at a time. For this reason, form data must be independent of each other.

    To submit the form to the server, the Submit button is used, the same can be achieved by pressing the Enter key within the form. If the Submit button is not present on the form, the Enter key simulates its use.

    When the form is submitted to the server, control of the data is transferred to the program specified by the tag's action attribute . Beforehand, the browser prepares information in the form of a “name=value” pair, where the name is determined by the name attribute of the tag , and the value is entered by the user or set in the default form field. If the GET method is used to send data, then the address bar can take the following form.

    http://www..cgi?nick=%C2%E0%ED%FF+%D8%E0%EF%EE%F7%EA%E8%ED&page=5

    The options are listed after the question mark after the address of the CGI program and are separated by an ampersand (&). Non-Latin characters are converted to their hexadecimal representation (in the form %HH, where HH is the hexadecimal code for the value of the ASCII character), and the space is replaced with a plus (+).

    Allowed inside the container put other tags, while the form itself is not displayed in any way on the web page, only its elements and the results of nested tags are visible.

    Syntax

    ...

    Attributes

    Sets the encoding in which the server can receive and process data. The address of the program or document that processes the form data. Enables autocomplete form fields. How the form data is encoded. HTTP protocol method. The name of the form. Cancels the built-in validation of form data for valid input. The name of the window or frame where the handler will load the returned result.

    Closing tag

    Required.

    HTML5 IE Cr Op Sa Fx

    FORM tag

    What do you think the abbreviation "OS" stands for?

    Officers
    Operating system
    Large striped flies

    The result of this example is shown in Fig. one.

    Rice. 1. View of form elements in the browser window

    Often on Web sites you can find pages with HTML forms placed on them. Web forms are a convenient way to get information from your website visitors. An example of this is -, - which provides feedback to visitors and site developers. Forms are also convenient for site developers when developing a CMS, which allows you to maintain the main property of the site - relevance. This article covers the basics of creating HTML forms, their processing, and how to pass data from on-screen forms to PHP scripts.

    1) Creating a simple form

    tags

    And
    set the beginning and end of the form. Form start tag
    contains two attributes: action And method. The action attribute contains the URL of the script that should be called to process the script. Attribute method tells the browser what kind of HTTP request to use to submit the form; possible values POST And GET.

    Comment

    The main difference between the POST and GET methods is the way information is transferred. In the GET method, parameters are passed through the address bar, i.e. in fact, in the HTTP header of the request, while in the POST method, the parameters are passed through the body of the HTTP request and are not reflected in any way in the form of the address bar.

    $text = nl2br($_POST["mytext"]);
    ?>

    A task: Let's say we want to create a dropdown list with years from 2000 to 2050.
    Solution: It is necessary to create an HTML form with a SELECT element and a PHP script for processing the form.

    Discussion:

    Let's start by creating two files: form.html And action.php. In file form.html will contain an html form with a drop down list. Moreover, the values ​​in the list can be specified in two ways:

    I. Manual data entry:

    II. Entering data through a loop:

    As you can see, the second example with a loop is more compact. I don't think it's worth giving the form handler script, because it's processed just like a text field, ie. list values ​​can be retrieved from a superglobal array $_POST.

    Description:

    Let's create an HTML form to send a file to the server.




    This html form has an element browse, which opens a dialog box for selecting a file to upload to the server. By pressing the button "Transfer file", the file is passed to the handler script.

    Then you need to write a script handler action.php. Before writing the handler, you need to decide in which directory we will copy the file:

    if(isset($_FILES [ "myfile" ])) // If the file exists
    {
    $catalog = "../image/" ; // Our directory
    if (is_dir ($catalog )) // If there is such a directory
    {
    $myfile = $_FILES [ "myfile" ][ "tmp_name" ]; // Temp file
    $myfile_name = $_FILES [ "myfile" ][ "name" ]; // File name
    if(! copy ($myfile , $catalog )) echo "Error copying file". $myfile_name // If the file copy failed
    }
    else mkdir("../image/"); // If there is no such directory, we will create it
    }
    ?>

    Comment

    If you trust users to upload any files to your server, you need to be extremely careful. Attackers can inject “bad” code into an image or file and send it to the server. In such cases, you need to tightly control the download of files.

    This example demonstrates creating a directory and copying a file to that directory on the server.

    I would also like to demonstrate an example with an element checkbox. This element is slightly different from other elements in that if not one of the elements checkbox'a is not selected, then a superglobal variable $_POST will return an empty value:


    Blue
    The black
    White

    if (!empty($_POST [ "mycolor" ])) echo $_POST [ "mycolor" ]; // If at least 1 item is selected
    echo "Select value";
    ?>

    HTML forms are complex interface elements. They include different functional elements: input fields And