Submit form with jquery plug-ins

Question

I am trying to submit the form with jquery. I am using bootstrap modal window. Here is a js fiddle. Am i missing something? thanks alot

Update: I am trying to submit the form using ajax. I also tried but not luck.

$('#comment_form').on('submit', function(){

  $.post("/yourReceivingPage", $(this).serialize(), function(){

  // Hide the modal
    $("#my-modal").modal('hide');

  });

  // Stop the normal form submission
  return false;
});

what is the name of php page that you're referring too? `/yourReceivingPage` ? Do you get any other errors from firebug? do you have any other frameworks on you page such as prototype? — Ilia Ross, Aug 15 '12 at 17:40
can you show me what do you send to the .php file what string generated when you hit post? Try to get that sting with `alert()` there might be something wrong going after `.serialize()` — Ilia Ross, Aug 15 '12 at 17:45
I think I have found you the answer, please check here: http://stackoverflow.com/questions/920294/jquery-serialize-and-post — Ilia Ross, Aug 15 '12 at 17:49

score 1 · Accepted Answer · edited May 23 '17 at 10:34

1

You refer to the wrong element, I have a working example for you, please check and let me know if it works for you:

$(document).ready(function() {
    $('#comment-form-submit').click(function() {
        $('#comment_form').submit();
        alert('Handler for .submit() called.');
        return false;
    });
});

jsFiddle Working Demo

And for AJAX solution you need to refer to familiar and already discussed issue:

jquery serialize and $.post

Edited: Referring to your question about how to extract the ID of the clickable link, this code will do it for you:

 $(document).ready(function() {
   $(".comments.no").mouseover(function() {
     myDivsId = this.id;  // as you mouse over on the link it will be stored in Global Var and then transferred anywhere you wish.
   });
     $('#comment-form-submit').click(function() {
       $('#comment_form').submit();
       alert('Handler for .submit() called + div\'s ID = ' + myDivsId);
       return false;
   });

});

jsFiddle live demo

edited May 23 '17 at 10:34

Community

1
1

answered Aug 15 '12 at 17:30

Ilia Ross

13,086
11
53
88

hmmm. remember you're not alone! :) please read here: http://stackoverflow.com/questions/6046008/jsonp-request-returning-error-uncaught-syntaxerror-unexpected-token – Ilia Ross Aug 15 '12 at 17:55
An "unexpected token" is most likely unsupported character code. You need to debug the request string and make sure it's valid: http://stackoverflow.com/questions/3143698/uncaught-syntaxerror-unexpected-token – Ilia Ross Aug 15 '12 at 17:59
Ilia Rostovtsev thanks Can i alert `id` from `
Click here 1
`. Is it possible? http://jsfiddle.net/7SUTp/1/ – Aug 15 '12 at 18:20
You are very welcome! If I got you right, is this what you need? http://jsfiddle.net/rostovtsev/gg6M8/ – Ilia Ross Aug 15 '12 at 18:33
if you on `click here 2`. I will get same id. It should be `24` – Aug 15 '12 at 18:40

Josh Mein · Answer 2 · 2012-08-15T17:19:54.933

You are looking for just submit(). What you are doing in your example is creating a function that will be run when the form is submitted. Also you are not setting up the handler for the clicking to submit the form.

// This creates submit handler for the form
$('#comment_form').submit(function() {
    alert('Handler for .submit() called.');
    return false;
});

// This creates the on click handler for the submit button
$('#comment-form-submit').on('click', function() {
    // This actually submits the form
    $('#comment_form').submit();
});

score 0 · Answer 3 · answered Aug 15 '12 at 17:14

0

You need to add a click event for comment-form-submit button.

$(document).on('click','#comment-form-submit', function() {
    $('#comment_form').submit(function() {
       alert('Handler for .submit() called.');
       return false;
    });
});

answered Aug 15 '12 at 17:14

KingKongFrog

13,946
21
75
124

Submit form with jquery plug-ins

3 Answers3