jquery selectors, what is wrong with my code?

Question

What i want to do is that when i click on the button "1" it should display the number "1" in the textbox above it.

what is wrong with my jquery code?

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>JQuery Tutorial</title> <link rel="stylesheet" type="text/css" href="css/style.css"> </head> <body> <input id="textbox" type="text" /> <div> <input id="1" type="button" value="1" /> <input id="2" type="button" value="2" /> <input id="3" type="button" value="3" /> </div> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"> </script> <script type="text/javascript" src="js/ext.js"></script> </body>

My jquery

$('#1').click(function)({ var txt = $('#textbox'); $('#1').html('txt'); });

Never give "integer values" to id's! Read more on: stackoverflow.com/questions/70579/… and stackoverflow.com/questions/1696864/… — user1386320
– user1386320, Commented Jul 9, 2013 at 10:44

Chirag Vidani · Accepted Answer · 2013-07-09 10:52:14Z

Try this code

 $('input[type="button"]').click(function() { var txt = $(this).val(); $('#textbox').val(txt); });

Will explain your problem with your jQuery code:

Line 1: You registered with #1 button so this will be triggered on when button 1 is click, I made it generalised

Line 2: You are getting value from textbox, whereas you are supposed to take value from button text.

Line 3: You are assigning value in button, whereas you are supposed to assign to textbox and always use val() for input type of control and html() for other html container controls

The above were your errors explained.

Queries welcomed!

Fiddle demo

can i ask you something? this maybe pushing it too far, but would you mind helping me learn jquery and programming in general. I can be available whenever you want and we can go over different topics. It would help you get experience of teaching if that is something you want to do, and i can even pay not hourly ( i am still at school but have an interest in programming) but maybe a small amount monthly.
@what I too conduct teaching my existing company and private coaching in past during college :). Can you please contact me on my email ([email protected])?

Awais Qarni · Accepted Answer · 2013-07-09 10:47:47Z

$(function(){ $('input[type="button"]').click(function(){ $('#textbox').val($(this).val()); }); });

mohkhan · Accepted Answer · 2013-07-09 10:48:16Z

You have to get the value using val() method. Also, you are passing variable txt as string to the html() function which is wrong. Try the below...

var txt = $('#textbox').val(); $('#input1').html(txt);

Ayyappan Sekar · Accepted Answer · 2013-07-09 10:49:45Z

0

Try this

 $('input[type="button"]').click(function() { $('#textbox').val($(this).val()); });

answered Jul 9, 2013 at 10:49

Ayyappan Sekar

11.5k2 gold badges22 silver badges22 bronze badges

Comments

user2549616 · Accepted Answer · 2013-07-09 10:54:12Z

You can try this one

$('div').on('click', 'input', function () { $('#textbox').val(this.value); });

Collectives™ on Stack Overflow

jquery selectors, what is wrong with my code?

5 Answers 5

2 Comments

Comments

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

Comments

Comments

Comments

Comments

Linked

Related