HTML field population

Discussion in 'HTML & Website Design' started by CarlBlogger, Mar 27, 2014.

0
  1. #1
    Hello,

    I'm wondering how I create the following.

    E.g.

    I have

    Name:
    Textbox 1

    Address:
    Textbox 2

    When the user inputs information in the text boxes and clicks submit it populates on a different web page when you click submit so it lists on the data on a new page.
     
    CarlBlogger, Mar 27, 2014 IP
  2. andymark

    andymark Greenhorn

    Messages:
    17
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #2
    <html>
    <head>
    <body>
    <table>
    <tr>
    <td>Name:</td>
    <td><input type="text" /></td>

    <textarea></textarea>
    <td><input type="text" /> </td>

    </tr>
    </table>
    </body>
    </head>
    </html>
     
    andymark, Mar 28, 2014 IP
  3. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #3
    First off, when you make a form in HTML you need something server-side to handle the data from the form to turn it into more HTML. Typically people use languages like PHP, Perl, ASP, JSP and so forth to do this. (I suggest PHP as it's available everywhere and well documented).

    Second, ignore what @andymark just posted. News flash, 1997 called, wants it's buggy broken non-semantic markup with tables for layout back.

    Basing off the original post, and assuming you didn't actually MEAN 'text area' since the textarea tag is a multi-line input I would first start off with a properly built semantic and COMPLETE form; not some halfwit incomplete inaccessible table BS. That means a fieldset around our fields, labels with FOR attributes pointing at ID's on the INPUTs.

    testForm.html:
    <form action="test.php" method="post" id="testForm">
	<fieldset>
		<label for="testForm_name">Name:</label>
		<input type="text" id="testForm_name" name="name" />
		<br />
		<label for="testForm_address">Address:</label>
		<input type="text" id="testForm_address" name="address" />
		<br />
		<input type="submit" value="Submit" />
	</fieldset>
</form>
    Code (markup):
    A sample PHP file to handle the response might look something like this:

    test.php
    <?php
	if (
		empty($_POST['name']) ||
		empty($_POST['address'])
	) {
		echo '
			<p>
				Error - Form incomplete!
			<p>';
		// you might want to reshow the form here!
	} else {
		echo '
			Name : ', htmlspecialchars($_POST['name']), '<br />
			Address : ', htmlspecialchars($_POST['address']), '<br />';
	}
?>
    Code (markup):
    htmlspecialchars makes sure that the user can't enter code and have it run -- all user input should always treated as untrustworthy/suspect. Likewise why we test if those object properties are empty or not first. Error handling should be treated as a must-have too!
     
    Last edited: Mar 28, 2014
    deathshadow, Mar 28, 2014 IP
    CarlBlogger likes this.