|
HTML - Error When Use Onchange Of Select
I have very simple HTML with javaScript as below, I don't know why there is a error, can you help me?
Code: <HTML>
<HEAD>
<TITLE>Dynamically add Textbox, Radio, Button in html Form using JavaScript</TITLE>
<SCRIPT language="javascript">
function add(type) {
//Create an input type dynamically.
var element = document.createElement("input");
//Assign different attributes to the element.
//element.setAttribute("type", type);
//element.setAttribute("value", type);
//element.setAttribute("name", type);
var foo = document.getElementById("fooBar");
//Append the element in page (in span).
foo.appendChild(element);
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<H2>Dynamically add element in form.</H2>
Select the element and hit Add to add it in form.
<BR/>
<SELECT name="element" onChange="add("button")">
<OPTION value="button">Button</OPTION>
<OPTION value="text">Textbox</OPTION>
<OPTION value="radio">Radio</OPTION>
</SELECT>
<INPUT type="button" value="Add" onclick="add(document.forms[0].element.value)"/>
<span id="fooBar"></span>
</FORM>
</BODY>
</HTML>
Similar TutorialsI have some problems making a converter on my site, so I thought to post here. I think it would be better for me to include the scripts. For example, <FONT SIZE=+1>F: </FONT><INPUT type="text" name="F" value="32" onChange="C.value = (this.value - 2 )"> <FONT SIZE=+1>C: </FONT><INPUT type="text" name="C" value="0" onChange="F.value = (this.value + 2)"> <BR><FONT SIZE=+1>O: </FONT><INPUT type="text" name="O" value="0" onChange=" ???" > If I want to include another onChange property for the "C:" script, like say on change, O.value =(this.value * 2), how do I include this inside the C: string? Also, if I want O: value to be of a certain value (eg. 50) when C.value is 10, what should I put inside the O: script and C: script? Thank you in advance I am very new to using PHP, so the question is: Have an existing HTML web page which has a call to a PHP file to send out email using the form tag and on submit. Wrote a PHP file to get a variable from HTML page, query mysql database and would like to send information back to existing HTML and refresh the HTML page. Is it possible to call this PHP file from the OnChange of the input tag of the variable from HTML page. If not, how can it be called? Dear All, I find that I can do that in firefox, ie 9, but not ie 8 and ie 7. anyone knows the answer. HTML Code: <select id="resourceTypeTree" name="resourceTypeTree">
<script type="text/javascript">obj158= new Object;obj158.sid = 158;obj158.seq = 1;obj158.lv = 1;obj158.lvText = "首頁";obj158.upLvSid = 1;obj158.isShown = 1;obj158.isNetvigated = 1;obj158.url = "/cle/landingPage.php";obj158.remarks = "";obj158.lastUpdate = "2011-04-18 16:15:50";obj158.uiNextSeq = 0;obj158.nextSid = 160;</script>
<option value="158" onclick=selectClick('tree',obj158); >→首頁</option>
<script type="text/javascript">obj3= new Object;obj3.sid = 3;obj3.seq = 2;obj3.lv = 1;obj3.lvText = "語文學習基礎知識";obj3.upLvSid = 1;obj3.isShown = 1;obj3.isNetvigated = 0;obj3.url = "/cle/pages/webSiteReferenceList.php?sid=3&upLvSid=1";obj3.remarks = "";obj3.lastUpdate = "2011-04-18 16:28:05";obj3.uiNextSeq = 7;obj3.nextSid = 160;</script>
<option value="3" onclick=selectClick('tree',obj3); >→語文學習基礎知識</option>
<script type="text/javascript">obj10= new Object;obj10.sid = 10;obj10.seq = 1;obj10.lv = 2;obj10.lvText = "漢字形音義";obj10.upLvSid = 3;obj10.isShown = 1;obj10.isNetvigated = 0;obj10.url = "/cle/pages/webSiteReferenceList.php?sid=10&upLvSid=3";obj10.remarks = "";obj10.lastUpdate = "2011-03-16 13:46:44";obj10.uiNextSeq = 10;obj10.nextSid = 160;</script>
<option value="10" onclick=selectClick('tree',obj10); >→→漢字形音義</option>
<script type="text/javascript">obj38= new Object;obj38.sid = 38;obj38.seq = 1;obj38.lv = 3;obj38.lvText = "漢字的演變";obj38.upLvSid = 10;obj38.isShown = 1;obj38.isNetvigated = 1;obj38.url = "/cle/pages/webSiteReferenceList.php?sid=38&upLvSid=10";obj38.remarks = "";obj38.lastUpdate = "2011-03-16 14:25:54";obj38.uiNextSeq = 0;obj38.nextSid = 160;</script>
<option value="38" onclick=selectClick('tree',obj38); >→→→漢字的演變</option>
<script type="text/javascript">obj39= new Object;obj39.sid = 39;obj39.seq = 2;obj39.lv = 3;obj39.lvText = "字形的正體、俗體、異體";obj39.upLvSid = 10;obj39.isShown = 1;obj39.isNetvigated = 1;obj39.url = "/cle/pages/webSiteReferenceList.php?sid=39&upLvSid=10";obj39.remarks = "";obj39.lastUpdate = "2011-03-16 14:25:54";obj39.uiNextSeq = 0;obj39.nextSid = 160;</script>
<option value="39" onclick=selectClick('tree',obj39); >→→→字形的正體、俗體、異體</option>
</select>
Regards, Man Pak Hong, Dave manpakhong@hotmail.com Hi Folks, I've got my form dynamically generating text fields (which are contained in a form which is in another) and other objects and now I want to give them the "onchange" attribute. I have a lot of code so I'll keep it as small as possible. Here is the function that generates text fields function createText( inputForm, txtName, txtValue, txtWidth ) { var newTxt = document.createElement( "INPUT" ); inputForm.appendChild( newTxt ); newTxt.name = txtName; newTxt.setAttribute( "STYLE", "position:relative; left:20px; width:" + txtWidth + "px;"); newTxt.type = "TEXT"; newTxt.value = txtValue; newTxt.id = txtName; newTxt.onchange = "some_function( this.value )"; return newTxt; } The function for responsible for creating the form is: function createNewForm() { // Main form is a global reference to the main body mainForm = document.getElementById( "adminForm" ); var profileForm = document.createElement( "FORM" ); mainForm.appendChild( profileForm ); profileForm.method = "POST"; profileForm.name = "Profile"; profileForm.id = "ProfileForm"; return profileForm; } This function calls the profile creation form and specifies the objects that will appear on the form. function profileForm() { // Delete and reassign current form if( currentForm != "") deleteForm( currentForm ); currentForm = "ProfileForm"; var newProForm = createNewMenuForm(); newProForm ( menuForm, "Item1", "data1", 140 ); newProForm ( menuForm, "Item2", "data2", 140 ); newProForm ( menuForm, "Item3", "data3i", 140); return newProForm; } I've seen examples of objects being created by JavaScript and they work just fine. Anyone have any suggestions or have an idea where I can find some more info? Thanks! Code: Parse error: syntax error, unexpected T_DNUMBER in /home/a6989956/public_html/include/database.php on line 24 Can anyone please tell me whats wrong? Here is line a few lines Code: class MySQLDB
{
var $connection; //The MySQL database connection
var $num_active_users; //Number of active users viewing site
var $num_active_guests; //Number of active guests viewing site
var $num_members; //Number of signed-up users
/* Note: call getNumMembers() to access $num_members! */
/* Class constructor */
function MySQLDB(){
/* Make connection to database */
$this->connection = mysql_connect(hostname, username, ********) or die(mysql_error());
mysql_select_db(database, $this->connection) or die(mysql_error());
/**
* Only query database to find out number of members
* when getNumMembers() is called for the first time,
* until then, default value set.
*/
$this->num_members = -1;
if(TRACK_VISITORS){
/* Calculate number of users at site */
$this->calcNumActiveUsers();
/* Calculate number of guests at site */
$this->calcNumActiveGuests();
}
}
line 24-25 is Code: $this->connection = mysql_connect(hostname, username, ********) or die(mysql_error());
mysql_select_db(database, $this->connection) or die(mysql_error());
PLEASE HELP! Hi, I have a problem with validating Strict XHTML 1.0 ... The tag: "option" doesn't have an attribute: "onchange" in currently active versions.[XHTML 1.0 Strict]... Is there a way around this? Here's the code:. <select name="birth_month" onchange="form_d('yes');" size="1" style="width:8em"> <option<?php echo empty($a_birth_month)?' selected="selected"':''?> value="" onchange="form_d('yes');" >Month</option> Thanks Only another million pages to go. Hi all, I'm trying to make a select choose the text that shows on the page (blue rectangle). Also, when i click the text, it's supposed to copy to some other part of the page. It works when i load the page, but when I change the item in the select, it stops working, and I'm not sure why. Any guesses? Thanks!!! the code is the following: Code:
<html lang="en-US">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
hide = false;
set_text();
$('#items').change(function(){
set_text();
});
//hide==true? $('#top_suggestions').hide(600): '';
$('.list').click(function(){
console.log('click');
text=$(this).html();
$(annotation).html(text);
});
$('.list').mouseover(function(){
$(this).css('cursor', 'hand');
$(this).css('color', 'red');
});
$('.list').mouseleave(function(){
$(this).css('cursor', 'auto');
$(this).css('color', 'black');
});
function set_text(){
text = "";
id = $('#items').get(0).value;
text = $('#'+id).html();
console.log(text);
$('#top_suggestions').html(text).show();
}
});
</script>
<style type="text/css" media="screen">
body {
font: 11px arial;
}
.suggest_link {
background-color: #FFFFFF;
padding: 2px 6px 2px 6px;
}
.suggest_link_over {
background-color: #3366CC;
padding: 2px 6px 2px 6px;
}
#search_suggest {
position: absolute;
background-color: #FFFFFF;
text-align: left;
border: 1px solid #000000;
}
#top_suggestions {
background-color: lightblue;
width: 50%;
}
</style>
</head>
<body>
<h1>THIS PAGE</h1>
<!-- table -->
<table border="0" width="100%">
<tr>
<td valign=top><b> Reas:</b> <!-- annotation pannel -->
</td>
<td width=100% colspan='2'>
<textarea style='width:50%;' name='annotation' rows="2" maxlenght='256' id='annotation'></textarea>
</td>
</tr>
<tr>
<td>
 
</td>
<td align=left>
<input type='submit' value='Go' style='margin-left: -2px;' ></input>
</td>
</tr>
</table>
<hr>
<table border="0" width="100%">
<tr>
<td valign=top><b> Suggestions:</b> <!-- annotation pannel -->
</td>
<td width=100% colspan='2'>
<select id="items">
<option value="s1">Top 5 MOST used for ALL guy</option>
<option value="s2">Top 5 LAST used for ALL guy</option>
<option value="s3">Top 5 MOST used for THIS guy</option>
<option value="s4">Top 5 LAST used for THIS guy</option>
</select>
</td>
<tr>
<td></td>
<td>
<div id='top_suggestions' >
 
</div>
</td>
</tr>
</tr>
</table>
<span id='s1' style='display: none;'>
<div class=list>Non curo. Si metrum non habet, non est poema.1 </div>
<div class=list>Non curo. Si metrum non habet, non est poema.2 </div>
<div class=list>Non curo. Si metrum non habet, non est poema.3 </div>
<div class=list>Non curo. Si metrum non habet, non est poema.4 </div>
<div class=list>Non curo. Si metrum non habet, non est poema.5 </div>
</span>
<span id='s2' style='display: none;'>
<div class=list>Balaenae nobis conservandae sunt1 </div>
<div class=list>Balaenae nobis conservandae sunt2 </div>
<div class=list>Balaenae nobis conservandae sunt3 </div>
<div class=list>Balaenae nobis conservandae sunt4 </div>
<div class=list>Balaenae nobis conservandae sunt5 </div>
</span>
<span id='s3' style='display: none;'>
<div class=list>lalala1 </div>
<div class=list>lalala2 </div>
<div class=list>lalala3 </div>
<div class=list>lalala4 </div>
<div class=list>lalala5 </div>
</span>
<span id='s4' style='display: none;'>
<div class=list>The quick brown fox jumps over the lazy dog1 </div>
<div class=list>The quick brown fox jumps over the lazy dog2 </div>
<div class=list>The quick brown fox jumps over the lazy dog3 </div>
<div class=list>The quick brown fox jumps over the lazy dog4 </div>
<div class=list>The quick brown fox jumps over the lazy dog5 </div>
</span>
</body>
</html>
Hi All, Actually I have to develope a javascript function for moving items from from select box to another select box,I finished that,finally client wants to include a reset button in the same form ,if we click on reset button both select boxes in the form has to store the default values which were at the page loading. Please solve this ..Very Urgent..... Thanks in advance.... ---------- JP. Hi, I have one select box and for that 30 options are there, but i need to display only 5 with vertical scroll bars when user clicks on select box. How is it possible? Please help. Hi all, I have a select box in an html form which simply doesn't appear in ie6. I dont know what is relevant to this problem, but loosely, the layout is as follows: <div id="content"> <form> <p class="label"><label for="allocation">Label</label></p> <p class="input"><select name="allocation" id="allocation"> <option value="0">option1</option> ... </select> <div class="clear"></div> </form> </div> the label paragraph is floated left and input floated right, clear simply clears the floats. Other things in the form include tinyMCE textareas and textboxes. The submit button has an onclick handler that validates before returning true or false for php to put values into a mysql database. Everything else works fine but the select box is simply not there in ie6. Any help would be greatly appreciated, Thanks, Conrad this may seem rather rudimentary, however, I have googled it to no avail. I want to be able to put "Choose One" or some other message as the default selected option in a select box, but I do not want the user to be able to pick this option. Any ideas on how to make that work? Looking for the simplest way possible. Was thinking using javascript on a focus event or something like that and deleting the option using javascript. Hopefulyl it doesn't come to that. Thanks for the help in advance. mike I have a select list on my site that has around 12 entries in it. The problem is that every 5 entries there is a white space entered into the list that I do not want to be there. The only white space I wanted was the very first option I wanted to be white space for a default not entered option in the select list. Does anyone know how to make this problem go away? Hi All, I am new to web development.I would like to know how to optimize the <select> tag based on my requirement By default <select> tag lists contents based on the context(ie. if I type A it will list all possible combinations with A like AA,Aa,Ab,AB,Ac,AC and so on(not in the same order)).Similarly if I type Ab it should list all combinations starting with Ab which it does but the problem is you have to be little quick here otherwise if I press A and wait some time and then press B then I wil get all contents starting with B and not with AB which is what was intented.Is there an alternate to this so that whatever I type will get the apt search results. I got something like this on posting some popular websites: http://extjs.com/deploy/dev/examples/form/combos.html Unobtrusive Transformed select: is what I exactly need.But it did not work exactly.Can anyone help me getting the same without much complexities.I am a Java programmer with very little knowledge of web design and development.Can anyone help? i m trying to put img with in select tag but its not displaying the right image please look to a code n tell me the right way of doing it thank you see its working with rest of the color's like red pink etc not with the image which i want to get changed to my backgorund Code: <HTML>
<HEAD>
<TITLE></TITLE>
<script language="javascript">
function ChangeColor(color)
{
document.bgColor=color;
}
</script>
</HEAD>
<BODY>
<H3>color changer</H3>
<p>
<select name="bgchanger" onchange="ChangeColor(value)">
<option value="">select a color</option>
<option value="white">white</option>
<option value="gray">gray</option>
<option value="pink">pink</option>
<option value="magenta">magenta</option>
<option value="red">red</option>
<OPTION VALUE="a"><img src="F:\a.jpeg">a</option>
</select>
</p>
<p> </p>
</BODY>
</HTML>
i gave the right path but still nt showing please correct me Hi: I have a 'Select' Box with approx 60 options to select from. Problem (in IE6 and IE7): When I click on the button to open up the list of options, the list shoots to the top of my monitor screen instead of opening up *below* the input postition on the screen. This does not happen on FireFox or Safari --- only IE (6 and 7) Question: Is there anything I can do to correct this behavior. Thank you. -Mel Smith Good morning! I have a problem with a couple of select boxes. I need more than one, due to the size of the list, but I want it so if they choose an option in the first box, then choose an option in the second box, it will deselect the option in the first one. So for example, if these are nested side by side in a table... <td width="20%"><form> <select name="selectMain" size="16" id="selectMain" onChange=" if ( value == 0){ selects (id);} if ( value == 1){ selectc ('Test1',id);} if ( value == 2){ selectc ('Test2',id);} if ( value == 3){ selectc ('Test3',id);} "> <option value="1">Test 1</option> <option value="2">Test 2</option> <option value="3">Test 3</option> </select> </form> </td> <td width="20%"><form> <select size="16" id="selectMain" onChange=" if ( value == 0){ selects (id);} if ( value == 4){ selectc (Test4',id);} if ( value == 5){ selectc ('Test5',id);} if ( value == 6){ selectc ('Test6',id);} "> <option value="17">Test 4</option> <option value="18">Test 5</option> <option value="19">Test 6</option> </select> </form> </td> If someone chooses Test 1 in the first box, it highlights it and displays that content. And if they choose Test 4 it removes the Test 1 content, highlights and displays the Test 4 content. But it leaves Test 1 highlighted as well. There is a lot of missing code here... But hopefully you get the picture. Is there a way to make it so that when they choose Test 4 it will remove the highlighting from Test 1 in the first form? Thanks so much for your help! I have been beating my head on a wall! =D Is there anyway to place images (along with text) in a select tag? I have a select box with restricted width, due to page layout, and the options listed are wider than the select box. This displays fine in Firefox, because as you open the drop-down the options are displayed full-length. However, IE cuts off the option text at the width of the select box. Consider this example: HTML Code: <html>
<head></head>
<body>
<select name="mySelect" style="width:160px;">
<option>This is a really long select box option</option>
</select>
</body>
</html>
Is there a way to get IE to display the entire text? Thanks! Hi all! I have two <select>, and, depending on what the user selects in the first one changes the options in the second. For example is the 1st <select> is HONDA, the 2nd <select> will automatically become a list of: ACCORD, CIVIC, etc. But it the 1st is FORD, the 2nd automatically has a list of F-150, MUSTANG, etc -- when the user views it. Is this done in just HTML or do I need a different scripting? If so, would you tell me where I should look? Much appreciated! |
|||||||