jQuery get() php button submit

Question

I have the following jquery code

$(document).ready(function() {
//Default Action
$("#playerList").verticaltabs({speed: 500,slideShow: false,activeIndex: <?=$tab;?>});
$("#responsecontainer").load("testing.php?chat=1");
var refreshId = setInterval(function() {
  $("#responsecontainer").load('testing.php?chat=1');
}, 9000);
$("#responsecontainer2").load("testing.php?console=1");
var refreshId = setInterval(function() {
  $("#responsecontainer2").load('testing.php?console=1');
}, 9000);

$('#chat_btn').click(function(event) { 
  event.preventDefault();
  var say = jQuery('input[name="say"]').val()
 if (say) { 
  jQuery.get('testing.php?action=chatsay', { say_input: say} );
  jQuery('input[name="say"]').attr('value','')
} else {
  alert('Please enter some text');
}
});

$('#console_btn').click(function(event) { 
event.preventDefault();
var sayc = jQuery('input[name="sayc"]').val()
if (sayc) { 
  jQuery.get('testing.php?action=consolesay', { sayc_input: sayc} );
  jQuery('input[name="sayc"]').attr('value','')
} else {
  alert('Please enter some text');
}
});


$('#kick_btn').click(function(event) { 
event.preventDefault();
var player_name = jQuery('input[name="player"]').val()
if (player_name) { 
  jQuery.get('testing.php?action=kick', { player_input: player_name} );
} else {
  alert('Please enter some text');
}
});


});

Sample Form

      <form id=\"kick_player\" action=\"\">
    <input type=\"hidden\" name=\"player\" value=\"$pdata[name]\">
    <input type=\"submit\" id=\"kick_btn\" value=\"Kick Player\"></form>

And the handler code

if ($_GET['action'] == 'chatsay') {
$name = USERNAME;
$chatsay = array($_GET['say_input'],$name);
$api->call("broadcastWithName",$chatsay);
die("type: ".$_GET['type']." ".$_GET['say_input']);
}

if ($_GET['action'] == 'consolesay') {
$consolesay = "§4[§f*§4]Broadcast: §f".$_GET['sayc_input'];
$say = array($consolesay);
$api->call("broadcast",$say);
die("type: ".$_GET['type']." ".$_GET['sayc_input']);
}
if ($_GET['action'] == 'kick') {
 $kick = "kick ".$_GET['player_input'];
 $kickarray = array($kick);
 $api->call("runConsoleCommand", $kickarray);
 die("type: ".$_GET['type']." ".$_GET['player_input']);
}

When I click the button, it reloads the page for starters, and isn't supposed to, it also isn't processing my handler code. I've been messing with this for what seems like hours and I'm sure it's something stupid.

What I'm trying to do is have a single button (0 visible form fields) fire an event. If I have to have these on a seperate file, I can, but for simplicity I have it all on the same file. The die command to stop rest of file from loading. What could I possibly overlooking?

I added more code.. the chat_btn and console_btn code all work, which kick is setup identically (using a hidden field rather than a text field). I cant place whats wrong on why its not working :(

I second Andre's suggestion but just wanted to add that you can also use .val() instead of .attr('value') — Purefan
– Purefan, Commented Aug 2, 2011 at 20:26
I added a alert('Successfully kicked', player); after the jQuery.get and its not firing either.. — Kelso
– Kelso, Commented Aug 2, 2011 at 22:46
I figured out the problem. I have a while loop, and apparently, each btn name and input field name have to be unique even though they are all in thier own <form> tags. $kickbtn .= " $('#kick_btn$k').click(function(event) { var player_name$k = jQuery('input[name=\"player$k\"]').val() jQuery.get('testing.php?action=kick', { player_input: player_name$k} ); alert('Successfully kicked'); });\n\n"; thats now in the while loop to create the JS object. I also added the same count to the field names in the while loop. this now works as expected! — Kelso
– Kelso, Commented Aug 2, 2011 at 23:34

Andre Dublin · Accepted Answer · 2011-08-02 20:16:30Z

2

use return false event.instead of preventDefault and put it at the end of the function

ie.

$(btn).click(function(event){
    //code
    return false;
});

And you should probably be using json_decode in your php since you are passing json to the php script, that way it will be an array.

answered Aug 2, 2011 at 20:16

Andre Dublin

1,1581 gold badge16 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Kelso Over a year ago

I've made the changes you suggested, however its still not firing on the handler. I would see something in the log for the api->call regardless if the data was right or not.

user229044 Over a year ago

event.preventDefault() works just as well, and server-side json decoding clearly isn't the problem. It might be, when he gets his JS in order, but you haven't answered his question or even attempted to do so.

user229044 · Accepted Answer · 2011-08-02 20:22:35Z

1

Either your callback isn't being invoked at all, or the if condition is causing an error. If it was reaching either branch of the if, it wouldn't be reloading the page since both branches begin with event.prevntDefault().

If you're not seeing any errors in the console, it is likely that the callback isn't being bound at all. Are you using jQuery(document).ready( ... ) to bind your event handlers after the DOM is available for manipulation?

Some notes on style:

If both branches of the if contain identical code, move that code out of the if statement:
for form elements use .val() instead of .attr('value')
don't test against "" when you really want to test truthyness, just test the value:

jQuery(document).ready(function () {
  jQuery('#kick_btn').click(function(event) { 
    event.preventDefault();
    var player_name = jQuery('input[name="player"]').val()
    if (player_name) { 
      jQuery.get('testing.php?action=kick', { player_input: player_name} );
    } else {
      alert('Please enter some text');
    }
  })
});

edited Aug 2, 2011 at 20:22

answered Aug 2, 2011 at 20:15

user229044♦

241k41 gold badges347 silver badges350 bronze badges

2 Comments

Kelso Over a year ago

ok, ive made the changes you suggested.. I realized a mistake, i wasnt using jQuery(Document on the main function, i changed the kick to go with the rest.

Kelso Over a year ago

Also, if you look.. chat_btn and console_btn function properly. ill add the handler code for those above too.

Kelso · Accepted Answer · 2011-08-03 12:42:22Z

0

I figured out the problem. I have a while loop, and apparently, each btn name and input field name have to be unique even though they are all in thier own tags.

$("#playerList").delegate('[id^="kick_btn"]', "click", function(event) {
  // get the current player number from the id of the clicked button
  var num = this.id.replace("kick_btn", "");
  var player_name = jQuery('input[name="player' + num + '"]').val();
  jQuery.get('testing.php?action=kick', {
      player_input: player_name
  });
  jQuery('input[name="player"]').attr('value','')
  alert('Successfully kicked ' + player_name + '.');
});

answered Aug 3, 2011 at 12:42

Kelso

4095 silver badges13 bronze badges

Collectives™ on Stack Overflow

jQuery get() php button submit

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related