Submitting form without refresh AJAX

[SamohtVII]

Ok I have seen a lot about submitting a form without refresh and I feel there are a couple of ways to do this with submit or just using a button (Difference/best?) and I am just still running into pproblems despite searching through countless posts. So:

<script type="text/javascript">        $(function() {            $('.adminButton').click(function(e) {                e.preventDefault();                var privacy = $('input:radio[name=privacy]:checked').val();                var invites = $('input:radio[name=invites]:checked').val();                var posts = $('input:radio[name=posts]:checked').val();                console.log(privacy, invites, posts);                //return;                //alert(posts);                $.ajax({                    type: "POST",                    url: "editOptions.php",                    data: {privacy: privacy, invites: invites, posts: posts},                    success: function(result) {                        $('#admin2').append("<div id='message'>Changes Saved</div>");                        console.log(result);                        console.log("success");                    }                });            });        });     </script>

and:

<div id="admin2">                </div>                <form action="" method="post" name="editOptions">                                Privacy<br />                    <input type="radio" name="privacy" id="privacy" value="public" >                    Public        <br />                    <input type="radio" name="privacy" id="privacy" value="private" >                    Private            <br /><br />                    Invites<br />                    <input type="radio" name="invites" id="invites" value="adminonly" >                    Admin Only            <br />                    <input type="radio" name="invites" id="invites" value="everyone" >                    Everyone            <br /><br />                    Posts<br />                    <input type="radio" name="posts" id="posts" value="adminonly" >                    Admin Only            <br />                    <input type="radio" name="posts" id="posts" value="everyone" >                    Everyone            <br />             <textarea style="display:none;" name="groupName"><?php echo $groupAd; ?></textarea>                    <button class="adminButton">Save Changes</button>                </form>

So just a form with 3 sets of 2 radio buttons. So I think the problem is going through many tutorials and posts I have a combination of what to do when you either 'submit' or when you click a 'button' but maybe others can see something easy I missed.

ty

EDIT editOptions just in case

<?php include 'config.php';$privacyX = $_POST['privacy'];$invitesX = $_POST['invites'];$postsX = $_POST['posts'];$groupAd = $_POST['groupName'];$sql = "UPDATE `options` SET privacy='$privacyX', invite='$invitesX', post='$postsX' WHERE adminGroup = '$groupAd'";if(!mysql_query($sql, $link)){	die('Error: ' . mysql_error());	}mysql_close($link);?>

 

[justsomeguy]

What is the problem with the code, what is it doing? What do you see printed in the console? One change would be to remove the IDs on the radio buttons, you can't have multiple elements with the same ID.

[SamohtVII]

Sorry, ummThe success function goes of and prints changes saved but nothing in my BD table changes. I don't know about the console log, I got the from a tutorial so where does that get saved? :S It seems like it all runs fine except does nothing with editOptions.php.

[justsomeguy]

You can open your browser's developer tools to find the console, there are links in my signature about the developer tools for various browsers. One problem is that you're not sending a value for groupName in the ajax request.

[SamohtVII]

Thanks heaps mate. Got firebug and immediately found the problem. ty