I have a list of fetched data, and to every data has a form below it, like a comment box form, where other users can leave a message to the specific data.
What I've tried so far is putting the submit button into an array to distinguish it from one to another (don't know if I'm doing this right as this is one of my first attempt in using Javascript/jQuery library and AJAX).
I can submit the data and insert it into the SQL database just by using PHP/MySQL but I wanted to achieve at least the comment-like system of this community, Stackoverflow, wherein once a comment is posted, it would show up right after hitting the button (not by reloading the whole page in order to submit the data into the database).
This is the dynamically post data:
<?php while($loopquery){ ?>
<div>
<?php echo $row['data']; ?>
<div id="flash[]"></div> <!-- NEW POSTED COMMENT SHOULD BE SHOWN HERE -->
<form action="#" method="POST">
<input type="text" name="comment[]" id="comment[]">
<input type="submit" id="submit[]">
</form>
</div>
<?php } /* END OF LOOP */ ?>
And once the submit is clicked:
$(function () {
var submit = document.getElementById('submit');
for (var a = 0; a < submit.length; a++) {
submit[a].click(function () {
var comment = document.getElementById('comment');
var hiddentaskid = document.getElementById('hiddentaskid');
var dataString = '&comment='+comment[a]+'&hiddentaskid='+hiddentaskid[a];
if (comment[a] == '' || hiddentaskid[a] == '') {
alert('Please Give Valid Details');
} else {
var flash = document.getElementById('flash');
flash[a].show();
flash[a].fadeIn(400).html('Loading message');
$.ajax({
type: "POST",
url: "commentajax.php",
data: dataString,
cache: false,
success: function (html) {
$("ol#update").append(html);
$("ol#update li:last").fadeIn("slow");
flash[a].hide();
}
});
}
return false;
});
}
});
I've tried using array to distinguish the data from one to another, but it's not working when I try to tweak the script. New posted message/comment should pop-out in the <div ="flash"></div>
area (by using AJAX). Can anyone help me how I can achieve my wanted output?