dcsimg
www.webdeveloper.com
Results 1 to 7 of 7

Thread: HTML Form with action.php looking for output to wrap

  1. #1
    Join Date
    Dec 2013
    Posts
    3

    HTML Form with action.php looking for output to wrap

    Hi Folks,

    I am trying to create an HTML form (job application) that will POST through an action.php. My output comes out looking ok except if my message (response to questions) is long it scrolls right off the page. I have tried putting "\r\n" or word-wrap but it doesn't matter. Anyone have an idea how I should do this? Or should I have it output to email?

    Code attached below

    Thanks

    HTML Code:
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Application</title>
    <link href="css/style.css" rel="stylesheet" type="text/css">
    
    </head>
    
    <body>
       <div class="container">
       <div class="header">
        <!-- end .header -->
       </div>
       
       <div class="content">
        <h1 class="h1">Employment Application</h1>
        <p>Thanks for your interest in our company. Please fill out the form below and select Submit. 
           <span class="required">Fields with an asterisk (*) are required.</span> </p>
        <hr>
        
    <form id="employeeApp" name="employeeApp" method="post" action="action2.php">    
       <fieldset>
           <legend>Contact Information</legend>
          
           <span class="required">*</span> 
             <label for="fname">First Name:</label>
             <input name="fname" type="text" id="name" size="30" maxlength="50">
        <br />
           <span class="required">*</span> 
             <label for="lname">Last Name:</label>
             <input name="lname" type="text" id="name" size="30" maxlength="50">
        <br />
           <span class="required">*</span> 
             <label for="address">Address:</label>
             <input name="address" type="text" id="name" size="30" maxlength="50">
        <br />
           <span class="required">*</span>
             <label for="city">City:</label>
             <input name="city" type="text" id="name" size="30" maxlength="50">
        <br />
           <span class="required">*</span>
             <label for="state">State:</label>
             <input name="state" type="text" id="name" size="5" maxlength="5">
        <br />
           <span class="required">*</span>
             <label for="zip">Zip:</label>
             <input name="zip" type="text" id="name" size="9" maxlength="10">
        <br />
           <span class="required">*</span>
             <label for="phone">Phone:</label>
             <input name="phone" type="text" id="name" size="15" maxlength="50">
        <br />
           <span class="required">*</span>
             <label for="email">Email:</label>
             <input name="email" type="text" id="name" size="30" maxlength="50">
       
        </fieldset>
        
        <fieldset>
           <legend>Questions</legend>
        <p>Question 1<br>
            <textarea name="message" cols="75" rows="4" class="content"></textarea>
        </p>
        
        <p>Question 2 <br>
            <textarea name="message2" cols="75" rows="4" class="content"></textarea>
        </p>
        <p>Question 3 <br>
            <textarea name="message3" cols="75" rows="4" class="content"></textarea>
        </p>
        
        <input type="submit" name="Submit" id="submit" value="Submit" />
        
        </p>
        </fieldset>
    </form>
    
    <!-- end .content --></div>
      <div class="footer">
        <p>Copyright &copy; 2013  </p>
        <!-- end .footer --></div>
      <!-- end .container --></div>
    </body>
    </html>
    PHP Code:

    //default fields to be printed from the form

    echo "<h2>Application Information</h2>";
    echo 
    "<h3>Contact Information</h3>";
    echo 
    "<strong>First Name: </strong> " $_POST['fname']. "<br />"
    echo 
    "<strong>Last Name: </strong> " $_POST['lname']. "<br />";
    echo 
    "<strong>Address: </strong> " $_POST['address']. "<br />";
    echo 
    "<strong>City: </strong> " $_POST['city']. "<br />";
    echo 
    "<strong>State: </strong> " $_POST['state']. "<br />";
    echo 
    "<strong>Zip: </strong> " $_POST['zip']. "<br />";
    echo 
    "<strong>Phone: </strong> " $_POST['phone']. "<br />";
    echo 
    "<strong>Email: </strong> " $_POST['email']. "<br />";

    echo 
    "<h3>Response to Questions</h3>";

    echo 
    "<strong>Question 1: </strong>" $_POST["message"]."\r\n <br />";
    echo 
    "<strong>Question 2: </strong>" $_POST["message2"]."\n <br />";
    echo 
    "<strong>Question 3: </strong>" $_POST['message3']. " <br />";


     
    ?> 

  2. #2
    Join Date
    Jul 2013
    Location
    Voorheesville NY USA
    Posts
    1,001
    You used div tags quite freely (too!) in your input area. Why not use them for your output? Create an id in your css section and define the position and size(height/width) and then place your echo in a div with that id

    PHP Code:
    <head>
    <
    style type='text/css'>
    #ans_box
    {
       
    position:relative;
       
    float:left;
       
    margin-left:1%;
       
    width:40%;
       
    padding:10px;
       
    border:1px solid black;
    }
    </
    style>
    </
    head
    And then in the body of your output page put:

    PHP Code:
    <div id="ans_box">
    echo 
    "<strong>Question 1: </strong>" $_POST["message"]."\r\n <br />"
    echo 
    "<strong>Question 2: </strong>" $_POST["message2"]."\n <br />"
    echo 
    "<strong>Question 3: </strong>" $_POST['message3']. " <br />"
    </
    div
    Voila!

  3. #3
    Join Date
    Dec 2013
    Posts
    3
    I have attempted to follow the above in several different ways and keep getting Syntax error on the line that has <div id="ans_box">.

    I have put the #ans_box into my css, added it to the action.php, etc. but nothing seems to work. Can someone help please? I have attached my latest code.

    <HTML>
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>FoodLogiQ Code Challenge responses</title>
    <style type='text/css'>
    #ans_box
    {
    position:relative;
    float:left;
    margin-left:1%;
    width:40%;
    padding:10px;
    border:1px solid black;
    }

    </head>

    <body>

    <?php
    //default fields to be printed from the FooodLogiQ form


    echo "<h2>FoodLogiQ Employee Application Information</h2>";
    echo "<h3>Contact Information</h3>";
    echo "<strong>First Name: </strong> " . $_POST['fname']. "<br />";
    echo "<strong>Last Name: </strong> " . $_POST['lname']. "<br />";
    echo "<strong>Address: </strong> " . $_POST['address']. "<br />";
    echo "<strong>City: </strong> " . $_POST['city']. "<br />";
    echo "<strong>State: </strong> " . $_POST['state']. "<br />";
    echo "<strong>Zip: </strong> " . $_POST['zip']. "<br />";
    echo "<strong>Phone: </strong> " . $_POST['phone']. "<br />";
    echo "<strong>Email: </strong> " . $_POST['email']. "<br />";



    echo "<h3>Response to Questions</h3>";
    <div id="ans_box">

    echo "<strong>Question 1: </strong>" . $_POST["message"]."\r\n <br />";
    echo "<strong>Question 2: </strong>" . $_POST["message2"]."\n <br />";
    echo "<strong>Question 3: </strong>" . $_POST["message3"]. " <br />";

    </div>

    ?>

    </body>
    </div>
    </html>
    </HTML>

  4. #4
    Join Date
    Jul 2013
    Location
    Voorheesville NY USA
    Posts
    1,001
    You need to learn how to write HTML, CSS and then learn PHP.

    1 - you didn't close your <style> tag.
    2 - Since you insist on mixing your html and php code, you have to be very careful about closing your php tags when you aren't writing php.

  5. #5
    Join Date
    Dec 2013
    Posts
    3
    I have seen the PHP code written several ways, one where it was by itself and two where it was included within HTML and three where CSS was included within the HTML & PHP. I was attempting to go with the first example you posted and it didn't work, it might have been clearer if you said to separate all of the codes.

    <b>I was able to get the following code to work.</b>

    PHP Code:
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>responses</title>
    <link href="css/style.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    #ans_box {
        position:relative;
        float:left;
        margin-left:10%;
        width:60%;
        padding:15px;
        background-color: #f0f2ed;
    }
    </style>
    </head>

    <body>

    <?php
    //default fields to be printed from the form
    echo '<div id="ans_box">';
    echo 
    '<img src="images/header_logo.png" alt="logo" width="279" height="53" class="logo">';

    echo 
    "<h2>Employee Application Information</h2>";
    echo 
    "<h3>Contact Information</h3>";
    echo 
    "<strong>First Name: </strong> " $_POST['fname']. "<br />"
    echo 
    "<strong>Last Name: </strong> " $_POST['lname']. "<br />";
    echo 
    "<strong>Address: </strong> " $_POST['address']. "<br />";
    echo 
    "<strong>City: </strong> " $_POST['city']. "<br />";
    echo 
    "<strong>State: </strong> " $_POST['state']. "<br />";
    echo 
    "<strong>Zip: </strong> " $_POST['zip']. "<br />";
    echo 
    "<strong>Phone: </strong> " $_POST['phone']. "<br />";
    echo 
    "<strong>Email: </strong> " $_POST['email']. "<br /> <br />";

    echo 
    "<h3>Response to Questions</h3>";

    echo  
    "<strong>Message 1: <br /> </strong>" $_POST["message"]."<br /> <br />"
    echo 
    "<strong>Message 2: <br /></strong>" $_POST["message2"]."<br /> <br />"
    echo 
    "<strong>Message 3: <br /></strong>" $_POST["message3"]. "<br /> <br />"

    echo 
    '</div>';

     
    ?>

    </body>
    </div>
    </html>

  6. #6
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,746
    in HTML the \r\n is ignored, if you keep that in mind in the future that \r\n works in text files, <textarea> tags and rendered PHP in to HTML document body but not the HTML display body then you are on to a winner.
    STOP using $ prefix on JavaScript variable names...
    Please remember to wrap any code you have in forum tags:-

    [CODE]...[/CODE] [HTML]...[/HTML] [PHP]...[/PHP]

    If you can't think outside the box, you will be trapped forever with no escape...

  7. #7
    Join Date
    Jul 2013
    Location
    Voorheesville NY USA
    Posts
    1,001
    You cleaned up the errors that I pointed out and that's why it works. Good going!

    My personal preference when coding is to setup my static html in a function and then build the dynamic parts of the page in php code portions of my overall script so that I'm not constantly concerned about tags on / tags off and quotes ad infinatum. Something like:

    Code:
    function DisplayPage()
    {
    .... html ....
    ....html ....
    --- css block --- (<style))
    --- js block --- (<script>)
    <body>
    (text headings)
    (page layout stuff like div tags, etc)
    $php_content_var
    $another_content_var
    ...
    ...
    </body>
    </html>
    }
    A most excellent tool for setting the above up is to use the PHP 'heredocs' construct. Look it up. Makes coding your html SO EASY!

    Once I have that setup, then I use my working portion of the php script to decide what needs to be accomplished, do that , and dump the results that I want to display into the $php... vars that I've set as placeholders in my html. Then I simply call the displaypage function and I'm done. I try and separate the layout from the content and therefore the html/css from the php as much as possible.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles