en:web_development:forms:inputs
Differences
This shows you the differences between two versions of the page.
| Next revision | Previous revision | ||
|
en:web_development:forms:inputs [2022/01/17 14:34] mag created |
en:web_development:forms:inputs [2023/08/16 09:33] (current) |
||
|---|---|---|---|
| Line 41: | Line 41: | ||
| * The < | * The < | ||
| * Set < | * Set < | ||
| - | < | + | < |
| * Move the existing paragraph inside the < | * Move the existing paragraph inside the < | ||
| * Now add our hero options as ' | * Now add our hero options as ' | ||
| Line 51: | Line 51: | ||
| * Save and upload the file, then open the page. | * Save and upload the file, then open the page. | ||
| * Click on your chosen hero then check the results. Do you see your hero's name? | * Click on your chosen hero then check the results. Do you see your hero's name? | ||
| - | * This is an usual way to use a Submit button, but it's valid. Let's look at other options. | + | * This is an unusual |
| ==== Text Input ==== | ==== Text Input ==== | ||
| * Let's create a form to add heroes to our database. | * Let's create a form to add heroes to our database. | ||
| - | * We'll need input fields for the name, whether they' | + | * We'll need input fields for the hero alias, (secret) identity, whether they' |
| * We could use a table to present our form with labels on the left and inputs on the right, but that isn't responsive, that is, it won't adapt to smaller screens. | * We could use a table to present our form with labels on the left and inputs on the right, but that isn't responsive, that is, it won't adapt to smaller screens. | ||
| * Instead, we'll use a list, where each label / input pair is a list item. | * Instead, we'll use a list, where each label / input pair is a list item. | ||
| Line 63: | Line 63: | ||
| </li> | </li> | ||
| </ | </ | ||
| - | * The first field for the hero' | + | * The fields |
| < | < | ||
| - | < | + | < |
| - | <input type=" | + | <input type=" |
| + | </ | ||
| + | < | ||
| + | < | ||
| + | <input type=" | ||
| </ | </ | ||
| * Here we have a label for our input, using the < | * Here we have a label for our input, using the < | ||
| Line 106: | Line 110: | ||
| ==== Dropdown Boxes ==== | ==== Dropdown Boxes ==== | ||
| * Our next field is the source of the hero's power. This is a type of category, where we want to control the options that can be selected. | * Our next field is the source of the hero's power. This is a type of category, where we want to control the options that can be selected. | ||
| - | * For this we use a < | + | * For this we use a < |
| * Copy the following code into your form. | * Copy the following code into your form. | ||
| < | < | ||
| Line 118: | Line 122: | ||
| </ | </ | ||
| </ | </ | ||
| - | * We have a number of options listed using < | + | * We have a number of options listed using < |
| * Rather than setting the < | * Rather than setting the < | ||
| * The value sent to ' | * The value sent to ' | ||
| Line 164: | Line 168: | ||
| while($row = $rslt-> | while($row = $rslt-> | ||
| ?> | ?> | ||
| - | <option value="<? | + | <option value="<? |
| <?php | <?php | ||
| } | } | ||
| Line 192: | Line 196: | ||
| * You should recognise most of this code as it is the same as the code above with a few modifications. < | * You should recognise most of this code as it is the same as the code above with a few modifications. < | ||
| * Now, let's add the checkbox | * Now, let's add the checkbox | ||
| - | < | + | < |
| * Note that the checkbox input is very similar to a radio input. It has a name and a value and some text to be displayed. | * Note that the checkbox input is very similar to a radio input. It has a name and a value and some text to be displayed. | ||
| * The name is slightly different. The name ' | * The name is slightly different. The name ' | ||
| Line 214: | Line 218: | ||
| * Now let's place this in our query in ' | * Now let's place this in our query in ' | ||
| < | < | ||
| - | $query = " | + | $query = " |
| $args = array(); | $args = array(); | ||
| $mrslt = $pdo-> | $mrslt = $pdo-> | ||
| Line 225: | Line 229: | ||
| * We need a line where the user can add another movie. | * We need a line where the user can add another movie. | ||
| * Add this code after the loop (but before the < | * Add this code after the loop (but before the < | ||
| - | < | + | < |
| ==== Multiple Parameters ==== | ==== Multiple Parameters ==== | ||
en/web_development/forms/inputs.1642458883.txt.gz · Last modified: 2023/08/16 09:33 (external edit)
Page Tools
Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
