Question

I am trying to submit a form with ajax. Here is my complete code

<?php 
    $wparent = "123";
    $method = "sms";
?>

<script type="text/javascript">
    $(document).ready(function(){
        $("#post_<?php echo $wparent;?>").click(function(){
            $('#parentpost-<?php echo $wparent;?>').html('Loading.....');
            $("#parentpost-<?php echo $wparent;?>").load("<?php echo SITE_URL;?>new_ajax/post_reply.php", {message:$("[name=replynote]").val(), method:$("[name=method]").val(), parent:$("[name=parent]").val()}); //end
        }); // end of the main click function
    });
</script>

<?php   
echo "<textarea name='replynote' ></textarea>";
echo "<input type=\"submit\" class=\"post_button\" id=\"post_$wparent\" value=\"post\" />";
echo "<input type=\"button\" class=\"cancel_button\" value=\"Cancel\" />";
?>
<input type='hidden' name='parent' value='<?php echo $wparent;?>' />
<input type="hidden" name="method" value="<?php echo $method;?>" />

When I checked the post variables with firebug I saw that, its sending only the method correctly. All other values are sent as undefined. I could not find the error till now.

Answer 1

Try pre-populating the data map that you’re passing:

 $(document).ready(function () {
     $("#post_<?php echo $wparent;?>").click(function () {
         var message = $("[name=replynote]").val();
         var method = $("[name=method]").val();
         var parent = $("[name=parent]").val();
         var data = {
             "message": message,
             "method": method,
             "parent": parent
         };
         $('#parentpost-<?php echo $wparent;?>').html('Loading.....');
         $("#parentpost-<?php echo $wparent;?>").load("<?php echo SITE_URL;?>new_ajax/post_reply.php", data); //end
     }); // end of the main click function
 });

If data is an object containing undefined values, then your jQuery selectors aren’t working.

Also, since you’re only using a name attribute to find your inputs, you may want to be more specific in the selectors.

Finally, the attribute selectors typically need the value of the attribute enclosed in quotes, so try these for your selectors:

     var message = $('textarea[name="replynote"]').val();
     var method = $('input[name="method"]').val();
     var parent = $('input[name="parent"]').val();