Jump to content

Post panel with text & preview side by side on same page


jamesmargolis
 Share

Recommended Posts

  I’m trying to write a post-panel where the user can see the preview of his post to the right of the
text area he’s writing into.
  I tried the following into a file called writepost.php :
 


<?php

$text=(isset($_GET['message']))?$_GET['message']:'';
$formatted_text=nl2br(stripslashes(htmlspecialchars($text)));

echo '<form method="post" action="proceedtopost.php?>'.
'<table>'.
'<td style width="50%"><tr>'.
'<fieldset> Write your post here : <br> <textarea cols="50" rows="12" '.
'id="message" name="message">'.$text.'</textarea>'.
'</fieldset> <p> '.
'<input type="submit" name="submit" formaction="writepost.php" value="Preview" /> '.
'<input type="submit" name="submit" value="Sent" /> '.
'</p>'.
'</td>'.
'<td>'.
'<fieldset> Your post will appear as follows :<br><p> '.
$formatted_text.
'</fieldset>'.
'</td></tr>'.
'</table>'.
'</form>';


There are several things wrong with this code :

  1) When the user hits the "Preview" button, I expect writepost.php to be reloaded (this is what happens), and the current content of the textarea to be stored in $_GET['message'] (this is not what happens).

  2) Why does my browser output the preview part under the text area (or in other words outputs the HTML table as a single column of two cells), when I insist in my HTML code for the table to be displayed  as a single row ?
 

Link to comment
Share on other sites

1) When the user hits the "Preview" button, I expect writepost.php to be reloaded (this is what happens), and the current content of the textarea to be stored in $_GET['message'] (this is not what happens).

 

Since the form method is set to POST, you'll need to use $_POST['message'] to get the submitted value.

Link to comment
Share on other sites

2) Why does my browser output the preview part under the text area (or in other words outputs the HTML table as a single column of two cells), when I insist in my HTML code for the table to be displayed  as a single row ?

 

Have you tried running the code through the W3C Markup Validation Service?

http://validator.w3.org/

 

You have a few syntax errors; one of which is the likely cause to the above issue. The following line opens a table column before the row is open:

'<td style width="50%"><tr>'.
Link to comment
Share on other sites

Now, with the code below I get the correct output except that the preview field   appears outside the table even though I declare it inside

<?php

$text=(isset($_POST['message']))?$_POST['message']:'';
$formatted_text=nl2br(stripslashes(htmlspecialchars($text)));

echo '<form method="post" action="proceedtopost.php?>'.
'<table>'.
'<td style width="50%">'.
'<fieldset> Write your post here : <br> <textarea cols="50" rows="12" '.
'id="message" name="message">'.$text.'</textarea>'.
'</fieldset> <p> '.
'<input type="submit" name="submit" formaction="writepost.php" value="Preview" /> '.
'<input type="submit" name="submit" value="Sent" /> '.
'</p>'.
'</td>'.
'<td>'.
'<fieldset> Your post will appear as follows :<br>'.
$formatted_text.
'</fieldset>'.
'</td>'.
'</table>'.
'</form>';
Link to comment
Share on other sites

Now, with the code below I get the correct output except that the preview field   appears outside the table even though I declare it inside

 

The table column tags need to be surrounded by table row tags (<tr> and </tr>).

 

 

As it can only validate html not php content, it would be quite complicated for me to use it in this situation, it seems.

 

One of the problems mentioned is likely caused by HTML syntax errors. Passing the page link to the validator would help identify those errors and hopefully fix the problem also.

Link to comment
Share on other sites

This thread is more than a year old.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.