JavaScript - Need An Onmouseover() Equivilant To Onchange() Function Listed
Hey all,
I have a little function that performs when a form item is selected. I would like to give the form items all at once and have the function perform when the user mouses over an item in the displayed list. Here is the form code: Code: <form> <select onchange="showRSS(this.value)"> <option value="">Select an RSS-feed:</option> <option value="Google">Google News</option> <option value="MSNBC">MSNBC News</option> </select> </form> thanks a bunch, Brian p.s. I tried this but it didn't work Code: <?php echo("<a href=\"http://www.msn.com\" onMouseover=\"showRSS(this.MSNBC)\">MSNBC News</a>");?> <br /> <?php echo("<a href=\"http://www.google.com\" onMouseover=\"showRSS(this.Google)\">Google News</a>");?> <br /> Similar TutorialsHow can i change this code to do not duplicate the boxes when one option is selected in the same box as before? http://www.plpgolfandturf.com.au/rr/rrboxes_test.php Code: <script type="text/javascript"> function SetHTML2(type) { //document.getElementById("1").style.display = "none" //document.getElementById("2").style.display = "none" //document.getElementById("3").style.display = "none" //document.getElementById("4").style.display = "none" //document.getElementById("1.1").style.display = "none" //document.getElementById("1.2").style.display = "none" //document.getElementById("1.3").style.display = "none" //document.getElementById("1.4").style.display = "none" document.getElementById("2.1").style.display = "none" document.getElementById("2.2").style.display = "none" document.getElementById("2.3").style.display = "none" document.getElementById("2.4").style.display = "none" document.getElementById("3.1").style.display = "none" document.getElementById("3.2").style.display = "none" document.getElementById("3.3").style.display = "none" document.getElementById("3.4").style.display = "none" document.getElementById("4.1").style.display = "none" document.getElementById("4.2").style.display = "none" document.getElementById("4.3").style.display = "none" document.getElementById("4.4").style.display = "none" document.getElementById("1.1.1").style.display = "none" document.getElementById("1.1.2").style.display = "none" document.getElementById("1.1.3").style.display = "none" document.getElementById("1.1.4").style.display = "none" document.getElementById("1.2.1").style.display = "none" document.getElementById("1.2.2").style.display = "none" document.getElementById("1.2.3").style.display = "none" document.getElementById("1.2.4").style.display = "none" document.getElementById("1.3.1").style.display = "none" document.getElementById("1.3.2").style.display = "none" document.getElementById("1.3.3").style.display = "none" document.getElementById("1.3.4").style.display = "none" document.getElementById("1.4.1").style.display = "none" document.getElementById("1.4.2").style.display = "none" document.getElementById("1.4.3").style.display = "none" document.getElementById("1.4.4").style.display = "none" document.getElementById(type).style.display = "" } </script> <!--Display box --> <font face="Verdana, Geneva, sans-serif" size="4" color="#FF0000"><br /> Search Parts</font><br /> <br /> <select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1">Beck</option> <option value="2">BobCat</option> <option value="3">Briggs</option> <option value="4">Yazoo</option> </select> <span id="1" style="display:none" ><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1.1">Beck 1</option> <option value="1.2">Beck 2</option> <option value="1.3">Beck 3</option> <option value="1.4">Beck 4</option> </select></span> <span id="2" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="2.1">BobCat 1</option> <option value="2.2">BobCat 2</option> <option value="2.3">BobCat 3</option> <option value="2.4">BobCat 4</option> </select></span> <span id="3" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="3.1">Briggs 1</option> <option value="3.2">Briggs 2</option> <option value="3.3">Briggs 3</option> <option value="3.4">Briggs 4</option> </select></span> <span id="4" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="4.1">Yazoo 1</option> <option value="4.2">Yazoo 2</option> <option value="4.3">Yazoo 3</option> <option value="4.4">Yazoo 4</option> </select></span> <span id="1.1" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1.1.1">Beck 1.1</option> <option value="1.1.2">Beck 1.2</option> <option value="1.1.3">Beck 1.3</option> <option value="1.1.4">Beck 1.4</option> </select></span> <span id="1.2" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1.2.1">Beck 2.1</option> <option value="1.2.2">Beck 2.2</option> <option value="1.2.3">Beck 2.3</option> <option value="1.2.4">Beck 2.4</option> </select></span> <span id="1.3" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1.3.1">Beck 3.1</option> <option value="1.3.2">Beck 3.2</option> <option value="1.3.3">Beck 3.3</option> <option value="1.3.4">Beck 3.4</option> </select></span> <span id="1.4" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1.4.1">Beck 4.1</option> <option value="1.4.2">Beck 4.2</option> <option value="1.4.3">Beck 4.3</option> <option value="1.4.4">Beck 4.4</option> </select></span> <span id="2.1" style="display:none"> text </span> <span id="2.2" style="display:none"> text </span> <span id="2.3" style="display:none"> text </span> <span id="2.4" style="display:none"> text </span> <span id="3.1" style="display:none"> text </span> <span id="3.2" style="display:none"> text </span> <span id="3.3" style="display:none"> text </span> <span id="3.4" style="display:none"> text </span> <span id="4.1" style="display:none"> text </span> <span id="4.2" style="display:none"> text </span> <span id="4.3" style="display:none"> text </span> <span id="4.4" style="display:none"> text </span> <span id="1.1.1" style="display:none"> text </span> <span id="1.1.2" style="display:none"> text </span> <span id="1.1.3" style="display:none"> text </span> <span id="1.1.4" style="display:none"> text </span> <span id="1.2.1" style="display:none"> text </span> <span id="1.2.2" style="display:none"> text </span> <span id="1.2.3" style="display:none"> text </span> <span id="1.2.4" style="display:none"> text </span> <span id="1.3.1" style="display:none"> text </span> <span id="1.3.2" style="display:none"> text </span> <span id="1.3.3" style="display:none"> text </span> <span id="1.3.4" style="display:none"> text </span> <span id="1.4.1" style="display:none"> text </span> <span id="1.4.2" style="display:none"> text </span> <span id="1.4.3" style="display:none"> text </span> <span id="1.4.4" style="display:none"> text </span> <br /> <br /><a href="http://www.plpgolfandturf.com.au/rr/rrboxes_test.php"><img src="http://www.plpgolfandturf.com.au/rr/bt2.png" border="0" /></a> Hi all, I'm new to javascript and am having a few issues. I have a function that I want to run with multiple onchange events. My page has several image selection buttons and I want it to preview the image when/if each one is selected. I have gotten it working for the first on the page but cannot for the remainder. Is this possible or am I wishful thinking? Foster Reply With Quote 01-17-2015, 10:23 AM #2 Arbitrator View Profile View Forum Posts Senior Coder Join Date Mar 2006 Location Splendora, Texas, United States of America Posts 3,423 Thanks 32 Thanked 293 Times in 287 Posts Originally Posted by Foster I'm new to javascript and am having a few issues. I have a function that I want to run with multiple onchange events. My page has several image selection buttons and I want it to preview the image when/if each one is selected. I have gotten it working for the first on the page but cannot for the remainder. Is this possible or am I wishful thinking? Where's the code? If you simply want to assign multiple listeners for the same event on a single element, use element.addEventListener("change", eventHandler) instead of element.onchange = eventHandler or <element onchange="eventHandler();"></element>. Hi there, I have a drop down menu that runs a function when one of the options are chosen. Is there a way to have this run from individual links? <select name="users" onChange="showUser(this.value)"> <option value="">Select a Deer:</option> <option value="1">8002</option> <option value="2">8009</option> <option value="3">8011</option> Thanks Rich I probably have gone about this all wrong since I am a complete noobe, but if someone could point me in the right direction I would be very thankful. Here is the situation. What works: I have a drop menu that is being generated by a PHP/MYSQL script, when you choose an option the onchange event is triggered and runs a function that sends the value to a php script so a graphical image can be generated and saved with a random file name. The randomly generated image name is sent back as an XML response and then image is displayed with src The Problem: I need to be able to have a function store the value from the onchange event and run again when the page refreshes. As of right now, when the page refreshes the image is gone. I have attempted to do this with cookies, but not exactly sure how I will do this and I have finally decided to ask for help. I hope my explanation is not confusing, please let me know if you need more info or if you need to see my code. I have six small images. Depending on which image a user hovers over, I would like a seventh image (a simple box) to change as well. For example, if a user hovers over image1, I want the seventh image to be a red box. If a user hovers over image2, the seventh image should be a blue box. Simple huh? So the seventh image changes color based on which of the six smaller images the user hovers over. ------------- So far, my current code only allows me to hover over any of the six images, and the seventh image always changes to the same image color. Code is below. Any help would be appreciated. Code: <script type="text/javascript"> function hoverBox() { var boxNumber; document.getElementById("info").src = "Images/infoRedColor.png"; } function hoverBoxOut() { document.getElementById('info').src = "Images/info.png;" } </script> </head> <body> <div id="wrapper"> <a href=""> <img class="box1" src="Images/box1.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()" onmouseout="this.src='Images/box1.png'; hoverBoxOut()" ></a> <a href=""> <img class="box2" src="Images/box2.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()" onmouseout="this.src='Images/box2.png'; hoverBoxOut()"></a> <a href=""> <img class="box3" src="Images/box3.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()" onmouseout="this.src='Images/box3.png'; hoverBoxOut()"></a> <a href=""> <img class="box4" src="Images/box4.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()" onmouseout="this.src='Images/box4.png'; hoverBoxOut()"></a> <a href=""> <img class="box5" src="Images/box5.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()" onmouseout="this.src='Images/box5.png'; hoverBoxOut()"></a> <a href=""> <img class="box6" src="Images/box6.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()" onmouseout="this.src='Images/box6.png'; hoverBoxOut()"></a> <!-- Seventh Image --> <img id="info" src="Images/info.png" border="0"> </div> </body> hi. how can i get the value of title of<td> on onmouseover function. something like that. Code: <td title="mytitle" onMouseOver="func(this.title);"></td> can i do this. plzzzz help me I have the following form working with on onsumbit function, but I would like to change it so that instead of having to click the purchase button to see total price, you only have to change the quanity text box input. I would welcome any help. I just can not seem to get it to work. Code: <script language="javascript" type="text/javascript"> function checkQuantity(frm) { var succesful = false; var numQuantity; numQuantity = parseInt(frm.Quantity.value); var numTotalPrice; if (numQuantity != 0) { numTotalPrice = numQuantity * 4; frm.TotalPrice.value = numTotalPrice; //new String(numTotalPrice); successful = true; } else { alert("Sorry must order more than 0"); successful = false; } return succesful; } </script> Code: <form action="" onsubmit="return checkQuantity(this)" style="width: 193px"> <table cellpadding="4" style="width:111%"> <tr> <td class="style1"> Quanity:</td> <td class="formInputCell"> <input name="Quantity" type="text" style="width: 55px" /></td> </tr> <tr> <td class="style1"> Total Price $ </td> <td class="formInputCell"> <input name="TotalPrice" type="text" style="width: 55px" /></td> </tr> <tr> <td class="style2"></td> <td><input id="Submit1" type="submit" value="Buy Now" class="buttonstyle" /></td> </tr> </table> </form> Hi, I hope someone can help me figure this out - it's been bugging me for a whole day now, and I can't seem to figure it out, and so far no Google research found this exact problem for me... Situation: I have a simple HTML page with one DIV element with the id "rotator". Inside that, JavaScript is supposed to create boxes that react to mouseovers. The weird thing is: The whole script works, but ONLY on the LAST box I create, no matter what I do. I can manually add the mouseover code to any one of these boxes, but it will only take on the last one. I can have JavaScript tell me the mouseover status of each box, and they all tell me they have code assigned correctly - but again only the last one works... Here's the relevant code (yes, highly abbreviated, but it's the part that fails on me): Code: var maxBoxes = 10; function initSite() { var rotator = document.getElementById("rotator"); rotator.innerHTML = ""; for (x = 0; x < maxBoxes; x++) { rotator.innerHTML +='<div id="myBox' + x + '"></div><div id="myDark' + x + '"></div>'; // various other stuff about myBoxes[x] also in here, but not relevant to the issue I think applyMouseActions(document.getElementById("myDark" + x); debugOutput(document.getElementById("myDark" + x).id+"=" + document.getElementById("myDark" + x).onmouseover + "<br>", 1); } } function applyMouseActions(item) { if (!item) return; item.onmouseover = function(ev) { alert("does this work?"); var thisNum = this.id; thisNum = thisNum.charAt(this.id.length-1); var tempBox = myBoxes[thisNum].boxOb; tempBox.style.background = "#fff"; } item.onmouseout = function(ev) { var thisNum = this.id; thisNum = thisNum.charAt(thisNum.length-1); var tempBox = myBoxes[thisNum].boxOb; tempBox.style.background = "#aaa"; } } initSite is called in the body onload. All kinds of other animation parts are implemented that work fine, just this mouseover won't work. I have tried re-writing it in multiple different ways, including "xyz.onmouseover = myMouseCode" and then defining the function separately later - still no dice. So, the code creates 10 boxes (0-9) and 10 boxes that are on top of them to create a form of shadow effect depending on the position of the original boxes. Since the "myDark" boxes are on top of the "myBox" boxes, I apply the onmouseover onto the "myDark" boxes, but it only works on "myDark9" and no other box. They are all created the same way, the mouseover assigned the same way... All I can do is shake my head at it, but that doesn't fix the issue, obviously ;-) Any idea what else I can try? Thanks! JavaScript Code: window.addEvent('domready',function(){ //SAMPLE 8 var handles8_more = $$('#handles8_more span'); var nS8 = new noobSlide({ box: $('box8'), interval: 5000, autoPlay: true, items: $$('#box8 h3'), size: 900, handles: $$('#handles8 span'), handle_event: 'mouseenter', addButtons: { previous: $('prev8'), play: $('play8'), stop: $('stop8'), playback: $('playback8'), next: $('next8') }, onWalk: function(currentItem,currentHandle){ //style for handles $$(this.handles,handles8_more).removeClass('active'); $$(currentHandle,handles8_more[this.currentIndex]).addClass('active'); //text for "previous" and "next" default buttons $('prev8').set('html','<< '+this.items[this.previousIndex].innerHTML); $('next8').set('html',this.items[this.nextIndex].innerHTML+' >>'); } }); //walk to item 0 witouth fx nS8.walk(0,false,true); }); html Code: <div class="slider sample8"> <p class="buttons" id="handles8"> <span>Item 1</span><span>Item 2</span><span>Item 3</span><span>Item 4</span><span>Item 5</span> </p> <div class="mask1"> <div id="box8"> <div onMouseOver="nS8.Stop();" onMouseOut="nS8.Play();"> </div> </div> </div> <p class="buttons"> <span id="prev8"><< Previous</span> | <span id="next8">Next >></span> </p> <p class="buttons"> <span id="playback8">< Playback</span> <span id="stop8">Stop</span> <span id="play8">Play ></span> </p> </div> All I need to do is when they hover ocer the div statement stop the program from looping. and then when they stop hovering over it let it start looping again. Is it possible to set onmouseover only in js file without running the function on html code? P.S. I found a coding thread here but I don't understand it and it's too old (2005 archive). Thank you very much I've got this listbox full of hundreds of employee names. Clicking on a name executes a function using onchange. Because of the length of the list I decided a search function would be really handy and I finally found one that works. Now the search function, when you type in the input box, scrolls the list to the first matching entry. And that's good, that's what I wanted. The problem comes in when you try to click on the name the search function found. Nothing happens ofcourse because the onchange tag in the list reacts to changes, not direct clicks. <select onchange="display.apply(this, this.value.split(','))" multiple="multiple" id="People" name="People" style="border-style: none; height:260px; width:220px; margin-bottom: 15px;"> <option selected="selected">Loading</option> </select> The list is populated by java but for testing I disabled the function that clears the "Loading" option and I set it to selected. That way the loading option is highlighted by default and the search function is free to highlight something else, then when I click on the search result it works like it's supposed to. But keeping a highlighted option at the top of the list for that sole purpose isn't very elegant, especially since if you click on it the onchange function tries to execute and generates errors. The only solution I can think of is to use java to generate another option way at the bottom of the list that has the selected attribute but I don't quite know how to do that. Does anyone have any thoughts on what I can do? I have a onChange value
Code: var people = [ ["Timothy Conner", "1999-Present", "Age: 12", "Male", ""], ["Andrew Conner", "1992-Present", "Age: 19", "Male", ""] ]; var how = "Brothers"; function find() { if(document.getElementById("name").value == people [0] [0]) { document.getElementById("desc").value = people [0] [1] + " " + people [0] [2] + " " + people [0] [3]; } if(document.getElementById("name").value == people [1] [0]) { document.getElementById("desc").value = people [1] [1] + " " + people [1] [2] + " " + people [1] [3]; } document.getElementById("relateb").value = document.getElementById("name").value; } Code: Name: <input type="text" id="name" value="" onChange="find()"/> So for it to proses a name you must click out of a box is ther a way to make it instead of when you click out of it, it would immidiatly change? Hi folks. I'm working on a calculator and need to use the 'onchange' function. Basically, the user selects the year (id=taxYear) and once the year is select (default is 2008) this year will appear in 2 different lines of the page under 2 seperate ID's(ageYear & totalYear). I've looked at a few example of the function but I'm still not sure how to approach it. At the moment the year changes once I hit the 'calculate' button but the onChange would obviously offer a better alternative with the date changing once 'taxYear' is changed. here is the script; Code: //check the year var taxYear = document.getElementById('taxYear').options[document.getElementById('taxYear').selectedIndex].value; document.getElementById('ageYear').innerHTML = taxYear; document.getElementById('totalYear').innerHTML = taxYear; Here is the jsp; Code: <tr> <td align="left" width="203" colspan=""><p> Your Tax Year: </p></td> <td align="left" > <s:select name="taxYear" id="taxYear" list="#{'2008':'2008', '2009':'2009'}" theme="simple" />* </td> </tr> <tr> <td align="left" width="203"><p> Age at December 31st <span id="ageYear"></span></p></td> <td align="left" colspan="1"> <s:textfield name="age" id="age" theme="simple" cssClass="text" value="30" /> * <div id="errorage" class="warningmessage" style="display:none"> Please enter your Age to proceed. </div> </td> </tr> <tr> <td colspan="2" class="basicboldtext"> <br/> The total pension contribution you can make for year <span id="totalYear"></span> is €<span id="totalTax2"></span> <br/> </td> </tr> Appreciate any help on this! Code: <input type = "text" style ='display:none;' onchange="display_data_from_server(this.value)"/> Value inside that input is cahanged from js. Is there any reason that onchange would not happen ? i mean, it does not. HI, i know very little about javascript, just enough to get me into trouble actually lol. Here is what im working with. I have a custom Instant messenger for members. It uses embed object macromedia as well as javascript to diplay the window and send messages. What i want to do is simply add an onchange that when one person is typing it shows they are typing (ie xxxxx is typing....) My experience is in php and html and i looked thru the script and the javascript functions but im not sure what im looking for exactly. Do i need to have access to the swf or fla file and be able to edit them to do this? I dont see any form inputs or i would know exactly where to put the onchange lol. Im guessing the input is in the swf or fla file not sure how that works. what im guessing is that in the embed or the object tags (ill play with it) i can put something like Code: document.write('test on change\n'); i think i need to wrap that in doc write script type=javascript in quotes so it parses. If i can get that text to show up inside the IM where i want it then i can try to figure out how to set focus on box and recongize onchange and do some testing. I think i might even be able to doc write the onchange command but not sure. Thanks i keep getting the following error: - there is no attribute "onChange" Code: <select name="type" id="type" onChange="gettype('type');"> <option selected="selected">--Car type--</option> <option value="1">Bmw</option> <option value="2">Merc Blinds</option> <option value="3">Ford</option> <option value="4">Saab</option> </select> Hi I'm a newbie. Please help me. I'm using Joomla. I've got a dropdown which reads the filename from the database. When the user selects it I want an onchange event to open the pdf. I've been at it for 2 days now. Code: <?php $con = mysql_connect('localhost', 'root', ''); if (!$con) { die('Could not connect: ' . mysql_error()); } mysql_select_db("metnet", $con); $sql="SELECT * FROM newsletter"; $result = mysql_query($sql); echo "<form method='post'>"; $dropdown = "<select name='sname' onChange='location(this.form.sname)' >"; while($row = mysql_fetch_assoc($result)) { $dropdown .= "\r\n<option value='{$row['fpath']}'>{$row['fpath']}</option>"; } $dropdown .= "\r\n</select>"; echo $dropdown; ?> I am trying to create an onChange action that will validate that confirmation checkbox has been checked, and if not, popup an alert message and put the focus on the checkbox input and change the class of the container DIV to "highlight". Here is the form, with the 'onchange' trigger: Code: <form id="checkout" name="my_form" method="post" action="!---SCRIPT_NAME---" onsubmit="return validForm(this);"> <div id="verification" class="aligncenter required"> <input type="checkbox" id="verified" name="verified" value="" /> <label for="verified">YES</label>, the items and quantities shown above are correct.</div> <div class="required"><label for="name">Name:</label><input id="name" name="contactname" type="text" class="L" onchange="" /></div> <div class="required"><label for="company">Company Name:</label><input id="company" name="company" type="text" class="L" /></div> <div class="buttonRow"><input type="submit" name="VERIFY" class="btn red" value="Continue" /></div> </form> And here is my javascript code: Code: function verifyOrder() { if (document.my_form.verified.checked != "true") { alert("Please verify the contents of your order"); document.my_form.verified.focus(); getElementById('document.my_form.verification').className='highlight' return false; } } But this is not working and generates errors in firebug. What am I doing wrong? Thanks!! Evening all. I have a little bit of code, thus: Code: var data = document.createElement("td"); box = document.createElement("input"); box.id = headercategories[i]; box.type = text; box.value = "Ten"; box.onChange = alter("11"); data.appendChild(box); in which I insert a text input box into a table data element. When the value of the input is changed, I would like to call the function alter(). However, what's happening in practice is that the function alter is getting called straight away, without waiting for any changes. Is there any way I can stop this? It doesn't seem to happen if you actually write the onchange bit into the HTML by hand rather than doing it dynamically. Thanks, Chris hi i have a form where i need to join fields from the form prior to submission to flow into a pdf form. here is the function PHP Code: <SCRIPT language='javascript' type='text/javascript'> function joinna(form, elemName, ttl) { form.bname.value = form.b_fname.value + ' ' + form.b_lname.value; } </script> here is what the form input looks like PHP Code: <input class="left" onBlur="mark(this,'#ffffff','#000000')" name="b_fname" size="20" maxlength="40" onFocus="nextfield ='cb_fname'; mark(this,'#FFFF99','#0000FF')" value="<?php echo $row['b_fname'];?>" onChange="joinna(this.form,'b_fname','p1f6');"> </span> <input class="left" onBlur="mark(this,'#ffffff','#000000')" name="b_lname" size="20" maxlength="40" onFocus="nextfield ='cb_fname'; mark(this,'#FFFF99','#0000FF')" value="<?php echo $row['b_lname'];?>" onChange="joinna(this.form,'b_lname','p1f6');"> </span> and here is the calc field PHP Code: <input type="hidden" NAME="bname" value="" Size="7" onBlur="mark(this,'#ffffff','#000000')" onFocus="blur();document.smartform.bname.focus()" onChange="this.form.b_fname.value + this.form.b_lname.value; joinna(this.form,'field');" > this works fine IF i manually insert something new into the b_fname field. but lets say a user pulls the for to edit, and then makes no changes, "bname" will remain blank. what i want to do is call the function and/or force an 'onchange' or do whatever so bname is not left blank in the event the user submits w/o making any changes to the form tia |