3 Replies - 234 Views - Last Post: 30 November 2015 - 12:08 PM

#1 thprogrammer  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 25
  • Joined: 22-April 15

JS Function that shows a pic and text for a dropdown list

Posted 29 November 2015 - 05:24 PM

Here is what I am trying to do:
For each item selected in a dropdown list, I want to have a picture of this item, and also some features of it. i will have 3 different items.
I don't know what JS function to use and I am trying to do it without using AJAX. Any helper? I am willing to read any topic that might help me.

Thank you
Is This A Good Question/Topic? 0
  • +

Replies To: JS Function that shows a pic and text for a dropdown list

#2 andrewsw  Icon User is offline

  • lashings of ginger beer
  • member icon

Reputation: 6342
  • View blog
  • Posts: 25,594
  • Joined: 12-December 12

Re: JS Function that shows a pic and text for a dropdown list

Posted 29 November 2015 - 06:06 PM

Investigate the change event of the select element. This fires when the user selects one of the items. In this event you can change the src attribute of an img element, and show and modify other elements.
Was This Post Helpful? 0
  • +
  • -

#3 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 4128
  • View blog
  • Posts: 13,023
  • Joined: 08-June 10

Re: JS Function that shows a pic and text for a dropdown list

Posted 30 November 2015 - 12:31 AM

Quote

I don't know what JS function to use and I am trying to do it without using AJAX.

then you need to have loaded all info for your items when you load the page.
Was This Post Helpful? 0
  • +
  • -

#4 thprogrammer  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 25
  • Joined: 22-April 15

Re: JS Function that shows a pic and text for a dropdown list

Posted 30 November 2015 - 12:08 PM

View Postandrewsw, on 29 November 2015 - 06:06 PM, said:

In this event you can change the src attribute of an img element, and show and modify other elements.

Thank you, that was a good start. But now, instead of display an alert message, I want to fire a picture and a table.
That's what I have so far:

	<body>
	<h2>Select a new car from the list.</h2>

		<select id="CarList" onchange="myFunction()">
		  <option value="Select">Select...</option>
		  <option value="Audi">Audi</option>
		  <option value="BMW">BMW</option>
		  <option value="Volvo">Volvo</option>
		</select>

		<script>
			$(document).ready(function(){
			$("select").change(function(){
			alert("The selected car has been changed.");
			});
			});
		</script>
	</body>

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1