JavaScript - Javascript Stop When If Statements Added?

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,}/

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;
        }
}

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!

Hi everyone, now I need to add items into a dropdown list, and the items would be sorted alphabetically and it does not allow duplicate items to be added. Can anyone help take a look and see what's wrong with my code?

Javascript
Code:

function addAnotherOption()
{
        var newItem = document.getElementById("Text44"); 
        if (!newItem.value == "")
        {
            var answer = confirm ("Are you sure you want to add? ") 
            if (answer)//if answer is true
            {        
                var lst = document.getElementById('comboBox');  // listbox control id
                // Now we need to create a new 'option' tag to add to MyListbox 
                var newOption = document.createElement("option"); 

                newOption.value = newItem.value; // The value that this option will have 
                newOption.innerHTML = newItem.value; // The displayed text inside of the <option> tags
                for (var i = 0; i < lst.options.length; i++) 
                {
                    arrTexts = lst.options[i].text; 
                    if (arrTexts.toLowerCase() == newItem.toLowerCase()) 
                    {
                        alert ("That option is already included in the list - please enter another item.");
                        return false;
                    }
                    
                    else
                    {                                          
                        // Finally, add the new option to the listbox 
                        lst.appendChild(newOption);             
                        //sort items in listbox in alpha order
                        arrTexts = new Array();    
                        for(i=0; i<lst.length; i++) 
                        {
                            arrTexts[i] = lst.options[i].text;
                        }     
                                    
                        arrTexts.sort();
                        for(i=0; i<lst.length; i++)
                        {
                            lst.options[i].text = arrTexts[i];
                            lst.options[i].value = arrTexts[i];
                        } 
                     }
                }                                
            }
        }
        else
        {    
            if(newItem.value == "")
            {
                alert("Key something to textbox please.");
            }
                    
            else
                alert("Cancelled.");                
        }                              
 }

HTML

Code:

<input id="Text44" type="text" />
<input id="Submit22" type="submit" value="Add" onclick="addAnotherOption()" /><br />

<select name="combo" id= "comboBox" style="width: 323px">
                                    <option value="H">Hearts</option>
                                    <option value="D">Diamonds</option>
                                    <option value="C">Clubs</option>
                                    <option value="S">Spades</option>
</select>

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

I'm a little new to Javascript so I apologise if this is an easily resolved problem.

This is my Javascript code:
Code:

function display(){
		if(document.getElementById('one').style.display="none"){
		document.getElementById('one').style.display="block";
		}
		else if(document.getElementById('one').style.display="block"){
		document.getElementById('two').style.display="block";
		}
		else{
		document.getElementById('three').style.display="block";
		}
	}

This is my HTML:
Code:

<html>
....
<style>
#one,#two,#three {
display:none;
}
</style>
....
<ul>
		<li id="one">1</li>
		<li id="two">2</li>
		<li id="three">3</li>
		<li id="click" onclick="display()">+</li>
	</ul>

The idea is when I click the list item 'click' the display() function will be called and make list item 'one' appear. If list item 'one' is already visible however, list item 'two' will appear, etc. When I click it, list item one appears fine as it should, but if I click it again list item two does not appear, and I can't work out why. I could really do with some help, thank you in advance!

Hi, I believe this question has been asked by someone else before. However, it seems that the problem wasn't resolved. I'm having some trouble with the Switch Statements. My program runs without it so I know that the problem is here. I believe the logic is sound so it may be due to incorrect syntax.

I will appreciate if someone could take a look at my code below and guide me in the right direction.

Thank you.

The purpose of this function is to create bars, and the length of the bars is determined by the value of the "percent" variable (which is working fine) in the For loop after the Switch statements. The variable, "partyType" contains any of the text strings, such as "I", "D", etc.

Code:

function createBar(partyType,percent){
var barText;

switch(partyType){
case "D": 
barText="<td class='dem'></td>";
break;
case "R":
barText="<td class='rep'></td>";
break;
case "I":
barText="<td class='ind'></td>";
break;
case "G":
barText="<td class='green'></td>";
break;
case "L":
barText="<td class='lib'></td>";
break;
default: document.write("hi");
}

for(var i=1; i<percent; i++){
document.write(barText);
}
}
}

Hi Guys,

Quick question, is there a way to stop a JavaScript from validating after a certain point of the code. I've been "googling" like crazy and cant find a solution.

I had to add a Checkbox validation last second and there was existing validation and I'm not good enough to alter all of it to reflect the checkbox part so what I did was I checked to see if at least one of the checkboxes was selected, if yes, do nothing and finish the rest of the validation. If no, prompt them with an error.

The problem is after it prompts them for an error, it continues to run the rest of the validation and at the end it allows the end user to print. I cannot allow the end user to print until everything is filled in. Here is my code:

Code:

function validateFields() {
	var fieldsToVerify = [
                ["PrincipalInvestigator"], 
		["ContactEmailAddress"],
		["RFAward"],
		["Sponsor"],
		["AwardTitle"], 
		["BudgetStartDate"], 
		["BudgetEndDate"], 
		["SectionII"],
		["ProjectRole"],
		["EmployeeName"], 
		["DatesofAppointment"],
		["EffortonProject"],
		["Date"],
		["PrintName"],
		["Date2"],
		["PrintName2"],
		
	];
	

		var emptyFields = [];
	var notFullFields = [];
	for (var i=0; i<fieldsToVerify.length; i++) {
		var f = this.getField(fieldsToVerify[i][0]);
		if (f==null) {
			console.println(fieldsToVerify[i][0] + " not found.");
			continue;
		}
		if (f.valueAsString=="") {
			emptyFields.push(f.name);
		} else if (fieldsToVerify[i].length>1 && f.valueAsString.length<fieldsToVerify[i][1]) {
			notFullFields.push([f.name,fieldsToVerify[i][1]]);
		}
	}
	
	for (var i in nonRequiredFieldsToVerify) {
		var f = this.getField(nonRequiredFieldsToVerify[i]);
		if (f==null) {
			console.println(nonRequiredFieldsToVerify[i] + " not found.");
			continue;
		}
		if (f.valueAsString!="" && f.valueAsString.length<f.charLimit) {
			notFullFields.push([f.name,f.charLimit]);
		}
	}


 if 
(this.getField("CheckBox1").value=="Yes" || this.getField("CheckBox2").value=="Yes" || this.getField("CheckBox3").value=="Yes" || this.getField("CheckBox4").value=="Yes" || this.getField("CheckBox5").value=="Yes" || this.getField("CheckBox6").value=="Yes" || this.getField("CheckBox7").value=="Yes")

{}

else

app.alert("Select a Checkbox in Section I before printing") 

	if (emptyFields.length==0 && notFullFields.length==0) {
		this.print();
	} else {
		var msg = "";
		if (emptyFields.length>0) {
			msg += "The following fields must be filled-in:\n";
			for (var i in emptyFields)
				msg += emptyFields[i]+"\n";
		}

		if (notFullFields.length>0) {
			if (msg!="") msg+="\n\n";
			msg += "The following fields are not filled-in completely:\n";
			for (var i in notFullFields)
				msg += notFullFields[i][0] + " (required length: " + notFullFields[i][1] + ")\n";
		}
		app.alert(msg,"");
	}
}

Writing Table Cells and Switch Statements

I am to create a function and purpose is to write blank tables cells to make up horizontal bar. function will have 2 parameters=(partyType and percent

partyType parameter stores variables of D,R,I,G or L

percent parameter store percentage rounded to nearest integer

so I am to make a switch and break statements /commands

then have to create a For Loop in counter variable goes up from 1 through value of parmeter increments of 1

heres the code I created for this one
Code:

     function createBar(partyType,percent){ // script element to create blank cells
switch(partyType) {
case "D": document.write("<td class='dem'></td>");
break;
case "E": document.write("<td class='rep'></td>");
break;
case "I": document.write("<td class='ind'></td>");
break;
case "G": document.write("<td class='green'></td>");
break;
case "L": document.write("<td class='lib'></td>");
break;
}
var barText = partyType

for (i=0; i < percent; i++)
{
document.write(barText);

So what improvements should I make?
should my loop be before everything?
Thanks

I am using joomla, and have a tabbed menu at the top, which has different articles embedded within. I have embedded a flash video inside each article. The problem is that if i play a video and then switch to the other tab (article) without pausing the video, the video keeps on playing. And if i try to play the video in the other article, then both videos start playing.

I want to stop the first video from playing as soon as I switch to the new tab. There are a lot of different files which are included in the page, so If I know where to place a particular code within the source of the final rendered webpage, I will be able to place it at the right point in a particular file.

thanks

the website link is: http://tinyurl.com/ycg4tcm

Hi all.
I have this simple javascript that initiates a flash player.
Code:

	<script type="text/javascript">
	function add_content(filedesc,filepath,whatarget) 
{
    
	var output = "" + filedesc + "</b><br />";
	output += "<object type='application/x-shockwave-flash' data='mp3player.swf'>";
    	output += "<param name='movie' value='mp3player.swf'>";
	output += "<param name='wmode' value='transparent'>";
    	output += "<param name='FlashVars' value='mp3=" + filepath + ">";
    	output += "</object></div>";
		output += "" + whatarget + "";
document.getElementById("" + whatarget + "").innerHTML = output;
}
</script>

and this takes care of the onclick event:
Code:

<a href="javascript:void;" onclick="javascript:add_content('Hello1','../m_music/omd.mp3','target1');">Omd</a><div id='target1'></div>
<a href="javascript:void;" onclick="javascript:add_content('Hello2','../m_music/blondie.mp3','target2');">blondie</a> <div id='target2'></div>

page and vars are going to be dynamic. My question is: if I press 'target1' it plays. When I press 'target2' second player plays in its div layer. How can I start one player while stopping another (I am guessing 'target1' must be hidden). I am going to have many mp3 files and I want each player to be in its rightful place. I've looked for functions, but I am not that experienced with JV syntax. Thank you.

I am very new to Javascript - as in this is the first day I'm using it. I am using a code I got offline to fade three pictures together, but when it gets to the last image, it loops back to the first.

How do I code it so that when it gets to the last image, it stops?
Here is the code - sorry if its messy.

Javascript:

/*****

Image Cross Fade Redux
Version 1.0
Last revision: 02.15.2006
steve@slayeroffice.com

Please leave this notice intact.

Rewrite of old code found he http://slayeroffice.com/code/imageCrossFade/index.html


*****/


window.addEventListener?window.addEventListener("load",so_init,false):window.attachEvent("onload",so _init);

var d=document, imgs = new Array(), zInterval = null, current=0, pause=false;

function so_init() {
if(!d.getElementById || !d.createElement)return;

// DON'T FORGET TO GRAB THIS FILE AND PLACE IT ON YOUR SERVER IN THE SAME DIRECTORY AS THE JAVASCRIPT!
// http://slayeroffice.com/code/imageCrossFade/xfade2.css
css = d.createElement("link");
css.setAttribute("href","xfade2.css");
css.setAttribute("rel","stylesheet");
css.setAttribute("type","text/css");
d.getElementsByTagName("head")[0].appendChild(css);

imgs = d.getElementById("imageContainer").getElementsByTagName("img");
for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0;
imgs[0].style.display = "block";
imgs[0].xOpacity = .99;

setTimeout(so_xfade,3000);
}

function so_xfade() {
cOpacity = imgs[current].xOpacity;
nIndex = imgs[current+1]?current+1:0;

nOpacity = imgs[nIndex].xOpacity;

cOpacity-=.05;
nOpacity+=.05;

imgs[nIndex].style.display = "block";
imgs[current].xOpacity = cOpacity;
imgs[nIndex].xOpacity = nOpacity;

setOpacity(imgs[current]);
setOpacity(imgs[nIndex]);

if(cOpacity<=0) {
imgs[current].style.display = "none";
current = nIndex;
setTimeout(so_xfade,3000);
} else {
setTimeout(so_xfade,50);
}

function setOpacity(obj) {
if(obj.xOpacity>.99) {
obj.xOpacity = .99;
return;
}

obj.style.opacity = obj.xOpacity;
obj.style.MozOpacity = obj.xOpacity;
obj.style.filter = "alpha(opacity=" + (obj.xOpacity*100) + ")";
}

}




HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<div class="container">

<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="imagetoolbar" content="false" />
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript" src="slideshow.js"></script>
<title>Diamonds in the Rough</title>
</head>

<body>

<div id="container">
<img src="images/top2.jpg" usemap="#Map2"/>
<map name="Map2" id="Map2">
<area shape="rect" coords="69,56,145,84" href="invite.html" rel="nofollow" target="_self" alt="The Gala" />
<area shape="rect" coords="171,53,356,87" href="diamonds.html" rel="nofollow" target="_self" alt="Diamonds in the Rough" />
<area shape="rect" coords="377,52,498,87" href="mariama.html" rel="nofollow" target="_self" alt="Speaker Mariama Elliot" />
<area shape="rect" coords="525,52,636,86" href="contact.html" rel="nofollow" target="_self" alt="Get Involved" />
</map>

<div id="imageContainer">
<img src="images/index.jpg"/>
<img src="images/index2.jpg"/>
<img src="images/invite.jpg"/>

</div>



<div id="container2">
<img src="images/BOTTOM.jpg"/>
</div>


</body>
</html>



Thanks for your help!

Thanks to Old Pedant , in this forum, I am using this basic code for a slideshow he posted:

Code:

var slides = [
    [ "abc.jpg", 3000 ],
    [ "xyz.png", 5000 ],
    [ "foo.gif", 1500 ]
];
var curSlide = 0;

function nextSlide( )
{
    document.getElementById("thePicture").src = slides[curSlide][0].src;
    setTimeout( nextSlide, slides[curSlide][1] );
    curSlide = ( curSlide + 1 ) % slides.length;
}

function setUp( )
{
    for ( var s = 0; s < slides.length; ++s )
    {
        var image = new Image();
        image.src = slides[s];
        slides[s] = image;
    }
    nextSlide( );
}

window.onload = setUp;

which works just fine. But I can't find a way for it to play one round of the slides then stop. Could someone please help me with the right bit of code to stop the show?

I know the code is a bit basic (no fades etc) but I have been unable to find a similar slideshow product that gives variable time delays for each slide. I've googled endlessly but nothing could i find....

TIA

Richard
=========