adding two times javascript post function

[JanMolendijk]

I`m busy for a few hours to add a function in my comment system
this comment-system post comments is without page-refresh

Only I can`t find out how to use this script two times ?

Separated I have no errors but it is not working on both....

Code: Select all

<script>
$(document).ready(function(){
 
 $('#comment_form').on('submit', function(event){
  event.preventDefault();
  var form_data = $(this).serialize();
 


 $.ajax({
   url:"comment/comments/add_comment.php",
   method:"POST",
   data:form_data,
   dataType:"JSON",
   success:function(data)
   {
    if(data.error != '')
    {
     $('#comment_form')[0].reset();
     $('#comment_message').html(data.error);
     $('#comment_id').val('0');

     load_comment();
    }
   }
  })
 });

 load_comment();

 function load_comment()
 {
  $.ajax({
   url:"comment/comments/fetch_comment.php?id=<?php echo $_GET['id'];?>",
   method:"POST",
   success:function(data)
   {
    $('#display_comment').html(data);
   }
  })
 }

 $(document).on('click', '.reply', function(){
  var comment_id = $(this).attr("id");
  $('#comment_id').val(comment_id);
  $('#comment_name').focus();
 });

 $(document).on('click', '.reply', function(){
   var comment_id = $(this).attr("reply_to");
  $('#reply_to').val(comment_id);
   $('#reply_to').focus();

 });


 $(document).on('click', '.reply', function(){
   var comment_id = $(this).attr("reply_to");
  $('#comment_content').val(comment_id);
   $('#comment_content').focus();

 });

 
});
</script>

I would like to add this new function but without any success

Code: Select all

<script>
$(document).ready(function(){
 
 $('#comment_form').on('submit', function(event){
  event.preventDefault();
  var form_data = $(this).serialize();
 
  $.ajax({
   url:"comment/comments/add_note.php",
   method:"POST",
   data:form_data,
   dataType:"JSON",
   success:function(data)
  
  })
}
</script>

Hope you have any tips for me....

If you want to add two post forms in the same page, they must have different IDs.
So, put another id to the second form (for example: #comment_form2), then, in javascript add the second function with that id.

Code: Select all

<script>
$(document).ready(function(){
 $('#comment_form2').on('submit', function(event){
  event.preventDefault();
  var form2_data = $(this).serialize();
 
  $.ajax({
   url:"comment/comments/add_note.php",
   method:"POST",
   data:form2_data,
   dataType:"JSON",
   success:function(data)
  })
}
</script>

Thanks for the quick answer 1 question
is this both able with one submit button ????

Because I need now two forms

comment_form & comment_form2

I tested it & it does not send both

Code: Select all

  <form method="POST" id="comment_form"  name="submit" >
    <div class="form-group">
     Name: <input type="text" name="comment_name" id="comment_name" cols="10"  placeholder="Enter Name" value="<?php echo $user->filter->display_name; ?>"/ >
    
<label><input type="checkbox" id="chb11" value="1" />Agree FaQ</label>




  <input type="submit" name="submit" id="submit" class="btn btn-info" value="Submit" disabled/ >


  <form method="POST" id="comment_form2"  name="submit" >
    <div class="form-group">
  
<input type="text" cols="5" id="over_all_id" name="over_all_id" value="<?php echo $idnumber; ?>"  minlength="5" />

<input type="text" cols="5" id="comment_to_id" name="comment_to_id" value="<?php echo  $row['post_user_id']?>"  minlength="5" />
	
<input type="text" cols="5" id="comment_sender_name" name="comment_sender_name" value="<?php echo $user->filter->username; ?>"  minlength="5" />
	
<input type="text" cols="5" id="comment_sender_id" name="comment_sender_id" value="<?php echo $user->filter->userid; ?>"  minlength="5" />

<input type="text" cols="5" id="topic_id" name="topic_id" value="<?php echo $id; ?>"  minlength="5" />

<input type="text" cols="5" id="ip_address" name="ip_address" value="<?php echo $ip; ?>"  minlength="5" />




   </form>
</form>

According to your script, each form must have its own submit button.