Question

So I have a normal form with 1 textarea and two hidden inputs, which I would like to post via AJAX to a CI controller I have that inserts the information into the database.

The problem I’m having is that a) the page action is still called and the output of the controller is displayed and b) because the initial AJAX request is still processed plus the extra loading of the action target the information gets inserted twice.

This is my javascript code:

                 $(document).ready(function() {
                    $("#submit-comment").click(function(){

                        var post_id = <?=$p->id?>;
                        var user_id = <?=$user->id?>;
                        var content = $("textarea#content").val();  

                        if(content == '') {
                            alert('Not filled in content');
                            return false;
                        }

                        $.ajax({
                           type: "POST",
                           url: "<?=site_url('controller/comment')?>",
                           data: "post_id="+post_id+"&user_id="+user_id+"&content="+content,
                           success: function(msg){
                            alert(msg);
                           }
                         });
                    });
                });

I have tried doing

...click(function(e)... ... e.preventDefault

with no luck.

What am I doing wrong? 😛

Thanks

Ps. All the information is processed properly and accessed, it’s just the preventing the form which is screwing it up..

Answer 1

Just realised I was using a input type=”submit”, rather than input type=”button”.

Doh!