How to handle Comments Preview

[doubledee]

I have just completed a modest way for Users to post Comments on Articles my website.

 

However, the thought occurred to me today, that I haven't given Users the ability to Preview or Edit their comments after submittal.

 

What is the best way to store info on a Comments Form so you can re-display it for Preview/Editing??  (I'm not really sure how the workflow would work for this?!)

 

Do I capture the Comments Form Data and store it in a Session?  Or in my Database?  Or do something else?

 

Security is always a concern of mine too!!

 

Thanks,

 

 

Debbie

 

[Anon-e-mouse]

Morning,

 

You could always have two fields in a table whereby one dictates that an article is "published" and another "preview". So after they've written their piece and click on "preview" it would update to '1' or something the equivalent that says this article isn't actually published just in progress?

 

And then update that to '0' and "published" to '1' when its confirmed as good to go? Seems the simplest way of doing something. Obviously you would then need to find some way of clearing out previewed articles that never went to print as it were unless you kept them for reference in the database which I can't imagine taking up a lot of room..

 

Hope it helps.

[ManiacDan]

Many sites don't let you edit the comments, so there's no requirement for you to do this at all.

 

If you really believe you need to do a preview:

1)  Accept the form submission.

2)  If the submit button is named "submit," simply submit the form normally.

3)  If the submit button is named "preview," re-draw the edit screen,

3.1) put the exact same content they posted BACK in the textarea

3.2) above the text area, draw what their comment will look like.

 

 

If you must do edits, then you'll have to put an "edit" button on only the logged-in user's posts.  When clicked, take them to the same page where they would post a NEW comment, except pre-fill the box with the comment they've already made.  Make sure submitting this form doesn't make a NEW comment.

 

 

"Preview" buttons are really only useful on sites like this with extensive markup that users might be unfamiliar with.  The Patheos blogs have an in-line preview that shows you your own post in real time as you type it.  Other sites like the gawker sites don't offer previews OR edit functionality.  Sites like reddit and phpfreaks offer both.

[spiderwell]

I have often seen previews displayed in a popup too, so it doesnt actually post the form, but it does grab the comment and display it in this popup preview window

[doubledee]

Many sites don't let you edit the comments, so there's no requirement for you to do this at all.

 

If you really believe you need to do a preview:

1)  Accept the form submission.

2)  If the submit button is named "submit," simply submit the form normally.

3)  If the submit button is named "preview," re-draw the edit screen,

3.1) put the exact same content they posted BACK in the textarea

3.2) above the text area, draw what their comment will look like.

 

I get that, but what I was getting at originally was...

 

Should I store the User's Comments in a SESSION when they initially submit the form?

 

Or should I immediately store the User's Comments in my database, and then retrieve and display them as you describe above?

 

Or use yet another approach?

 

I would think that storing the Form data in a SESSION would be easiest, and since they are just Comments, should also be okay from a security standpoint?!

 

 

If you must do edits, then you'll have to put an "edit" button on only the logged-in user's posts.  When clicked, take them to the same page where they would post a NEW comment, except pre-fill the box with the comment they've already made.  Make sure submitting this form doesn't make a NEW comment.

 

Can a Form have two "Submit" buttons?! 

 

 

"Preview" buttons are really only useful on sites like this with extensive markup that users might be unfamiliar with.  The Patheos blogs have an in-line preview that shows you your own post in real time as you type it.  Other sites like the gawker sites don't offer previews OR edit functionality.  Sites like reddit and phpfreaks offer both.

 

You may have a valid point there.

 

Since people are just commenting on Articles, you would like to think that they would treat typing in their Comments like sending an e-mail and make sure to "proof" things before they hit "Submit Comments"?!

 

Thanks,

 

 

Debbie

 

[ManiacDan]

I get that, but what I was getting at originally was...

 

Should I store the User's Comments in a SESSION when they initially submit the form?

 

Or should I immediately store the User's Comments in my database, and then retrieve and display them as you describe above?

Neither, which is why I mentioned neither in my post.  Accept the post, immediately re-draw the page and put their post back in the edit box.  No sessions, no db.

 

 

Can a Form have two "Submit" buttons?! 

Yes, the name is always "submit" and you change the VALUE.

 

 

Since people are just commenting on Articles, you would like to think that they would treat typing in their Comments like sending an e-mail and make sure to "proof" things before they hit "Submit Comments"?!

Never.  People are stupid and never double check anything.  that doesn't mean you're required to cater to them with an edit button, let them reply with spelling corrections. 

 

 

[doubledee]

I get that, but what I was getting at originally was...

 

Should I store the User's Comments in a SESSION when they initially submit the form?

 

Or should I immediately store the User's Comments in my database, and then retrieve and display them as you describe above

 

Neither, which is why I mentioned neither in my post.  Accept the post, immediately re-draw the page and put their post back in the edit box.  No sessions, no db.

 

I'm sorry, but I am not understanding what you are saying.

 

Above you said have a "Submit" and a "Preview" button.

 

If the click "Preview" then immediately re-display it with the User's Comments.

 

Right, so far?

 

If so, then how do you get the data from the Comments Form to the Edit Form?

 

Is my Edit Form just the "action" page on the Comments Form?

 

 

Can a Form have two "Submit" buttons?!

 

Yes, the name is always "submit" and you change the VALUE.

 

Okay.

 

 

Also, when I display the Edit Form, should I just show a Form that is pre-populated with the original data, or should I do like PHP Freaks does, and display the Post/Comments as they will appear PLUS the Edit Form below, or just the Edit Form?

 

Thanks,

 

 

Debbie

 

[ManiacDan]

There is no "edit" form, there's just the one form.  That's the problem.  Make a reply to this page.  Look at the address bar.  The URL is:

index.php?action=post;topic=354623.0

Type something and hit "preview".  The URL doesn't change, a preview box just appears. 

 

(PHPFreaks does it in JS, btw, but the post method works the same way).

 

You post back to yourself.

 

If the submit button is "submit", submit the comment and take them wherever you normally take them.

 

If the submit button is "preview", re-draw the comment form, but this time put a box above the textarea featuring the comment as they posted it.

 

Let them preview as many times as they want before hitting submit.

[kicken]

As a quick and dirty example:

<?php

if (isset($_POST['submit'])){
//save comment do the database
}

?>
<html>
<head></head>
<body>
  <form method="post" action="">
    <?php if (isset($_POST['preview'])): ?>
        <p>Here is a preview of your comment:</p>
<div class="comment">
  <?php echo nl2br(htmlentities($_POST['comment'])); ?>
</div>
     <?php endif; ?>

     <h2>Comment</h2>
     <textarea name="comment"><?php if (isset($_POST['comment'])) echo htmlentities($_POST['comment']); ?></textarea>
     <input type="submit" name="submit" value="Submit Comment">
     <input type="submit" name="preview" value="Preview Comment">
  </form>
</body>
</html>

 

When they click the submit button, the browser will fill $_POST with two values:

$_POST['submit'] = "Submit Comment"  and

$_POST['comment'] = "Whatever they typed".

 

If they the preview button, the browser will instead send you:

$_POST['preview'] = "Preview Comment"  and

$_POST['comment'] = "Whatever they typed".

 

 

So what you do is just test which button they clicked by testing for the existence of that buttons key name.  When you know which is clicked you handle it appropriately.  For the case of a preview, you just re-create the page with the form to submit the comment, but include an extra area which shows what the comment will look like.  There is no need to store the data anywhere for this, you just use it directly from the $_POST variable.  When you re-create the textbox for them to type in, you just make sure you pre-fill it with the value they submitted.

 

When they are happy with the result and click the submit button, you then save the data to your database and send them on their way.

 

[doubledee]

As a quick and dirty example:

<?php

if (isset($_POST['submit'])){
//save comment do the database
}

?>
<html>
<head></head>
<body>
  <form method="post" action="">
    <?php if (isset($_POST['preview'])): ?>
        <p>Here is a preview of your comment:</p>
<div class="comment">
  <?php echo nl2br(htmlentities($_POST['comment'])); ?>
</div>
     <?php endif; ?>

     <h2>Comment</h2>
     <textarea name="comment"><?php if (isset($_POST['comment'])) echo htmlentities($_POST['comment']); ?></textarea>
     <input type="submit" name="submit" value="Submit Comment">
     <input type="submit" name="preview" value="Preview Comment">
  </form>
</body>
</html>

 

Thanks, Kicken!  That was very helpful! 

 

 

For the case of a preview, you just re-create the page with the form to submit the comment, but include an extra area which shows what the comment will look like.  There is no need to store the data anywhere for this, you just use it directly from the $_POST variable.  When you re-create the textbox for them to type in, you just make sure you pre-fill it with the value they submitted.

 

So I make the fields "sticky", right?

 

When I do my Forms, I use this at the top of the file...

// *************************************************************
// HANDLE FORM.							 *
// *************************************************************
if ($_SERVER['REQUEST_METHOD']=='POST'){
	// Form was Submitted (Post).

	// Trim all Form data.
	$trimmed = array_map('trim', $_POST);

 

And then down in my HTML section I do this...

<!-- First Name -->
<label for="firstName"><b>*</b>First Name:</label>
<input id="firstName" name="firstName" type="text" maxlength="30"
		value="<?php if(isset($firstName)){echo htmlspecialchars($firstName, ENT_QUOTES);} ?>" /><!-- Sticky Field -->
<?php
	if (!empty($errors['firstName'])){
		echo '<span class="error">' . $errors['firstName'] . '</span>';
	}
?>

 

 

When they are happy with the result and click the submit button, you then save the data to your database and send them on their way.

 

So what are your personal thoughts on having a "Preview" button?  (ManiacDan doesn't seem to be a fan...)

 

I think it is a nice feature, and in this day and age, "par for the course".

 

 

Debbie

 

 

[kicken]

So what are your personal thoughts on having a "Preview" button?  (ManiacDan doesn't seem to be a fan...)

 

I think it's less about being "not a fan" and more about it being a waste of development effort.  Previews are really only useful in places such as these forums where you have several formatting codes that actually make your message appear differently than in the box your typing it into.  Most article or blog comment systems do not allow these types of formatting so it's a what you type is what you get thing.  People can just stop and re-read what they put in before clicking submit without having to have a "preview" feature.

 

Even with a feature, people tend not to use them in my experience.  Even I personally do not preview here unless I end up using a lot of markup codes in my post.  For example this post only has a quote so I probably wont bother with the preview at all.  As for simple spelling and grammar checks, I just re-read my message before hitting submit, rather than preview.  It's easier and faster.

 

[doubledee]

So what are your personal thoughts on having a "Preview" button?  (ManiacDan doesn't seem to be a fan...)

 

I think it's less about being "not a fan" and more about it being a waste of development effort.  Previews are really only useful in places such as these forums where you have several formatting codes that actually make your message appear differently than in the box your typing it into.  Most article or blog comment systems do not allow these types of formatting so it's a what you type is what you get thing.  People can just stop and re-read what they put in before clicking submit without having to have a "preview" feature.

 

Even with a feature, people tend not to use them in my experience.  Even I personally do not preview here unless I end up using a lot of markup codes in my post.  For example this post only has a quote so I probably wont bother with the preview at all.  As for simple spelling and grammar checks, I just re-read my message before hitting submit, rather than preview.  It's easier and faster.

 

Some follow-up questions...

 

1.) Is it bad from a User Experience if I have a Preview button?

 

2.) If I want my Form to accept and understand tags like [ b ] for bold, how do I do that?

 

3.) How would I add a fancy Word Processing-type Editor?

 

4.) What are your thoughts on letting Users *edit* their Post/Comments after they have been submitted?

 

Thanks,

 

 

Debbie

 

[ManiacDan]

1.) Is it bad from a User Experience if I have a Preview button?

No, it's just a pain in the ass for the dev.  It's only necessary if you have complex formatting in your posts.

2.) If I want my Form to accept and understand tags like [ b ] for bold, how do I do that?

Install or write a BBCode parser, there's a thread on it on the front page of the forum right now.

 

3.) How would I add a fancy Word Processing-type Editor?

Download and install something like FCKEditor.

 

4.) What are your thoughts on letting Users *edit* their Post/Comments after they have been submitted?

Pain in the ass and generally not worth it for article comments.  Even PHPFreaks doesn't let normal users edit their posts after 30 seconds, all of the "edit" functionality is reserved for just us mods.  It's only really necessary on discussion forums like this, you will often see people simply replying to themselves with corrections.

[scootstah]

4.) What are your thoughts on letting Users *edit* their Post/Comments after they have been submitted?

 

It depends on what the comments are for. If they are just article comments when everyone is just saying "awesome article thanks", it's not really needed. But for forums or some such, as an end user I much prefer the ability to edit my posts. Especially on help/support forums (such as this one). Often times you don't notice a mistake or typo until after you've posted, which is then irritating if you can't edit it and fix it.

 

So in short: an edit feature is a lot more convenient for the users, but more of a pain for the developer. Also, if you plan on parsing BBCode (or some other format) I would recommend you either have a preview function, or an edit function. Or both.

[doubledee]

4.) What are your thoughts on letting Users *edit* their Post/Comments after they have been submitted?

 

It depends on what the comments are for.

 

The context is this...

 

My website will have tons of articles on various topics (e.g. Small Business) and below each Article is the ability for people to add Comments.  (Similar to how you could comment on an article in the Washington Post or USA Today.)

 

I am leaning towards offering "Preview" and "Edit" features because I want *quality* posts, and if people have the ability to scan what they typed before submitting it, and/or editing it, there will likely be better quality responses.  (I use both of these features on this site regularly!!)

 

Will everyone use or need these?  No.  But it seems to me that if they are there is can only help improve the quality of things on my site.

 

 

Debbie

 

[creata.physics]

Then you've answered your own question. For things like what you should offer users on a website you're creating is all personal preference, though I do understand asking others opinions to gain different aspects.  Can you please mark this topic as solved? I keep coming back to anything unsolved as force of habit.

[ManiacDan]

One thing you haven't thought of (though you of all people should) is trolls.  If you let people go back and retroactively edit what they said during an argument or discussion, it's possible they could completely change what they had said and make people look foolish or angry.  We had that problem on devshed, and the fact that users aren't allowed to edit their posts after a minute or two really helps with arguments on PHPFreaks.

[scootstah]

One thing you haven't thought of (though you of all people should) is trolls.  If you let people go back and retroactively edit what they said during an argument or discussion, it's possible they could completely change what they had said and make people look foolish or angry.  We had that problem on devshed, and the fact that users aren't allowed to edit their posts after a minute or two really helps with arguments on PHPFreaks.

 

That's why I try to make it a habit to quote anything in question, that way they can't tamper with it.

[ManiacDan]

I had a guy on devshed once get into a 4 page argument with me and another guy, screaming and calling us names, saying that we were in a gay relationship, telling us he was going to kill us, etc.  Real mature stuff (especially for a 70 year old, which he was).  When we finally got fed up with the conversation, he went back and edited all of his posts to be reasonable and then quoted-replied against our replies to say that we were crazy.

 

The thread is here if you're interested.  It's pretty hilarious to watch arty explode. 

[doubledee]

One thing you haven't thought of (though you of all people should) is trolls.

 

That's the pot calling the kettle black!  HAH!!!!!

 

 

If you let people go back and retroactively edit what they said during an argument or discussion, it's possible they could completely change what they had said and make people look foolish or angry.  We had that problem on devshed, and the fact that users aren't allowed to edit their posts after a minute or two really helps with arguments on PHPFreaks.

 

If you assume everyone of your users devious - obviously your outlook on life - then you have a valid point.

 

But what about the fact that some of "mortals" aren't bad and just make type-o's or grammatical erros and want to fix them in the first 5 minutes??

 

 

Debbie

 

[creata.physics]

Can this topic be ended with as it is no longer falling into the category of PHP Coding Help?

 

This is getting old coming back to these topics that have been solved for over a day when peoples posts are getting bumped out of the way who actually still need PHP Coding Help.

[spiderwell]

oh relax, all posts die of their own accord eventually

 

No one is making you come back here, and it is marked solved so why even read it if it bothers you that much!

 

there is some irony in your post as you are doing exactly what you are protesting about!