|
JavaScript - Single Selection In Listbox Javascript
Hi there, I have this listbox that I want the user to select only one choice at a time. How do I disable the multiple selection feature in javascript?
<select id="lstBxEmail" name="listBoxEmail" multiple="multiple" style="width: 580px;"> <option>Java</option> <option>PHP</option> <option>Perl</option> <option>Javascript</option> <option>C#</option> <option>Powershell</option> </select> <select id="lstBxEmail" name="listBoxEmail" multiple="multiple" style="width: 580px;"> <option>Java</option> <option>PHP</option> <option>Perl</option> <option>Javascript</option> <option>C#</option> <option>Powershell</option> </select> Similar TutorialsHi there, I would like to do the following: When I click on a button, it will set the item in the listbox to be bold. But this will only happen when the user clicks on the desired item to be bold and presses the button. An alert message will occur when he/she presses the button without clicking on the item, stating that the user will need to click on the item. How shoukld I do it in javascript? Hi, I would like to prevent the addition of duplicate items in the following situation. Firstly, I have a listbox with a few options such as Code: <select id="listbox" name="listbox" multiple="multiple" style="width: 580px;">
<option>Java</option>
<option>PHP</option>
<option>Perl</option>
<option>Javascript</option>
<option>C#</option>
<option>Powershell</option>
</select>
Next, I have a submit button with a textbox. The user will be able to submit new options into the listbox via the textbox and submit button. Therefore, I need to prevent the user from entering duplicate items into the listbox. How should I do? The following code is used to add items into the listbox. Code: function addItem()
{
var lst = document.getElementById('listbox'); // listbox control id
var newItem = prompt("Enter New Item","Enter Value Here");
//Option object is created for every option in a selection
//new Option([text[, value[, defaultSelected[, selected]]]]) // Syntax
if(newItem == null)
{
return false;
}
else
{
lst.options[lst.length] = new Option(newItem,newItem,false,false);
return false;
}
}
Hello, We are conducting a ceremony in an Auditorium where 336 People are gathered and afterwards we want to choose 20 of them randomly. We want to display the whole act of choosing them via projectors on the auditorium screen with a little animation. Basically the concept of the animation goes like this: http://summercampdubai.com , but we are stuck on the code as none of us knows programming that much: we want the chairs to be GRAY and the one that miss the opportunity (randomly) to turn RED (this much we have done) and the last chair (winner) to REMAIN GRAY (this is where we are stuck)r. PS. can anybody help us with this by tomorrow 10:00 AM GMT? Regards, Sara Can we have two onFocus javascriptscript events for single HTML Tag? Thank you..
I have created my website and i have one page that has a spry menu bar with 15 columns. I also have a javascript file that is an image gallery. i want to add that javascript file to my html/css website. not only that but i need that java script file to open on the appropriate image depending on what titled column i have clicked on. any help would be greatly appreciated!
Hello Folks, Here is my dropdown menu: Code: <select name="peeps"> <option value="Frank Tompson">Frank Tompson</option> <option value="Henry Wilson">Henry Wilson</option> <option value="Bill Kent">Bill Kent</option> <option value="Jessi McDonald"> Jessi McDonald</option> <option value="John Hays">John Hays</option> How can i make it so if i click on John Hays a JavaScript pop up will say Hello John Hays, and if i click on Bill Kent a popup will say hello Bill Kent and if i click on any other name nothing happens? Hi all.This is part of my code which I am using to edit the record from database.Initially the input boxes show the values from database and if any one of the value is changed, I want to reflect the change according to the changes made in the fields.The code works fine but if I change values in qty,rate or amount, the other values are not changing.Can experts over here tell me why?Here is my code: Code:
<html>
<head>
<script type="text/javascript">
function tot() {
var d=document.getElementById("total").value;
var st=Number(d);
var e=document.getElementById("vat_amt").value;
var tx=Number(e);
var f=document.getElementById("cash_discount").value;
var ad=Number(f);
var g=document.getElementById("vat").value;
var vat=Number(g);
var h=(st+tx)-ad;
document.getElementById("amount").value = Math.ceil(h);
var z=vat+100;
var y=(st*100)/z;
var i=st-y;
var result=Math.round(i*100)/100; //returns 28.45
document.getElementById("vat_amt").value =result;
}
var total = 0;
function getValues() {
var qty = 0;
var rate = 0;
var obj = document.getElementsByTagName("input");
for(var i=0; i<obj.length; i++){
if(obj[i].name == "qty[]"){var qty = obj[i].value;}
if(obj[i].name == "rate[]"){var rate = obj[i].value;}
if(obj[i].name == "amt[]"){
if(qty > 0 && rate > 0){obj[i].value = qty*rate;total+=(obj[i].value*1);}
else{obj[i].value = 0;total+=(obj[i].value*1);}
}
}
document.getElementById("total").value = total*1;
total=0;
}
</script>
</head>
<body>
<table width="23%" cellpadding="0" cellspacing="0" class="normal-text" border="0" style="margin-top:0px; padding-top:0px; margin-bottom:0px; padding-bottom:0px;">
<tr>
<td>Qty</td>
<td>Rate</td>
<td>Amount</td>
</tr>
<tr>
<td class="forhead"><input type="text" name="qty[]" onkeyup="getValues()" style="width:120px;" value="<?PHP echo "$row3[qty]" ?>" class="text medium"></td>
<td class="forhead"><input type="text" name="rate[]" onKeyUp="getValues()" style="width:120px;" value="<?PHP echo "$row3[rate]" ?>" class="text medium"></td>
<td class="forhead"><input type="text" name="amt[]" style="width:120px;"
onKeyUp="getValues()" class="text medium" value="<?PHP echo "$row3[amt]" ?>"></td>
</tr>
<tr>
<td class="dt" colspan="2">Sub Total:</td>
<td class="forhead"><input type="text" id="total" name="total" style="width:120px;" value="<?PHP echo "$row[total]" ?>" class="text medium"></td>
</tr>
<tr>
<td class="dt" colspan="2">Vat:</td>
<td class="forhead"><?PHP
$query5=mysql_query("SELECT * FROM vat");
echo "<select name='vat' id='vat' style='width:120px; border: 1px solid #BFBFBF;' onChange='tot()'>";
echo "<option value='0'>
Select</option>";
while($row5=mysql_fetch_array($query5))
{?>
<option value= <?PHP echo $row5[vat]; ?> <?PHP echo($row5[vat]==$row[vat])?'selected':''?>> <?PHP echo $row5[vat]; ?> </option>
<?PHP }
echo "</select>";
?></td>
</tr>
<tr>
<td class="dt" colspan="2">Vat Amt :</td>
<td class="forhead"><input type="text" id="vat_amt" name="vat_amt" style="width:120px;" value="<?PHP echo "$row[vat_amt]" ?>" class="text medium" onKeyUp="tot()"></td>
</tr>
<tr>
<td class="dt" colspan="2">Cash Discount :</td>
<td class="forhead"><input type="text" id="cash_discount" name="cash_discount" style="width:120px;" value="<?PHP echo "$row[cash_discount]" ?>" class="text medium" onKeyUp="tot()"></td>
</tr>
<tr>
<td class="dt" colspan="2">Total :</td>
<td class="forhead"><input type="text" name="amount" id="amount" style="width:120px;" class="text medium" onKeyUp="tot()" value="<?PHP echo "$row[amount]" ?>"></td>
</tr>
</table>
</body>
</html>
Hello i need help with a simple single field javascript login form, i am building a small website for I and my classmates. i want it to be able to redirect each user to a specific page when a corresponding passcode is entered, i know its unsafe but we dont plan on keeping valuable information on the site, i dont know about MSQL and dont even wish to use it, the code works at this level but am unable to add users since i dont understand javascript if someone could help me i will be very grateful thanks in advance /*here is the code i got so far*/ <tittle> Enter Passcode to proceed </title> <h1 style="font-family:Comic Sans Ms;text-align="center";font-size:20pt; color:#00FF00;> </h1> <form name="login"> Passcode: <input type="text" name="userid"/> <input type="button" onclick="check(this.form)" value="Login"/> <input type="reset" value="Cancel"/> </form> <script language="javascript"> function check(form)/*function to check userid */ { if(form.userid.value == "JohnDoe") /* checkes userid */ { window.open("johndoe.php")/*target page */ } else { alert("Invalid Passcode, please try again!")/*error message*/ } } Hello. The code below lets a user select a drop down option and a picture changes depending on the selection. I am trying to make it so when you select an option on the dropdown the picture shows up in the center of the screen and in the background behind the text. Here is the code. Code: <html>
<head>
<style type='text/css'>
#txt {background-repeat:no-repeat;width:200px;height:200px;}
</style>
<script type='text/javascript'>
function div_bg(team){
document.getElementById('txt').style.backgroundImage="url(images/" + team + ".jpg)";
}
</script>
</head>
<body>
<select name='team' onChange='div_bg(this.value);'>
<option name='arsenal' value='arsenal'>Arsenal</option>
<option name='liverpool' value='liverpool'>Liverpool</option>
</select>
<div id='txt'></div>
</body>
Thanks in advance!! Dear all, background information: I did code a timesheet management system for my company with PHP where the user has to submit time entries and has an online form with several start and end times. The start and end times are all simple HTML select option dropdowns. I want that the first End time selection will be the next start time selection. Basically a simple dependency of the dropdown. My approach was that I want to solve this with JavaScript. In my php code I am echoing the following (in this select the end times are the values): echo "<select class='normal' name='$field_id' onChange=set_time_hour(this.value,'$field_id_js')>"; When the user changes then the end time dropdown the next field (next start time entry) should be changed accordingly. The javascript looks like this function set_time_hour(hour_value,next_field){ alert (hour_value); alert (next_field); document.getElementById(next_field).value = hour_value; } The alert calls are giving me the right values. but the document.getElementById(next_field).value = hour_value; is not working. What is wrong there? Do you have an idea? How can I change the value of a select box with Javascript? The select box values are already popoluated with PHP so I just want to select the right value. I have this script which is set to generate random anagrams of my name in rotation which works fine, but I can't work out how to put multiple instances of it on one page. if someone could point me in the right direction i'd be very grateful. thanks the code is var quotations = new Array() quotations[0]= "germaine arnold" quotations[1]= "endearing moral" quotations[2]= "analog reminder" quotations[3]= "regained normal" quotations[4]= "renaming ordeal" quotations[5]= "nominal regrade" quotations[6]= "arraigned lemon" quotations[7]= "ringleader moan" quotations[8]= "mineral groaned" function display() { a=Math.floor(Math.random()*quotations.length) document.getElementById('quotation').innerHTML=quotations[a] setTimeout("display()",5000) } and i'm calling the function using: <div id="quotation"> <SCRIPT type="text/javascript">display()</SCRIPT> </div> I am trying to populate a listbox using Javascript. The listbox is populated using the xml response from ajax request. Below is the code used for the same Code: var xmlDoc = xmlhttp.responseXML;
for (var i = 0; i < xmlDoc.getElementsByTagName("id").length; i++) {
traderlists.add(new Option(xmlDoc.getElementsByTagName("name")[i].childNodes[0].nodeValue, xmlDoc.getElementsByTagName("id")[i].childNodes[0].nodeValue));
}
This works fine for me. But i am facing performance issue here. some ajax requests retrieves xmls with around 11,000 nodes and this takes too much of time to populate the listbox. Can anyone please advice me with an better solution? Hi, Iam trying a simple fill listbox on the body load, but its not working. Can someone please help me on this Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<script language="javascript" src="script.js"></script>
<body onload="fillCategory();">
<form id="drop_list" name="form1" method="post" action="">
<label>
<select name="Category" id="Category">
</select>
</label>
</form>
</body>
</html>
and my script.js: Code: function fillCategory(){
addOption(document.form1.Category, "Fiji", "Fiji", "");
addOption(document.form1.Category, "Australia", "Australia", "");
addOption(document.form1.Category, "New Zealand", "New Zealand", "");
}
Hi, I have an application wherein for one page I want to display a Listbox on selection of a radio button. There should be 2 radio buttons and when the user clicks on the 2nd one "My Process", a list box should be displayed with several options. Can anybody pls help me with this as I'm a beginner to JS.. Many thanks Pooja. I'm probably not allowed to request something like this, but since this is a small amount of code I think I should do it anyways :P Okey, so I have two listboxes and I want a tickbox to enable one listbox and disable one listbox as you tick a checkbox. I want one listbox disabled by default and the other enabled and then vice-verca the disable when you tick the box. If someone could supply me with that code I would be really greatful, butyou don't need to bother with the HTML, I should figure it out from the JS. Thanks in advance <3 Essentially, I have an ASP.net page where I load a record set server side and upload it into a listbox. I'm trying to do all the movement functionalities of the listbox items client side. Specifically, I'm trying to figure out how to copy selected listbox items from one listbox to another -- on button click. I've searched for a while, but every example that I found moves the actual item into another listbox, I just want to copy the selected item to another listbox. I'm very new to JavaScript, so ff someone can provide an example or pseudo code, I would greatly appreciate it. Hi, I've been working on a company directory page where a listbox called "People" in a form called "people_form" contains 400 employee names. I made the box "multiple" just so I could have it big and easier to find names but I decided a search box would be really useful. I've looked up a few such search scripts but so far the two I've tried haven't worked. The latest one when it's installed on the page, nothing happens when you type characters into it (it's supposed to jump to an entry matching the first few letters). Although if I backspace then it selects EVERY name in the list Here's the current form with the input tag being the search box (oh the options are populated by java script): <form name="people_form"> <input type="text" id="realtxt" onkeyup="searchSel()"></input> <select onchange="display(this.value); return false;" multiple="multiple" id="People" name="People" style="border-style: none; height:198px; width:220px;"> <option value="">Loading</option> </select></form> And here's the actual search function in the head of the page in the script tags: function searchSel() { var input=document.getElementById('realtxt').value.toLowerCase(); var output=document.getElementById('People').options; for(var i=0;i<output.length;i++) { if(output[i].value.indexOf(input)==0){ output[i].selected=true; } if(document.forms[0].realtxt.value==''){ output[0].selected=true; } } } If you know of a script that will work properly I'd appreciate it. For convenience I'm looking for one that jumps to selections inside the listbox as opposed to one where you click a search button and get results somewhere else. Hi I've been working on a listbox full of employees for our company intranet. Each name has an onchange tag that calls up a floor map and that part works fine but I'd really like to populate the names from an XML list so it's easier for non-IT people to maintain. I've been doing alot of web searches on the subject which comes up alot but it's mostly just fragments of what I need being that I've got no javascript background. I found a helpful tutorial on javascriptkit but that wasn't for creating listboxes so I'm only part of the way there. This is the XML file I've got (there will eventually be 400 entries): <?xml version="1.0"?> <list> <employee> <name>##########</name> <office>1656</office> <officePH>(403)000-0000</officePH> <mobile>N/A</mobile> <email>##########</email> </employee> <employee> <name>#########</name> <office>1657</office> <officePH>(403)000-0000</officePH> <mobile>N/A</mobile> <email>###########</email> </employee> </list> The most important parts are the name which will be used as the text of the box and the office number which will determine which floorplan is displayed. I added the other information so I can potentially put it in a div display later but that can wait. Can anyone help point me to some good resources on this subject? Thanks. hello I have a listbox full of names on a PHP website and was wondering if there was a way to grab the value during a double click to bring me to another form to display the name and information? |
|||||||