JavaScript - Prevent Duplicate Items Added Into 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>

Hi 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?

Hey Everyone,

I'm happy to have joined this forum. I have a javascript countdown but the digits countdown like 14 13 12 11 10 9 8 7 ... and I want it to look like 14 13 12 11 10 09 08 07.... I need this done for Days Hours Minutes and Seconds.

Here is the code. Thank you in advanced for your help.

Code:

<script type="text/javascript">
function cd() {
	var now = <?php echo $now; ?>;
	var target = <?php echo $target; ?>;
	var horizvert = '<?php echo $horizvert; ?>';
	var daytext = '<?php echo $daytext; ?>';
	var daystext = '<?php echo $daystext; ?>';
	var hourtext = '<?php echo $hourtext; ?>';
	var hourstext = '<?php echo $hourstext; ?>';
	var minutetext = '<?php echo $minutetext; ?>';
	var minutestext = '<?php echo $minutestext; ?>';
	var secondtext = '<?php echo $secondtext; ?>';
	var secondstext = '<?php echo $secondstext; ?>';
	var whatnow = '<?php echo $whatnow; ?>';
	var redirect = '<?php echo $redirect; ?>';
	
	timediff = target - now;
	
	var daysleft = 0;
	var hoursleft = 0;
	var minutesleft = 0;
	var secondsleft = timediff;		

	if (timediff >= 60) {
		secondsleft = timediff % 60;
		minutesleft = (timediff - secondsleft) / 60;
	}

	if (minutesleft >= 60) {
		timediff = minutesleft;
		minutesleft = timediff % 60;
		hoursleft = (timediff - minutesleft) / 60;
	}

	if (hoursleft >= 24) {
		timediff = hoursleft;
		hoursleft = timediff % 24;
		daysleft = (timediff - hoursleft) / 24;
	}
	
	var gmctime = document.getElementById("gmctime");
	var gmctimetext = '';
	
	var gmccountdown_timer = setInterval(gmcTimer, 1000);

	function gmcUpdateDivHorizontal() {
		gmctimetext = '';
		gmctimetext += (daysleft) ? daysleft + (daysleft==1 ? ' '+daytext+' ' : ' '+daystext+' ') : '';
		gmctimetext += (hoursleft || daysleft) ? hoursleft + (hoursleft==1 ? ' '+hourtext+' ' : ' '+hourstext+' ') : '';
		gmctimetext += (minutesleft || hoursleft || daysleft) ? minutesleft + (minutesleft==1 ? ' '+minutetext+' ' : ' '+minutestext+' ') : '';
		gmctimetext += secondsleft + (secondsleft==1 ? ' '+secondtext+' ' : ' '+secondstext+' ');
		gmctime.innerHTML = gmctimetext;
	}
	
	function gmcUpdateDivVertical() {
		gmctimetext = '';
		gmctimetext += (daysleft) ? daysleft + (daysleft==1 ? ' '+daytext+'<br />' : ' '+daystext+'<br />') : '';
		gmctimetext += (hoursleft || daysleft) ? hoursleft + (hoursleft==1 ? ' '+hourtext+'<br />' : ' '+hourstext+'<br />') : '';
		gmctimetext += (minutesleft || hoursleft || daysleft) ? minutesleft + (minutesleft==1 ? ' '+minutetext+'<br />' : ' '+minutestext+'<br />') : '';
		gmctimetext += secondsleft + (secondsleft==1 ? ' '+secondtext+'<br />' : ' '+secondstext+'<br />');
		gmctime.innerHTML = gmctimetext;
	}
	
	function gmcTimer() {
		if (secondsleft == 0 && minutesleft == 0 && hoursleft == 0 && daysleft ==0) {
			clearInterval(gmccountdown_timer);
			if (whatnow == 'text') {
				document.getElementById('gmcpre').style.display = 'none';
				document.getElementById('datetime').style.display = 'none';
				document.getElementById('gmcpost').style.display = 'none';
				document.getElementById('gmcafter').style.display = 'block';
			} else {
				window.location = redirect;
			}
			return;
		}
	
		if (secondsleft > 0) secondsleft--;
		else {
			secondsleft = (minutesleft || hoursleft || daysleft) ? 59 : 0;
			if (minutesleft > 0) minutesleft--;
			else {
				minutesleft = (hoursleft || daysleft) ? 59 : 0;
				if (hoursleft > 0) hoursleft--;
				else {
					hoursleft = (daysleft) ? 23 : 0;
					if (daysleft) daysleft--;
				}
			}
		}
		
		if (horizvert == 'Horizontal') {
			gmcUpdateDivHorizontal();
		} else {
			gmcUpdateDivVertical();
		}
	}
}
window.onload = cd;
</script>

I do not know much at all about java but the below is the code I have now. I was told I need to use java script to get what I am looking for PLEASE HELP

Code:

<?php
$connect = mysql_connect("host.address.com", "username", "password") or
die ("Hey loser, check your server connection.");
mysql_select_db("daobrien21");
?>
<?php
// Write out our query to get the list of bar names from our DB.
$query = "SELECT Bar FROM Test";
// Execute it, or return the error message if there's a problem.
$result = mysql_query($query) or die(mysql_error());


$dropdown = "<select name='Bar'>";

//fetch_assoc will get the rows from the $result and put them into an array
// the while loop then loops through the array wrapping the html code around the results
// thus generating the dropdown with a list of your bar names
while($row = mysql_fetch_assoc($result)) {
$dropdown .= "\r\n<option value='{$row['Bar']}'>{$row['Bar']}</option>";
}
$dropdown .= "\r\n</select>";
echo $dropdown;
?>
<?php
$query="select * from Test";
$result = mysql_query("SELECT * FROM Test where City='Murfreesboro'");
?>
<table border=1 style="background-color:#F0F8FF;" >
<caption><EM>Murfreesboro Bars</EM></caption>
<tr>
<th>Bar Name</th>
<th>City</th>
<th>Address</th>
<th>Phone</th>
</tr>
<?php
while($row=mysql_fetch_array($result)){
echo "</td><td>";
echo $row['Bar'];
echo "</td><td>";
echo $row['City'];
echo "</td><td>";
echo $row['Address'];
echo "</td><td>";
echo $row['Phone'];
echo "</td></tr>";
}
echo "</table>";
?>

What I am looking to do is when someone selects the bar name from the drop down it edits the below table to just display that bars information.

Code:

top.window.moveTo(0, 0);
if (document.all) {
	top.window.resizeTo(screen.availWidth, screen.availHeight);
} else if (document.layers || document.getElementById) {
	if (top.window.outerHeight < screen.availHeight || top.window.outerWidth < screen.availWidth) {
		top.window.outerHeight = screen.availHeight;
		top.window.outerWidth = screen.availWidth;
	}
}
function gcd(a, b) {
	return (b === 0) ? a : gcd(b, a % b);
}
var i = 0;
var BrowserDetect = {
	init: function () {
		this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
		this.version = this.searchVersion(navigator.userAgent) || this.searchVersion(navigator.appVersion) 

|| "an unknown version";
		this.OS = this.searchString(this.dataOS) || "an unknown OS";
	},
	searchString: function (data) {
		for (; i < data.length; i + 1) {
			var dataString = data[i].string, dataProp = data[i].prop;
			this.versionSearchString = data[i].versionSearch || data[i].identity;
			if (dataString) {	
				if (dataString.indexOf(data[i].subString) !== -1) {
					return data[i].identity;
				}
			} else if (dataProp) {
				return data[i].identity;
			}
		}
		return data[i].identity;
	},
	searchVersion: function (dataString) {
		var index = dataString.indexOf(this.versionSearchString);
		if (index === -1) {
			return parseFloat(dataString.substring(index + this.versionSearchString.length + 1));
		}
	},
	dataBrowser: [
        {    string: navigator.userAgent,
             subString: "Chrome",
             identity: "Chrome"
            },
        {    string: navigator.userAgent,
             subString: "OmniWeb",
             versionSearch: "OmniWeb/",
             identity: "OmniWeb"
            },
        {    string: navigator.vendor,
             subString: "Apple",
             identity: "Safari",
             versionSearch: "Version"
            },
        {    prop: window.opera,
             identity: "Opera"
            },
        {    string: navigator.vendor,
             subString: "iCab",
             identity: "iCab"
            },
        {    string: navigator.vendor,
             subString: "KDE",
             identity: "Konqueror"
            },
        {    string: navigator.userAgent,
             subString: "Firefox",
             identity: "Firefox"
            },
        {    string: navigator.vendor,
             subString: "Camino",
             identity: "Camino"
            },
        {    string: navigator.userAgent,
             subString: "Netscape",
             identity: "Netscape"
            },
        {    string: navigator.userAgent,
             subString: "MSIE",
             identity: "Explorer",
             versionSearch: "MSIE"
            },
        {    string: navigator.userAgent,
             subString: "Gecko",
             identity: "Mozilla",
             versionSearch: "rv"
            },
        {    string: navigator.userAgent,
             subString: "Mozilla",
             identity: "Netscape",
             versionSearch: "Mozilla"
            }
	],
	dataOS : [
		{   string: navigator.platform,
                      subString: "Win",
                      identity: "Windows"
		    },
		{   string: navigator.platform,
                      subString: "Mac",
                      identity: "Mac"
		    },
		{   string: navigator.userAgent,
                      subString: "iPhone",
                      identity: "iPhone/iPod"
	             },
		{   string: navigator.platform,
                      subString: "Linux",
                      identity: "Linux"
		    }
	]
};
var version;
if (dataString.indexOf(dataBrowser.versionSearch) !== -1) {
	version = parseFloat(string.indexOf(dataBrowser.versionSearch), 1);
} else {
	version = parseFloat(string.indexOf(dataBrowser.identity), 1);
}
BrowserDetect.init();
if (dataBrowser.identity === "Chrome") {
	if (version >= 8) {
		document.location.replace("main/index.htm");
	} else if (version >= 3) {
		document.location.replace("meh/index.htm");
	} else {
		document.location.replace("http://www.browserchoice.eu/");
	}
} else if (dataBrowser.identity === "Safari") {
	if (version >= 5) {
		document.location.replace("main/index.htm");
	} else if (version >= 3) {
		document.location.replace("meh/index.htm");
	} else {
		document.location.replace("http://www.browserchoice.eu/");
	}
} else if (dataBrowser.identity === "Opera") {
	document.location.replace("http://www.google.com/");
} else if (dataBrowser.identity === "Firefox") {
	document.location.replace("http://www.google.com/");
} else if (dataBrowser.identity === "Mozilla") {
	document.location.replace("http://www.yahoo.com/");
} else if (dataBrowser.identity === "Explorer") {
	if (version >= 8) {
		document.location.replace("meh/index.htm");
	} else {
		document.location.replace("http://www.browserchoice.eu/");
	}
}

For some reason, this script was working before I put in the if statements, but after the if statements were placed in, it stopped auto maximizing as well, and no if statements were added around this. Does anyone know what the problem is? (It's supposed to redirect by browser to one of 3 sites based on how good they are)

Hi All,

Im trying to add some content by JS (which ive done) but i cant click a link i have made;

JS: Code:

function game() {
	document.getElementById('title').innerHTML =  '<p style="float: left; text-decoration: underline; font-weight: bold;">Deady Teddy</p><img  src=css/images/popup/close.png style="float: right; cursor: hand;" href="javascript: hideModal("modalPage");"></img>';
}

*Yes i know about the Href but if i put "onClick" it gives errors*;

HTML:

Code:

<a href="javascript:void(0);" onClick="javascript: revealModal('modalPage'); game();">Deady Teddy </a>

And place its adding it to:

Code:

<div id="modalPage">
	<div class="modalBackground"></div>
		<div class="modalContainer">
			<div class="modal">
				<div class="modalTop" id="title" onselectstart='return false'>
</div></div></div></div>

Any Idea's?

Hi All!

I'm new to the forums but discovered this site while looking for a solution to my javascript problem. I was able to find/manipulate the following code for changing a banner when a person mouse-overs a button. It is almost exactly what I want it to do, except that I'd like the following functionality to be added to it:

1) When a person hovers over a button, the image that appears should be clickable and open a webpage.

2) I would like to have the banners cycle/rotate by default until a person hovers over a button. When they hover, it should stop the cycle/rotation.

Here is an example of what the code produces prior to my desired tweaks above:

http://javascript.internet.com/image...e-gallery.html

Here is the code I currently have:

Code:

<html>
<head>
<script language="JavaScript">
function update(url,index,isSuper) {
 	document['PhotoBig'].src=url;
}
</script>
</head>
<body>
<div style="margin-left: 30%;">

<table cellpadding="0" cellspacing="0" border="0" width="234">
	<tr>
		<td colspan="8"><img src="images/hipaa-logo.png" name="PhotoBig"></td>
	</tr>
	<tr>
		<td colspan="8"><img src="images/w_spacer.gif" width="1" height="5"></td>
	</tr>
	<tr>
		<td width="120">&nbsp;</td>
		<td width="24"><a onMouseOver="update('images/alz-logo.png', 0, false); return false;"><img src="images/button1.png"></a></td>
		<td width="21"><a onMouseOver="update('images/ecomm-logo.png', 1, true); return false;"><img src="images/button2.png"></a></td>
		<td width="21"><a onMouseOver="update('images/facebook-logo.png', 2, true); return false;"><img src="images/button3.png"></a></td>
		<td width="21"><a onMouseOver="update('images/hipaa-logo.png', 3, true); return false;"><img src="images/button4.png"></a></td>
		<td width="27"><a onMouseOver="update('images/swain-logo.png', 4, true); return false;"><img src="images/button5.png"></a></td>
	</tr>
</table>

</div>
</body>
</html>

Any suggestions would be GREATLY appreciated!

Thanks!

jstwondrng

Below, I added: bmiresult to my database but I get the error: There has been an error: could not prepare statement (1 table bmical has no column named bmiresult)

Code:

 html5rocks.webdb.createTable = function() {
        var db = html5rocks.webdb.db;
        db.transaction(function(tx) {
          tx.executeSql("CREATE TABLE IF NOT EXISTS bmical(ID INTEGER PRIMARY KEY ASC, height1 INTEGER, weight1 INTEGER, added_on DATETIME, bmiresult INTEGER)", []);
        });
      }
      
      html5rocks.webdb.addTodo = function(todoText) {
        var db = html5rocks.webdb.db;
        db.transaction(function(tx){
          var weight1 = document.getElementById("weight1").value;
          
        var height2 = todoText / 100
  		var BMI = weight1  / (height2 * height2)
        
        var BMI = BMI;
		var bmiresult = BMI.toFixed(3);
          
          
          var addedOn = new Date();
          tx.executeSql("INSERT INTO bmical(height1, weight1, added_on, bmiresult) VALUES (?,?,?,?)",
              [todoText, weight1, addedOn, bmiresult],
              html5rocks.webdb.onSuccess,
              html5rocks.webdb.onError);
         });
      }

Hi, i know i should have 2 fields for a first and last name in my form but i dont - and was wondering if someone would be able to help me with - or has - a java script valadation rule to only allow a one letter character (letter in between spaces such as a middle initial) in a text field if at least 2 words are also included (2 words of at least 2 or more characters)

so if the user input ' John H ' an error prompt would display until one more word is added/at least 2 words are found

right now im using the below coding to allow at least 2 words in the text field but would like to see if its possible to enhance it so it will only block a one letter word if there are less than 2 other words in the form - right now if any words is added with less than 2 characters it will display an error... if anyone knows of a better form of code that needs a minimum of 2 words added and still allows single characters such as middle initials to in a validation script i'd greatly appreciate your help... i get lost on validation process'

'cheers' in advance to anyone that may know of something or a site that can point me in a better direction

function(value,element){return this.optional(element)||/^((\b[a-zA-Z]{2,80}\b)\s*){2,}/

I'm stuck! - I have a search form, that when data is entered and submitted, the data is sent to another page! - this works well see eg below.

http://www.nctfleetlist.co.uk/normal.php

My problem is, I have a piece of javascript called "greybox", it basically loads an external page, dimming the first page and focusing on the external - see eg below.

http://www.nctfleetlist.co.uk/div4.php

The new window can be called via either a href "rel" link or an "onclick" command.

I have tried implementing the the two together but when I use the javascript to call the new window the data from the original form is not passed over! - this is what I have so far...

example 1 - using onclick command (http://www.nctfleetlist.co.uk/eg1.php)

Code:

<script>
GB_show(caption, url, /*optional*/ height, width, callback_fn)
</script>
<form name="form1" action="test_script.php" method="post">
<input type="text" name="var1" value="">
<input type="submit" name="submit" value="submit" onclick="return GB_show('Search', 'http://www.nctfleetlist.co.uk/test_script.php', this.href)">
</form>

example 2 - using onsubmit within the form tag (http://www.nctfleetlist.co.uk/eg2.php)

Code:

<script>
GB_show(caption, url, /*optional*/ height, width, callback_fn)
</script>
<form name="form1" action="test_script.php" method="post" onSubmit="return GB_show('Search', 'http://www.nctfleetlist.co.uk/test_script.php', this.href)">
<input type="text" name="var1" value="">
<input type="submit" name="submit" value="submit">
</form>

example 3 - using a javascript link to submit the form, adding a "rel" tag (http://www.nctfleetlist.co.uk/eg3.php)

Code:

<script>
GB_show(caption, url, /*optional*/ height, width, callback_fn)
</script>
<form name="form1" action="test_script.php" method="post">
<input type="text" name="var1" value="">
<a href="#" onclick="document.forms[0].submit()" rel="gb_page_center[720, 300]">Search</a>
</form>

Any help is appreciated!

I am looking for a javascript code for this idea under this message

----------------------------------------------------------------------------------------------------------------------------------------------------

I want to create a kind of shopping website so when you click on a image or text it will add some text to a textarea,, it will include the name of item and price of an item

Voting button on the poll in the left column works fine if you take the sharethis javascripts out. Why won't they work together though?

<script type="text/javascript" src="http://www.claimsheaven.co.uk/polls/admin/script.js"></script>
<script type="text/javascript">var switchTo5x=true;</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript" src="http://s.sharethis.com/loader.js"></script>

e.g. on this page:

http://www.claimsheaven.co.uk/news/20120305.php

i've written a js function to find the difference between two dates. the format being used is dd/mm/yyyy hh:mm. The function returns correct value when give one set of values, but go wrong with another set. examples are given below.

set 1 : Time 1 = 24/02/2011 09:30 , time 2 = 24/02/2011 16:00

Output is corret here. It gives 6 Hours & 30 Minutes (after converting the difference)

set 2: Time 1 = 24/02/2011 09:30 , time 2 = 25/02/2011 16:00

Here, it gives 31 days, 6 Hours & 30 Minutes. My code is given below. Also the alert of dates display strange values. Don't know if it is timezone issue. I wonder what is going wrong here
Code:

function compareDateTime(frmtime,totime)
{
	var date1 = new Date(frmtime);
	var date2 = new Date(totime);
	var diff = new Date();
	alert(date1);
	alert(date2);
	diff = (date2.getTime()-date1.getTime());
	if (diff<0)
	{
		alert("From Time cannot be later than To Time!");
		return 0;
	}
	else if (diff==0)
		{
			alert("From Time cannot be equal with To Time!");
			return 0;
		}
 
	else
	{
		return diff;
	}
}

The returned diff value is broken down as following:
Code:

if (diff>0)
	{
		days = Math.floor(diff / (1000 * 60 * 60 * 24));
 		diff -= days * (1000 * 60 * 60 * 24);
 		hours = Math.floor(diff / (1000 * 60 * 60));
 		diff -= hours * (1000 * 60 * 60);
 		mins = Math.floor(diff / (1000 * 60));
 		alert(days+","+hours+","+mins);
		return true;
	}

Please Help...

Hi all,

I having a problem. I am having 10 images, and I three places on a webpage where I want to show 3 out of those 10 images randomly. But when for example image 5 is shown on spot 1, it cannot be shown on spot 2 or 3 and the same for spot 2 and 3.

Is this possible with Javascript?

Greetz,

Bob

I create a webpage where i use pagination where it is predefined that i want to show 10 item per page.But i want to do that when a user logged in he have a option that how many items he wants to show per page?javascriptkit.com site use this type?please any one help me how can i do this?