CODEWITHSUNDEEP
javascriptinclude
Synturas
Synturas

Reputation: 19

Javascript load html

I just got a problem, i have a select tag with some different options.

Now I want to check which of these options is selected by the user.

Then i want to load a new html file into this site (depends on which options the user has checked) width javascript, how do i do that ?

Here is the select menu

<select>
   <option>option1</option>
   <option>option2</option>
   <option>option3</option>
   <option>option4</option>
   <option>option5</option>
   <option>option6</option>
</select>

Upvotes: 0

Views: 100

Answers (2)

Cak Sup
Cak Sup

Reputation: 17

Jquery is so simple to add this code

  $(function(){
    var includes = $('[data-include]');
    jQuery.each(includes, function(){
      var file = 'views/' + $(this).data('include') + '.html';
      $(this).load(file);
    });
  });
</script>

Use jquery

Upvotes: 1

Pranav Kale
Pranav Kale

Reputation: 639

Consider the html code:

<select onchange="changeIt();" id="formula">
        <option>option1</option>
        <option>option2</option>
        <option>option3</option>
        <option>option4</option>
        <option>option5</option>
        <option>option6</option>

    </select>

Then following javascript code will load new local html pages:

function changeIt()
{
    var fName = document.getElementById("formula");
    var fText = fName.options[fName.selectedIndex].text;
    if(fText=="option1")
    {
        window.location.href = "abc.html";
    }
    else if(fText == "option2")
    {
        window.location.href = "xyz.html";      
    }
}

Both abc.html and xyz.html are local html files.

Upvotes: 1

Related Questions