jQuery Comment Preview

Brilliant, thank you very much :)

I would perhaps use the keyup rather than keypress event, so that the final character you type appears without you having to move your focus away from the textarea.

Otherwise, really nice :)

I agree with the keyUp comment, but still very nice!

You are the best…!

Noticed a bit of jumping in FF, try throwing a min-height on your display div to fix that (won’t work in IE 6 of course but eh.) Great job though, post via AJAX for a next step?

I just implimented this on my site. At first I was including the md5 function on an external file and firebug was saying that the function was undefined, however when I put it straight on the document it worked fine.

The filename was definatly correct. Would there be any other reason for this?

Thanks for taking the time to port this to jQuery David, you’re the beez neez.

holy crap that’s cool, I really need to start learning javascript.

It’s nice bro, but just one thing. It would be nice to use some line-breaking function, so when the word is too long it goes out of the box :) U can use this JS Wordwrap .

very very nice! what a nice feature for the visitors. thank you for sharing!

Thank’s, very nice!

oh my god this is so sick!

Man I loved that!!!

Brilliantly awesome dude!!!

Is it possible to make it process HTML tags? For example TEXT would make “TEXT” appear bold?

@James Wong:

Try changing

$(‘#lp-comment’).text($(‘#comment’).val());

To

$(‘#lp-comment’).html($(‘#comment’).val());

@Ben: Like magic! works like a charm :D ty

i noticed that the gravatar does not work it always shows the default gravatar
any sugestions on how to fix that (i thought it might be it needs to pass the email in lowercase){i dont know jquery much so i dont know if its doing that}

i am currently trying to convert the md5 and as meny things as i can to php so can save the data in mysql and use on my site. but im a bit lost and its driving me nuts
i did get php to work with gravatar on my site.

any help would be grate to convert this to a jquery/php with save features
i did find a nifty mysql jquery routine
http://www.phpdeveloper.org/news/12003
that has the mysql routines to use for coments
so any ideas on how to incorp all this and to fix the bug of only displaying the default gravatar?

thank you in advance for any code or help you may provide

this is the php is has the problem of not displaying the default gravatar
go figure
<?php
$email = "dragonsworkshop@yahoo.com";
$default = "http//:davidwalsh.name/wp-content/themes/david-walsh/graphics/com.jpg";
$size = 50;

//You can construct your gravatar url with the following php code:

$grav_url = "http://www.gravatar.com/avatar.php?gravatar_id=".md5( strtolower($email) ).
"&default=".urlencode($default).
"&size=".$size;

echo '’;

?>

echo ‘IMG SRC=”‘.$grav_url.’” ALT=”?” BORDER=0′;
add a less then and greater then signs for image (didnt print in last post thought it was html)

this now works fixed the default image php code
[code]
<?php
function validate_gravatar($email) {
// Craft a potential url and test its headers
$hash = md5($email);
$uri = 'http://www.gravatar.com/avatar/' . $hash . '?d=404';
$headers = @get_headers($uri);
if (!preg_match("|200|", $headers[0])) {
$has_valid_avatar = FALSE;
} else {
$has_valid_avatar = TRUE;
}
return $has_valid_avatar;
}

$email = "11111xxxxx@yahoo.com";
$default = "http://davidwalsh.name/wp-content/themes/david-walsh/graphics/com.jpg";
$size = 50;

//You can construct your gravatar url with the following php code:

had to split the code(wouldn’t let me post thought i was spam)

$grav_url = “http://www.gravatar.com/avatar.php?gravatar_id=”.md5( strtolower($email) ).
“&d=”.$default.//urlencode($default).
//”&d=monsterid”.
“&size=”.$size;

if (validate_gravatar($email))
{
echo ‘IMG SRC=”http://’.$grav_url.’” ALT=”?” BORDER=0′;

}
else
{
echo ‘no gravatar found’;
echo ‘IMG SRC=”‘.$default.’” ALT=”?” BORDER=0′;
echo “org gravatar”;
echo ‘IMG SRC=”‘.$grav_url.’” ALT=”?” BORDER=0′;

}
// replace less then and greater then signs for image as needed
?>
[code]

Thanx I really needed a comment box you’ve saved my life

Here’s my version, dating from the year 2005 (onkeyup=”ReloadTextDiv()” on the textarea) – short and sweet:

// live comment preview – comment body
function ReloadTextDiv() {
document.getElementById(“commentspreviewheader”).style.display=”block”;
document.getElementById(“commentspreview”).style.display=”block”;
document.getElementById(‘CommentDisplay’).innerHTML = ”+document.getElementById(‘requiredcomment’).value.replace(/(\r\n|\n)/g,”).replace(/(){2,}/gi,”)+”;
}
// by default do not show the commentsheader and preview until something is typed in either name or text
document.getElementById(“commentspreviewheader”).style.display=”none”;
document.getElementById(“commentspreview”).style.display=”none”;

Hello,

More than 15 characters (And stop at 255 characters) long when I want to run. But it did not work. Please help me,

$(‘#commentsForm textarea’).bind(‘blur keyup’,function() {
if($(‘#comment’).length > 15){
$(‘#lp-comment’).text($(‘#comment’).val());
$(‘#lp-comment’).html($(‘#lp-comment’).html().replace(/\n/g,”));
}
});

Sincerely,
Samet ARAS.

hi. looks really fabulous. may we ask for the workfiles with whatever essential plug-ins ? throw in the database steps as well for the form? thanks a million.

@Ben: great

@Rob Simpkins: great great great great great great