4

Can anyone please tell me why this jsFiddle doesn't work?

The idea is simple is just suppose to input the selected text into the textbox..

HTML:

<input type="text" id="teste" maxlength="50"> <select> <option onClick="nelson">nelson</option> </select>

JavaScript:

function nelson(){ document.getElementById('teste').value =+ "nelson"; }

Thanks in advance

Improve this question
2
  • the onclick is not really javascript, I'd call it html (because it is a html-attribute), therefor not case sensative Commented Aug 9, 2013 at 9:26
  • 1
    Actually, there is no event be fired on selected item. Pre-condition: click on item of select, an alert will be fired. Step 1: choose an item in list -> show alert Step 2: choose that item again, and there is no event fired. This is the behavior of browser. Commented Aug 9, 2013 at 9:29

6 Answers 6

Reset to default
8

DEMO: jsFiddle

HTML:

<input type="text" id="teste" maxlength="50" /> <select onchange="selectedItemChange(this)"> <option value="nelson">nelson</option> <option value="justin">justin</option> </select>

JS:

function selectedItemChange(sel) { document.getElementById('teste').value = sel.value; }

Explanation:

<option onClick="nelson">nelson</option>

  • was changed for three reasons:

    1. onclick is preferred to onClick for consistency
    2. nelson needed to be changed to nelson() to actually call the function.
    3. Since we are dealing with a select html element it is better to use the onchange event on the root.

document.getElementById('teste').value =+ "nelson";

  • As many others have pointed out the proper operator is += or =

To set initial value do the following

DEMO: jsFiddle

HTML

<input type="text" id="teste" maxlength="50" /> <select id="select-people" onchange="selectedItemChange(this)"> <option value="nelson">nelson</option> <option value="justin">justin</option> </select>

JS

function selectedItemChange(sel) { document.getElementById('teste').value = sel.value; } window.onload=function(){ document.getElementById('teste').value = document.getElementById("select-people").value; }
Improve this answer
Sign up to request clarification or add additional context in comments.

6 Comments

This would be better with some explanation. Also note that HTMLSelectElements have a value property: jsbin.com/uboqew/1 (source).
added explanation I hope it helps if you need more i'd be happy to add, also updated code to use sel.value and jsFiddle to match, thanks for the advice there.
this is wrong answer just refresh and then click many times on nelson ...... how anyone accept this answer and persons upvote without checking properly ..... @abc123 brother please solve this issue by just adding first only select with null value
@anupsharma this is because the onchange event only fires when the value changes. I'd recommend setting the initial value when window.load occurs. I didn't include this code because I didn't think it was needed. I believe you just want there to be another option with a null value? can you supply a jsfiddle and i'll update appropriately.
yes brother you are right just need to attach one another option, because our answer's always helpful for new programmers. Then we need to serve our best and error free codes with simplicity. Thanks dear
|
5

There's no operator =+, += is what You need.

Improve this answer

1 Comment

Becouse You only declare this function. You have to call it. For example (with jQuery): $(function() { nelson(); });.
2

First of all the right operator is += not =+.

The reason why this is not working is because your function has to be called :)

Just let the closure be run instantly:

(function nelson(){ document.getElementById('teste').value += "nelson"; })();

or without any function:

document.getElementById('teste').value += "nelson";

or call it anywhere:

nelson();
Improve this answer

3 Comments

on the original code I have (Didn't post it because it's 1500 code lines) I'm using the javascript in a .js page and then call it do the html.. Do I still need to call every single function? (btw this exact same code worked fine all the week :/ )
Functions have to be called, otherwise the code inside the function is never executed. You can pull the code out of the function to let it execute instantly or just let the function execute itself like in my first example.
jsfiddle.net/4NwZ9/19 - thats work even better - I had to change the drop down one left to "No wrap in < body> - can anyone tell me why pls?
1

You id mistake, change =+ to +=.

Try use recommender event for select. It is change.

<input type="text" id="teste" maxlength="50"> <select onchange="nelson(this.value);"> <option>nelson</option> </select>

And JS

function nelson(value){ document.getElementById('teste').value += value; }
Improve this answer

Comments

1

This is your full working solution, it will work with your code 

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <input type="text" id="teste" value="" /> <select onchange="nelson()" id="sel_nel"> <option value="">select</option> <option value="nelson">nelson</option> </select> <script> function nelson(){ document.getElementById('teste').value = document.getElementById('sel_nel').value; } </script> </body> </html>
Improve this answer

1 Comment

now check brother i am sending full code and html with some changes
0

Have a look at this fiddle: I assume you want to change the text-input's value depending on a selection made within the select-tag.

--> http://jsfiddle.net/mQyLG/2/

Update (Explanation):

  1. I set the value of select directly. If you really meant +=, you can change it to input.value = select.value.
  2. I used the onchange event of select instead of a onclick event for every single option. Like this you save a lot of code ;)
  3. I call the method once at start to ensure there's a initial value.
  4. I changed the function's scope to match window. This is not the best idea and should be fit to your actual scope.
Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.