Html Using select to redirect to frame - html

Heres another problem...
What I want to do is target a frame to display with a dropdownbox
<p align="center"><b>Select a Site </b>
<select onchange="window.open(this.value,'','');">
<option value="">Select one</option>
<option value="http://www.altavista.com" target="iframe_a">1</option>
<option value="http://www.yahoo.com" target="iframe_a">2</option>
<option value="http://www.google.com" target="iframe_a">3</option></select>
<input type="button" value="Go"
onclick="window.open(setit.options[setit.selectedIndex].value)">
</p></form>
But when I try this it apperently doesnt work.
Hope somone can find a solution because its kinda enoying me right now.
EDIT:
I know that it is 'window open'
Can somone please correct it, thats why im asking the question.
please give code :D
or example
Cheers, -Geekz

Here's a jsfiddle that does what you want: http://jsfiddle.net/r5RBr/. The key is changing the src of the iframe. Below is the code from the fiddle.
<iframe height="300px" width="500px" id="iframe_a"></iframe>
<form>
<p align="center"><b>Select a Site </b>
<select onchange="document.getElementById('iframe_a').src=this.value">
<option value="">Select one</option>
<option value="http://www.altavista.com" target="iframe_a">1</option>
<option value="http://www.yahoo.com" target="iframe_a">2</option>
<option value="http://www.google.com" target="iframe_a">3</option>
</select>
<input type="button" value="Go" />
</p>
</form>

Related

How to exchange text for a list in HTML?

I am home unemployed due to COVID-19 and with a lot of spare time so I decided to see how hard could it be to modify some MyBB code and I was doing okay until now.
I am sure the answer to my question is out there but I am so lost that I don't even know how to search to fix my problem, I been searching and trying to figure it out for the past 4 hours and at this point, I just don't know what else to try.
Here is the code I want to modify.
<td class="trow2">{$prefixselect}<input type="text" class="textbox" name="subject" size="40" maxlength="85" value="{$subject}" tabindex="1" /></td>
That piece of code is from a MyBB template called "newthread".
The purpose of the code is to type a subject in a textbox in order to post a new thread.
But what I want to do is give the user a drop-down list to choose from instead of typing a text.
Here is the other piece of code I am trying to use without any success.
<input list="browsers">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
If I copy-paste everything that I've tried so far, I will finish this post tomorrow and will make a lot of good HTML developers cringe like never before.
Any help is appreciated. Thanks.
PS: Adding the code to this post was another challenge on its own. XD
Well in my learning journey I came back here. The solution was very simple and here it is.
I replaced this part of the code:
<input type="text" class="textbox" name="subject" size="40" maxlength="85" value="{$subject}" tabindex="1" /></td>
For this code:
<td class="trow2">{$prefixselect}
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>

Required function is not working in HTML form

I already apply <Required> tag in HTML <Select> but not working. The form is still able to proceed to the next step even not select anything at first step. Anyone know to solve it?
<label>Region :</label>
<select id="Region" class="custom-select form-control" required>
<option value="">Select Region</option>
<option value="central" id="Central">Central</option>
<option value="northern" id="Northern">Northern</option>
</select>
Have you declared your web page using HTML5? Make sure you declare the following statement at the beginning of the page
<!DOCTYPE html>
The required attribute is only available in HTML5 and only supported by specific browsers... w3schools Required Attribute
Having tested your original code in HTML5, it works.
You could get rid of the select option tag entirely, and place the value select option in the select tag itself.
<label>Region:</label>
<select value="Select Option" id="Region" class="custom-select form- control" required>
<option value="central" id="Central">Central</option>
<option value="northern" id="Northern">Northern</option>
</select>
Your code works it depends on the browser you use or the way that you are using it. I wrote a sample code for you. Hope it may help you:
<!DOCTYPE html>
<html>
<body>
<form >
<label>Region :</label>
<select id="Region" class="custom-select form-control" required>
<option value="">Select Region</option>
<option value="central" id="Central">Central</option>
<option value="northern" id="Northern">Northern</option>
</select>
<input type="submit">
</form>
</body>
</html>
So in the code above if you do not choose anything it will not let you submit.

Select tag doesn't display on my form

I'm writing a really simple form with 2 text fields and one select. For some reason, the select tag with options doesn't display on my page. I can see the 2 text fields and the label for the the select, but not the select it self.
The app is written in rails and I use materialize.
There might be something too obvious that I don't see it, but after 30mn of thinking, I guess it's fair to put it on SO :)
Thanks
Here's the code:
<form action="/resources" method="post">
<input
type="hidden"
name="authenticity_token"
value="<%= form_authenticity_token %>">
<label for="ressource_name">Ressource Name</label>
<input type="text" id="ressource_name" name="resource[ress_name]" value="<%= #resource.ress_name %>">
<label for="ressource_link">Ressource Link</label>
<input type="text" id="ressource_link" name="resource[link]" value="<%= #resource.link %>">
<label for="categories">Categories</label>
<select id="categories" name="resource[category_id]">
<option value="1">Stuff 1</option>
<option value="2">Stuff 2</option>
<option value="3">Stuff 3</option>
<option value="4">Stuff 4</option>
<option value="5">Stuff 5</option>
<option value="6">Stuff 6</option>
<option value="7">Stuff 7</option>
<option value="8">Stuff 8</option>
</select>
<br>
<input type="submit" value="Post">
</form>
So I put the answer (from Samir) here as well as I guess some other people might come across that issue (it won't change your life, but it might save you some minutes that you want to spend on 'real' issues).
Check the styling! For some reason the select tag was defaulted to {display: none;}
The select tags(likely all select tags) on your page are most likely defaulted to styled to 'display : none' and just in case you cannot find the exact css code that is disappearing the select tag, just cascade the old style by declaring a style attribute on the select element and display it to block. like below
<select style="display: block;">
<option value="" selected>Choose Country</option>
</select>

HTML title for dropdown list

Hi can seem to find the solution for this one, so any help would be appreciated, thanks in advance...
simply put...
<select id="direction" title="Please choose a direction">
<option value="le">Left</option>
<option selected value="st">Striat</option>
<option value="ri">Right</option>
</select>
a simple dropdown, but the title whilst the mouse is over, doesnt show?
am i being a plank?
any ideas?
thanks for replies.
I found a away by putting it in a div and giving the div a title...
<div title="select number">
<select id="select">
<option>one</option>
<option>two</option>
<option>three</option>
</select>
</div>

Need help using an HTML select box on IE8

I used the following HTML code to create a simple drop down menu. (Actully got it from this site by doing a search).
But the issue I'm having is the submit ("Go!") button works in every other browser but IE 8-9. Even works on IE 10 on a Windos Phone. CAn somebody PLEASE tell me what needs to be changed to get it working?
Thanks.
<html>
<body>
<form name="Game Results">
<select name="ddmenu_name" id="ddmenu_name" style="width: 40% !important;">
<option value="" selected>Select Game</option>
<option value="http://thealamedapirates.org/index.php?option=com_content&view=article&id=60&Itemid=82">Week 1</option>
<option value="http://thealamedapirates.org/index.php?option=com_content&view=article&id=61&Itemid=82">Week 2</option>
<option value="http://thealamedapirates.org/index.php?option=com_content&view=article&id=62&Itemid=82">Week 3</option>
<option value="http://thealamedapirates.org/index.php?option=com_content&view=article&id=63&Itemid=82">Week 4</option>
<option value="http://thealamedapirates.org/index.php?option=com_content&view=article&id=64&Itemid=82">Week 5</option>
<option value="http://thealamedapirates.org/index.php?option=com_content&view=article&id=65&Itemid=82">Week 6</option>
<option value="http://thealamedapirates.org/index.php?option=com_content&view=article&id=66&Itemid=82">Week 7</option>
<option value="http://thealamedapirates.org/index.php?option=com_content&view=article&id=67&Itemid=82">Week 8</option>
<option value="http://thealamedapirates.org/index.php?option=com_content&view=article&id=68&Itemid=82">Week 9</option>
<option value="http://thealamedapirates.org/index.php?option=com_content&view=article&id=69&Itemid=82">Week 10</option>
<option value="http://thealamedapirates.org/index.php?option=com_content&view=article&id=70&Itemid=82">Las Vegas</option>
</select>
<input type="button" name="Submit" value="Go!" onClick="window.open(ddmenu_name.value,'newtab'+ddmenu_name.value)">
</form>
</body>
</html>
Being able to refer to an id directly in script was an old IE hack that is not standard, you should use document.getElementById instead.
Change:
<input type="button" name="Submit" value="Go!" onClick="window.open(ddmenu_name.value,'newtab'+ddmenu_name.value)">
To:
<input type="button" name="Submit" value="Go!" onClick="window.open(document.getElementById('ddmenu_name').value,'newtab')">
Also, IE (at least IE8) doesn't support an equal sign in a window name (this will result in a script error), so you'll have to find something safer to use - such as the index of the selected value:
<input type="button" name="Submit" value="Go!" onClick="window.open(document.getElementById('ddmenu_name').value, 'NewTab_' + document.getElementById('ddmenu_name').selectedIndex)">
I'm not sure if this is an IE thing or a standard browser thing.
Working Fiddle