Estoy haciendo una página con elementos que se pueden comentar:
element_1 (id_1) --->escribe tu comentario ---> OnClick abre div con un formulario
element_2 (id_2) --->escribe tu comentario ---> OnClick abre div con el mismo formulario
element_3 (id_3) --->escribe tu comentario ---> OnClick abre div con el mismo formulario
etc.
Como cualquier sitio con comentarios, al hacer click, via AJAX, se abre el formulario correspondiente (que es siempre el mismo), con un textarea para escribir tu comentario. Cada formulario incluye un captcha.
Formulario
<form action="#" method="post" id="<?php echo $post_id; ?>" class="comment">
<textarea name="comment_post" maxlength=400 id="comment_post"></textarea><br />
Enter code...
<img src="grafica/img.php?rand=<?php echo rand(); ?>" id='captchaimg' ><br>
<input id="6_letters_code" name="6_letters_code" type="text"><br>
<span style="margin-left:105px;position: relative;top: -15px;"><small>Can't read the image? click <a href='javascript: refreshCaptcha();'>here</a> to refresh</small></span><br/>
<input type="button" class="submit" value=" Submit Comment " />
</form>
Enviar comentario
$(function() {
$(".submit").click(function() {
var comment_post = $("#comment_post").val();
var captcha = $("#6_letters_code").val();
$.ajax({
type: "POST",
... se envia el formulario ...
Refrescar captcha
function refreshCaptcha()
{
var img = document.images['captchaimg'];
img.src = img.src.substring(0,img.src.lastIndexOf("?"))+"?rand="+Math.random()*1000;
}
Cuando abrimos un div funciona (enviar y captcha), pero cuando abrimos un segundo div, el envío del formulario y refreshCaptcha()
dejan de funcionar.
Sospecho que esto sucede por meter varios formularios en divs sin refrescar página. Si alguien sabe cómo resolverlo, se lo agradecería.
submit
del formulario y se actualizan loscaptchas
?