-1

How can i use the same div and same div contents and id for different purpose. Eg: If I create drop down with 3 years say 1991,2001 and 2011. Then When i click on 1991, it displays some message, and when i click on 2001 it uses the same div contents and div id but displays some other message .I have to display lot of messages when user clicks on each year. Is there any way to overwrite the same div when user clicks on different year?

user2711295
  • 11
  • 1
  • 7
  • This topic may be useful for you. http://stackoverflow.com/questions/1085801/how-to-get-the-selected-value-of-dropdownlist-using-javascript – wingerse Sep 21 '14 at 09:47
  • you have to just hide and show contents inside div based on the click with particular id using simple if conditions in javascript .. – Rahul Dess Sep 21 '14 at 09:51
  • What have you tried? What does the code look like, and what is the problem with it? – Jukka K. Korpela Sep 21 '14 at 13:27

2 Answers2

1

Yes you can : 

var mydiv = document.getElementById('divId');
var info = mydiv.getElementsByClassName('info')[0];

mydiv.getElementsByTagName('select')[0].addEventListener('change', function() {
    if (this.value == 1) {
        info.innerHTML = "This was the 1 option.";
    } else if (this.value == 2) {
        info.innerHTML = "This was the 2 option.";
    } else if (this.value == 3) {
        info.innerHTML = "This was the 3 option.";
    } else {
        info.innerHTML = "";
    }
});
<div id="divId">
    <select>
        <option value="0">choose an option</option>
        <option value="1">1 option</option>
        <option value="2">2 option</option>
        <option value="3">3 option</option>
    </select>
    <div class="info">
    </div>
</div>
kechol
  • 1,554
  • 2
  • 9
  • 18
GramThanos
  • 3,572
  • 1
  • 22
  • 34
1

If "mydiv" is the id of your div: 

document.getElementById("mydiv").innerHTML= "Whatever you want in the div...";

Or with JQuery:

$("#mydiv").html("Whatever you want here...");

Or if you don't care about ancient browsers:

document.querySelector("#mydiv").innerHTML = "Whatever you want in the div...";
Crowcoder
  • 11,250
  • 3
  • 36
  • 45