Im an AJAX n00b and i have been trying to get into ajax. im using jquery. and frankly im having nothing but problems Im just writing a test page to see if i can do it and i keep getting a 405 : Method Not Allowed error poke at it here : http://www.goodsocialnetwork.com/testbay/ajax/test1.html its simple, click UP 40 becomes 41 click DOWN and it becomes 39 i know if you click UP then DOWN it goes from 41 to 39 40 is submitted with the form just for a temp value, if i can get it to work the real value will be called from a database then manipulated and displayed. page code (im sure there is an easier way, like i said im a noob) Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <script type="text/javascript" src="../../global/jquery126.min.js"></script> <script type="text/javascript"> function submitup() { document.VoteUp.submit(); } function submitdown() { document.VoteDown.submit(); } $(document).ready(function() { $("#voteup").submit(function() { var cid_val = $("#ajax_vote_cid").val(); var val_val = $("#ajax_vote_val").val(); var dir_val = 'UP'; $.post("backend.php", { cid : cid_val, val : val_val, action : dir_val }, function(data) { $("#ajax_score p").html(data); }); return false; }); }); $(document).ready(function() { $("#votedw").submit(function() { var cid_val = $("#ajax_vote_cid").val(); var val_val = $("#ajax_vote_val").val(); var dir_val = 'DOWN'; $.post("backend.php", { cid : cid_val, val : val_val, action : dir_val }, function(data) { $("#ajax_score p").html(data); }); return false; }); }); </script> </head> <body> <form name="VoteUp" id="voteup" method="post"> <input type="hidden" id="ajax_vote_cid" value="9000" /> <input type="hidden" id="ajax_vote_val" value="40" /> <p><input type="button" value="UP" onclick="submitup();" /></p> </form> <form name="VoteDown" id="votedw" method="post"> <input type="hidden" id="ajax_vote_cid" value="9000" /> <input type="hidden" id="ajax_vote_val" value="40" /> <p><input type="button" value="DOWN" onclick="submitdown();" /></p> </form> <div id="ajax_score"> <p>40</p> </div> </body> </html> the backend.php file that it calls is simply as follows PHP: <?php if ($_POST['action'] == 'UP') { $val = $_POST['val'] + 1; } elseif ($_POST['action'] == 'DOWN') { $val = $_POST['val'] - 1; } else { $val = 'error'; } echo '<strong>'.$val.'</strong>'; ?> Im using the onclcik event because id like to replace the buttons with images later on. this seems to be where the problem is steming from. because if i just use submit buttons it works fine id apreciate any help you guys can give me, im starting to hate ajax just because its frustrating the hell out of me
Looks like you're REALLY overcomplicating things... I'd suggest something along these lines: PHP: <!-- page that visitors visits --><script type="text/javascript">jQuery(document).ready(function(){ $("#voteUp").click(function() { $.get("vote.php", {article: 1, action: up}, function(result) { $("#results").html(result); }); }); $("#voteDown").click(function() { $.get("vote.php", {article: 1, action: down}, function(result) { $("#results").html(result); }); }); $.get("vote.php", {article: 1, action: getVotes}); //onload event });</script><button id="voteUp" value="vote up!" /><button id="voteDown" value="vote down!" /><div id="results"></div><!-- end page visitor visits--><!-- below is vote.php --><?php$votes = 40;//this would come from the db based on $article$article = isset($_GET['article']) ? $_GET['article'] : 0;$action = isset($_GET['action']) ? $_GET['action'] : null;if ($action == 'up') { //interact w/ db $votes++;}else if ($action == 'down') { //interact with db $votes--;}else if ($action == 'getVotes') { //interact w/ db}else { $votes = 'error';}echo '<strong>', $votes, '</strong>';?> Totally untested, couple-of-minutes code, but it's a lot simpler as far as the JS goes and should work for you or at least set you in the right direction. Obviously you'll need to validate data before going to the db, ensure they haven't already voted, etc. That's two different pages, but it should be reasonably close to the mark. What I saw on your page didn't really work at all; I think it's how you have the HTML structured. Adding a 'return false;' to the end of your onclick events may do it but I'm not sure that would be the best approach. Of course you should be able to add in any other values in the same way you've done via the hidden field, or generate the javascript dynamically with PHP. Doesn't really matter. Hopefully that helps
Doesn't matter, just change three letters There's absolutely no security in POST, it takes all of three seconds to forge a POST request, and it's not like people see the GET request from an AJAX call in the url bar anyways. Technically speaking, POST is more semantically correct so if you want to switch it over, just do a find-and-replace.
I know there is no security in post, and im working on implamenting CSRF proftection while working to eliminate the sites use of GET
and im still wondering why it was kicking back a HTTP 405 error Iv run into that problem before when i have two "ajax components" on one page, the first will work but the second will throw a 405
Its not for a voting system, its for a positioning system, so there could potentially be hundreds of UP DOWN buttons on the page. all of them needing to interact with certin data (specifically UNIT ID numbers so that it only effects the specific unit that is having its position changed.
