Win a copy of Design for the Mind this week in the Design forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

refresh variables after changing select option

 
Irina Ivanova
Greenhorn
Posts: 2
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I have a select with many options and I have an input text field that should depend on select option. So when I choose some option the next input field in the form should be changed.

Here is the select code:


and here is the text input code:


But in the select tag there is missing onChange value, because I don't know, how to do that
Almost all solutions that I could find are in PHP, but I do not have possability use PHP. Also solution with specifing the page URL is not suitable, becouse this is not just page, but browser extension.

Can somebody help with this JavaScript function?
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64708
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
First of all, don't use document.write(). Not only is it a dinosaur, it will replace the current page with the HTML you specify. Clearly, not what you want.

But in the select tag there is missing onChange value, because I don't know, how to do that

The easiest way (but not the best -- but let's take it slow for now) is to create a JavaScript function, and to call it in the onchange attribute:

and


Almost all solutions that I could find are in PHP

PHP is useless as it's a server-side technology and you need client-side code. So JavaScript is the right way to go. Likely, those examples are old -- from before JavaScript became capable enough, and we had to make a server round trip to make any changes to the page. Luckily, those days are long gone.

You should give the input element an id value, and then you can change its value with:

That should get you started.

It sounds like you are very new to JavaScript. You should get a good tutorial or book (make sure it's modern) to make sure you understand the basics.

Once you understand the basics, then you can start using a library like jQuery that makes all of this much easier.
 
Irina Ivanova
Greenhorn
Posts: 2
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thank You very much! Your advices were very helpful, now it works.

The code is now looking like this:
The select element:


The JS function:


And the input field is just input field.
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic