[SOLVED] How to get value of button in jQuery

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
Bbob
Forum Commoner
Posts: 57
Joined: Sat Aug 07, 2010 4:46 am

[SOLVED] How to get value of button in jQuery

Post by Bbob »

Hi

How do I get which button has been pressed using jQuery?

This is my current code which doesnt work. Im not getting any value on the variable 'decision'


page.php

Code: Select all

<form name="decision">
<input type="button" name="place" id="1" value="First" onClick = "choice();" />
<input type="button" name="place" id="2" value="Second" onClick = "choice();" />
</form>

jquery.js

Code: Select all

function choice()
{
   $.post(
	      'process.php',
			{
				decision: document.decision.place.value //document.form.name.value
			},
			
			function(result)
			{
				alert(result);
			}
	
		  );
}

process.php

Code: Select all


echo $_POST['decision'];

Last edited by Bbob on Tue Nov 02, 2010 7:33 pm, edited 1 time in total.
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: How to get value of button in jQuery

Post by pickle »

You should update your javascript. Especially with a modern library, you should be attaching event handlers in Javascript, not triggering using the onClick attribute. Additionally, you should use jQuery selectors to target which element was clicked, not DOM syntax like that.

Code: Select all

<form id="decision">
<input type="button" name="place" id="1" value="First"/>
<input type="button" name="place" id="2" value="Second"/>
</form>

Code: Select all

$(document).ready(function(){
  $("#decision input[name=place]").click(function(){
    var clickedButtonValue = $(this).val();
  }
});
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Re: How to get value of button in jQuery

Post by kaszu »

And instead of value you should use id to detect which button was clicked, because if one day you (or client) will decide to localize website you will have to rewrite your js/php.

Code: Select all

var clickedButtonId = $(this).attr('id');
Bbob
Forum Commoner
Posts: 57
Joined: Sat Aug 07, 2010 4:46 am

Re: How to get value of button in jQuery

Post by Bbob »

Thanks it works great :D


How do I pass the value to PHP?

Do I use post? Like this?

Code: Select all


$.post('answer.php', { choice: clickedButtonValue }

.......

BTW what do you call this format ("decision input[name=place]")? Its the first time Ive seen it. Can you please post a link where I can find a guide on how to use it?
User avatar
Eran
DevNet Master
Posts: 3549
Joined: Fri Jan 18, 2008 12:36 am
Location: Israel, ME

Re: How to get value of button in jQuery

Post by Eran »

The manual is your friend - http://api.jquery.com/category/selectors/
Bbob
Forum Commoner
Posts: 57
Joined: Sat Aug 07, 2010 4:46 am

Re: How to get value of button in jQuery

Post by Bbob »

Hi

I tried using this code but it doesnt work :( - I still cant pass the variable of decision (value of button clicked)

Code: Select all

$(document).ready(function()
{
	
	$("#decision input[name=decision]").click(function()
		{
			var answer = $(this).attr('id');
			
		},
		$.post(decision.php',
			   {
				   decision: answer
			   },
			   
			   function(result)
			   {
				   alert(result);
			   }));
});




This is decision.php

Code: Select all

echo $_POST['decision'];
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: How to get value of button in jQuery

Post by pickle »

Sorry, I guess that wasn't 100% clear. jQuery is a javascript library. Therefore, you'll need to include jQuery in your page before the selectors will work.
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
Bbob
Forum Commoner
Posts: 57
Joined: Sat Aug 07, 2010 4:46 am

Re: How to get value of button in jQuery

Post by Bbob »

You mean...

Code: Select all

<script type="text/javascript" src="jquery.js"> </script>

... if this is what your saying, I already have this in my page.
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: How to get value of button in jQuery

Post by pickle »

Ok.

What isn't working? Be specific. Are you getting errors? Do you have Firebug installed? Simply looking over your posted code, I see the highlighting is off due to a missing single quote.
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
Bbob
Forum Commoner
Posts: 57
Joined: Sat Aug 07, 2010 4:46 am

Re: How to get value of button in jQuery

Post by Bbob »

Its working now :D

Thanks for the replies :D

Here the code: (I put the $.post inside the click function )

Code: Select all

$(document).ready(function()
{
	
	$("#decision input[name=decision]").click(function()
		{
			var answer = $(this).attr('id');
			
			$.post('decision.php',
			   {
				   decision: answer
			   },
			   
			   function(result)
			   {
				   alert(result);
			   }
		)});
});
Post Reply