JavaScript - Beginner: Using Js Code Then Different Js Code On The First Result?

I am trying to set up a looping structure that tests to see if the user enters a value. If the textbox is null then a global variable is false otherwise a checkbox is checked and the global variable is true.

below is what i have done so far, please assist me.

var isValid = false;

window.onload = startForm;

function startForm() {


document.forms[0].firstName.focus();
document.forms[0].onsubmit = checkEntries;

alert("You have been added to the list")
}

function checkEntries() {
var menus = new Array();
var formObject = document.getElementsByTagName('*');
for (var i=0; i < formObject.length; i++){
if (formObject[i] == "myform") menus.push(formObject[i]);
if (document.forms[0].firstName.value.length==0 || document.forms[0].firstName.value.length == null){
isValid= false;
alert("Please enter a first name");
} else (document.forms[0].check0.checked=true);
isValid=true;

if (document.forms[0].lastName=="" || document.forms[0].lastName== null){
alert("Please enter a last name");
isValid = false;
} else (document.forms[0].check1.checked=true);
isValid=true;

if (document.forms[0].email=="" || document.forms[0].email== null) {
alert("Please enter a valid email");
} else
return (document.forms[0].check0.checked=true);
isValid=true;

if (document.forms[0].bDate=="" || document.forms[0].bDate== null) {
isValid=false;
alert("please make sure you enter a valid birth date.");
}
else (document.forms[0].check0.checked=true);
isValid=true;
}
}


here is the form html...

<form name="myform" >
<input type="checkbox" name="check0" class="check0" id="check0" >
First: <input type="text" name="firstName" id="firstName"> <BR>
<input type="checkbox" name="check1" class="check1" id="check1" >
Last: <input type="text" name="lastName" id="lastName" ><BR>
<input type="checkbox" name="check2" class="check2" id="check2" >
E-Mail: <input type="text" name="email" id="email"> <BR>
<input type="checkbox" name="check3" class="check3" id="check3" >
Birthday (mm/dd/yyyy): <input type="text" name="bDate" id="bDate"> <BR>
<input type="submit" value="Join our mailing List" />
</form>

Hi guys.. I really need a bit of help.. is anyone looking at this good with JS?

I have a php form validation script but i think its a bit slow and would rather a JS script instead...

here is what i have in php..

PHP Code:
    <?php
  if(isset($_POST['submit']))
      {
          $firstName = $_POST['firstName'];
          $lastName = $_POST['lastName'];
          $email = $_POST['email'];
          $mobile = $_POST['mobile'];
          $comments = $_POST['comments'];
         
          $errors = array();
          
        function display_errors($error)
          {
          echo "<p class=\"formMessage\">";
          
          
            echo $error[0];
            
            echo "</p>";
          }  
          
         function validateNames($names) 
        {
        return(strlen($names) < 3);
        } 
        
        function validateEmail($strValue) 
        {
           $strPattern = '/([A-Z0-9._%+-]+@(?:[A-Z0-9-]+\.)+[A-Z]{2,4})/sim';
           return(preg_match($strPattern,$strValue));
        } 
        
        function validateMobile($strValue) 
        {
           $strPattern = '/^\d{10}$/';
           return(preg_match($strPattern,$strValue));
        } 
        
        function validateComments($comments) 
        {
        return(strlen($comments) < 10);
        } 
        
        if(validateNames($firstName)) 
        {    
        $errors[] = 'Please Enter Your First Name';    
        }
        
         if(validateNames($lastName)) 
        {    
        $errors[] = 'Please Enter Your Second Name';    
        }
        
          
        if(!validateEmail($email)) 
        {    
        $errors[] = 'Please Enter Your Correct Email';    
        }
        
        if(!validateMobile($mobile)) 
        {    
        $errors[] = 'Please Enter Your Correct Mobile Number';    
        }
        
        if(validateComments($comments)) 
        {    
        $errors[] = 'Please Enter A Comment More Than 10 Characters';    
        }


          if(empty($errors))
          {
            $to = "info@eventpromotion.ie";
            $subject = "Event Promotion Enquiry!";
            $body = 
             "First Name: " . $_POST['firstName'] .
             "\nLast Name: " . $_POST['lastName'] .
             "\nEmail: " . $_POST['email'] .  
               "\nMobile: " . $_POST['mobile'] . 
             "\nMessage: " . $_POST['comments'];
              $headers = "From: ". $firstName ." ". $lastName . " <" . $email . ">\r\n";


          if (mail($to, $subject, $body, $headers)) {
            echo("<p class=\"formMessage\">Thanks for submitting your enquiry.</p>");
            }
            else
            {
            echo("<p class=\"formMessage\">Message delivery failed.</p>");
            }
          }
          else
          {
          //echo "error";
         display_errors($errors);
          }    
      }                   
?>
    <form id="form" method="post" action="index.php#quickContact"> 
              <p> 
                <label>First Name</label><br /> 
                <input type="text" name="firstName" value="<?php if(isset($firstName)){echo $firstName;} ?>" />      
            </p> 
            <p> 
                <label>Last Name</label><br /> 
                <input type="text" name="lastName" value="<?php if(isset($lastName)){echo $lastName;} ?>" />      
            </p> 
              <p> 
                <label>Email:</label><br /> 
                <input type="text" name="email" value="<?php if(isset($email)){echo $email;} ?>" /> 
                
            </p>               
            <p> 
                <label>Mobile:</label><br /> 
                <input type="text" name="mobile" value="<?php if(isset($mobile)){echo $mobile;} ?>" /> 
                
            </p>                                  
            <p> 
                <label>Comments:</label> <br />
                <textarea name="comments" cols="30" rows="3" ><?php if(isset($comments)){echo $comments;} ?></textarea>    
            </p> 
            <p>    <input class="send" type="image" src="images/submit2.gif" name="submit" value="Submit"  /></p> 
  </form>

does anyone know how to transfer this to JS so that it will be easy to understand.. Im not good with JS at all

Ok guys if you look at this page www.runningprofiles.com/members/shout/view.php my code works great....

But when i add it to the rest of the script the code wont work shows he
http://www.runningprofiles.com/membe...ll_Script.php#


Below is view.php (the one that works)
and the one added to the code scirpt is the one the does not.


PHP Code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
$(function() 
{
$(".view_comments").click(function() 
{
var ID = $(this).attr("id");

$.ajax({
type: "POST",
url: "viewajax.php",
data: "msg_id="+ ID, 
cache: false,
success: function(html){
$("#view_comments"+ID).prepend(html);
$("#view"+ID).remove();
$("#two_comments"+ID).remove();
}
});
return false;
});
});
</script>





<ol>
<?php

//Here $id is main message msg_id value.
$csql=mysql_query("select * from comments where msg_id_fk='130' order by com_id ");
$comment_count=mysql_num_rows($csql);
if($comment_count>2)
{
$second_count=$comment_count-2;
?>


<div class="comment_ui" id="view130">
<a href="#" class="view_comments" id="130">View all <?php echo $comment_count; ?> comments</a>
</div>


<?php 
} 
else 
{
$second_count=0;
}
?>




<div id="view_comments130"></div>
<div id="two_comments130">




<table width="30%">
<?php
$small=mysql_query("select * from comments where msg_id_fk='130' order by com_id limit $second_count,2 ");
while($rowsmall=mysql_fetch_array($small))
{ 
$c_id=$rowsmall['com_id'];
$comment=$rowsmall['comment'];
?>


<div class="comment_actual_text">



<tr>
    <td style="BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; BORDER-LEFT: black 1px solid; BORDER-BOTTOM: black 1px solid" valign="top">
                   


 <table style="WIDTH: 100%; BORDER-COLLAPSE: collapse" align="left">
                     <tr>

                 <td width="5%" style="VERTICAL-ALIGN: middle; TEXT-ALIGN: center"><img style="WIDTH: 30px; HEIGHT: 30px" alt="srinivas" src="http://www.gravatar.com/avatar.php?gravatar_id=7a9e87053519e0e7a21bb69d1deb6dfe" border="1" /></td>
                 <td style="VERTICAL-ALIGN: top; TEXT-ALIGN: left">
                   <strong>Jarratt</strong> <?php echo $comment; ?>
                   <br /><span style="COLOR: #a9a9a9">10 min ago - ID = <?php echo $c_id;?> </span></td>
            
</tr> 
</table><br />
      </td>
  </tr>








</div>
<?php } ?>
</table>
</div>
</ol>

Facebook_Wall_Script.php

PHP 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=iso-8859-1" />
<title>9lessons Applicatio Demo</title>
<link href="frame.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript" src="jquery.oembed.js"></script>
 
 <script type="text/javascript">
<script type="text/javascript">
$(function() 
{
$(".view_comments").click(function() 
{
var ID = $(this).attr("id");

$.ajax({
type: "POST",
url: "../viewajax.php",
data: "msg_id="+ ID, 
cache: false,
success: function(html){
$("#view_comments"+ID).prepend(html);
$("#view"+ID).remove();
$("#two_comments"+ID).remove();
}
});
return false;
});
});



$(function() {

$(".comment_button").click(function() {

var element = $(this);
   
    var boxval = $("#content").val();
    
    var dataString = 'content='+ boxval;
    
    if(boxval=='')
    {
    alert("Please Enter Some Text");
    
    }
    else
    {
    $("#flash").show();
    $("#flash").fadeIn(400).html('<img src="ajax.gif" align="absmiddle">&nbsp;<span class="loading">Loading Update...</span>');
$.ajax({
        type: "POST",
  url: "update_ajax.php",
   data: dataString,
  cache: false,
  success: function(html){
 
  $("ol#update").prepend(html);
  $("ol#update li:first").slideDown("slow");
  
   document.getElementById('content').value='';
   $('#content').value='';
   $('#content').focus();
  $("#flash").hide();
  
    
    $("#expand_url").oembed(boxval);
    
  }
 });
}
return false;
    });


/ Delete Wall Update

$('.delete_update').live("click",function() 
{
var ID = $(this).attr("id");
var dataString = 'msg_id='+ ID;
var parent=$("#bar"+ID);
    jConfirm('Are you sure you want to delete this message?', 'Confirmation Dialog', 
                
                    function(r) {
                    
                    
                    if(r==true)
                    {
$.ajax({
        type: "POST",
  url: "delete_update.php",
   data: dataString,
  cache: false,
  success: function(html){
 
 
    parent.slideUp(300,function() { parent.remove(); });
  }
 });

}
});
return false;
});//comment slide
$('.comment').live("click",function() 
{

var ID = $(this).attr("id");
$(".fullbox"+ID).show();
$("#c"+ID).slideToggle(300);

return false;
});


//commment Submint

$('.comment_submit').live("click",function() 
{

var ID = $(this).attr("id");

var comment_content = $("#textarea"+ID).val();
    
    var dataString = 'comment_content='+ comment_content + '&msg_id=' + ID;
    
    if(comment_content=='')
    {
    alert("Please Enter Comment Text");
    
    }
    else
    {
    
   
       $.ajax({
        type: "POST",
  url: "comment_ajax.php",
   data: dataString,
  cache: false,
  success: function(html){
  
 
  $("#commentload"+ID).append(html);
    document.getElementById("textarea"+ID).value='';
   
   $("#textarea"+ID).focus();
  
  }
 });
    
    
    }

return false;
});

// Delete Wall Update

$('.delete_update').live("click",function() 
{
var ID = $(this).attr("id");
var dataString = 'msg_id='+ ID;
var parent=$("#bar"+ID);
    jConfirm('Are you sure you want to delete this message?', 'Confirmation Dialog', 
                
                    function(r) {
                    
                    
                    if(r==true)
                    {
$.ajax({
        type: "POST",
  url: "delete_comment.php",
   data: dataString,
  cache: false,
  success: function(html){
 
 $("#comment"+ID).slideUp();
    
  }
 });
}
return false;
});




return false;

});


</script>


<style type="text/css">
body
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}
.update_box
{
background-color:#D3E7F5; border-bottom:#ffffff solid 1px; padding-top:3px
}
a
    {
    text-decoration:none;
    color:#d02b55;
    }
    a:hover
    {
    text-decoration:underline;
    color:#d02b55;
    }
    *{margin:0;padding:0;}
    
    
    ol.timeline
    {list-style:none;font-size:1.2em;}ol.timeline li{ display:none;position:relative; }ol.timeline li:first-child{border-top:1px dashed #006699;}
    .delete_button
    {
    float:right; margin-right:10px; width:20px; height:20px
    }
    
    .cdelete_button
    {
    float:right; margin-right:10px; width:20px; height:20px
    }
    
    .feed_link
    {
    font-style:inherit; font-family:Georgia; font-size:13px;padding:10px; float:left; width:350px
    }
    .comment
    {
    color:#0000CC; text-decoration:underline
    }
    .delete_update
    {
    font-weight:bold;
    
    }
    .cdelete_update
    {
    font-weight:bold;
    
    }
    .post_box
    {
    height:55px;border-bottom:1px dashed #006699;background-color:#F3F3F3;  width:499px;padding:.7em 0 .6em 0;line-height:1.1em;
    
    }
    #fullbox
    {
    margin-top:6px;margin-bottom:6px; display:none;
    }
    .comment_box
    {
        display:none;margin-left:90px; padding:10px; background-color:#d3e7f5; width:300px;  height:50px;
    
    }
    .comment_load
    {
      margin-left:90px; padding:10px; background-color:#d3e7f5; width:300px; height:30px; font-size:12px; border-bottom:solid 1px #FFFFFF;
    
    }
    .text_area
    {
    width:290px;
    font-size:12px;
    height:30px;
    }
    #expand_box
    {
    margin-left:90px;
    margin-top:5px;
    margin-bottom:5px;
    }
    embed
    {
        width:200px;
        height:150px;

    }
    
</style>
</head>

<body>
<?php include '../../../settings.php'; ?>

<div align="center">
<table cellpadding="0" cellspacing="0" width="500px">
<tr>
<td>


<div align="left">
<form  method="post" name="form" action="">
<table cellpadding="0" cellspacing="0" width="500px">

<tr><td align="left"><div align="left">
<h3>What are you doing?</h3></div></td></tr>
<tr>
<td style="padding:4px; padding-left:10px;" class="update_box">
<textarea cols="30" rows="2" style="width:480px;font-size:14px; font-weight:bold" name="content" id="content" maxlength="145" ></textarea><br />
<input type="submit"  value="Update"  id="v" name="submit" class="comment_button"/>
</td>

</tr>

</table>
</form>

</div>
<div style="height:7px"></div>
<div id="flash" align="left"  ></div>



<ol  id="update" class="timeline">
</ol>

<div id='old_updates'>
<?php
$small=mysql_query("select * from messages2 order by msg_id desc LIMIT 5");
while($r=mysql_fetch_array($small))
{ 
$id=$r['msg_id'];
$msg=$r['message'];

?>


<div align="left" class="post_box">
<span style="padding:10px"><?php echo $msg.'....'.$id; ?> </span>
</div>


<ol>
<?php
//Here $id is main message msg_id value.
$csql=mysql_query("select * from comments where msg_id_fk='$id' order by com_id ");
$array = mysql_fetch_assoc($csql);

$comment_count=mysql_num_rows($csql);
if($comment_count>2)
{
$second_count=$comment_count-2;
?>


<div class="comment_ui" id="view<?php echo $id; ?>">
<a href="#" class="view_comments" id="<?php echo $id; ?>">View all <?php echo $comment_count; ?> comments</a>
</div>
<?php 
}


?>


<div id="view_comments<?php echo $id; ?>"></div>
<div id="two_comments<?php echo $id; ?>">




<table width="50%">


<?php
$small2=mysql_query("select * from comments where msg_id_fk='$id' order by com_id limit 2 ");
while($rowsmall22=mysql_fetch_array($small2))
{ 
$c_id=$rowsmall22['com_id'];
$comments=$rowsmall22['comment'];
?>


<div class="comment_actual_text">



<tr>
    <td style="BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; BORDER-LEFT: black 1px solid; BORDER-BOTTOM: black 1px solid" valign="top">
                   


 <table style="WIDTH: 100%; BORDER-COLLAPSE: collapse" align="left">
                     <tr>

                 <td width="5%" style="VERTICAL-ALIGN: middle; TEXT-ALIGN: center"><img style="WIDTH: 30px; HEIGHT: 30px" alt="srinivas" src="http://www.gravatar.com/avatar.php?gravatar_id=7a9e87053519e0e7a21bb69d1deb6dfe" border="1" /></td>
                 <td style="VERTICAL-ALIGN: top; TEXT-ALIGN: left">
                   <strong>Jarratt</strong> <?php echo $comments; ?>
                   <br /><span style="COLOR: #a9a9a9">10 min ago - ID = <?php echo $c_id.'...'.$id;?> </span></td>
        
</tr> 
</table><br />
    </td>
  </tr>








</div>
<?php } ?>
</table>
</div>
</ol>
<?php } ?>








</div>


</td>
</tr>
</table>






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

I need to know/find out what type of Code Encryptor was used on this code. I want the exact code encryptor. Here's the code that has been encrypted:
Code:

<script type="text/javascript">document.write('\u003C\u0073\u0074\u0079\u006C\u0065\u0020\u0074\u0079\u0070\u0065\u003D\u0022\u0074\u0065\u0078\');</script>

if you want to see more of the code, go to http://leilockheart.me

That is not my code. Please someone help me find out what code encryptor was used for that code above! I need it for my website as well. The other code encryptor does not work for me; people can still decode it. Also, is there a way to decode that code?
Whatever that code encryptor was, it sure worked. I have googled it and I still can't find out which one that person used. Thanks!

Hello,

I posted something in the PHP section but just realized I have similar functionality in javascript already in place. Basically, this script validates some things before the info gets sent off for processing. Two things...

1.) I added a second email field on my checkout page named "email2". What can I add to this code to check if the values are the same, and if not, return an error with an alert link the others do.

2.) It seems I can add jiberish into the email field and the validator at the end of the code doesn't work. If anyone could give me a good one I could put in its place that would be great.

Thanks in advance.....I just don't know javascript at all but it looks pretty simple for you guys!

By the way, the form is located at https://www.easybeeper.com/cart/registration.php

Code:

// JavaScript Document
function checkoutvalidation()
{
	if(document.getElementById("firstName").value==0)
	{
		alert("Please enter your first name.");
		document.getElementById("firstName").focus();
		return false
	}
	if(document.getElementById("lastName").value==0)
	{
		alert("Please enter your last name.");
		document.getElementById("lastName").focus();
		return false
	}
	if(document.getElementById("creditCardNumber").value==0)
	{
		alert("Please enter your credit card number.");
		document.getElementById("creditCardNumber").focus();
		return false
	}
	if(document.getElementById("cvv2Number").value==0)
	{
		alert("Please enter your card verification number.");
		document.getElementById("cvv2Number").focus();
		return false
	}

	else if(document.getElementById("address1").value==0)
	{
		alert("Please enter your street address.");
		document.getElementById("address1").focus();
		return false
	}
	else if(document.getElementById("city").value==0)
	{
		alert("Please enter your city.");
		document.getElementById("city").focus();
		return false
	}
	else if(document.getElementById("state").value==0)
	{
		alert("Please enter your state.");
		document.getElementById("state").focus();
		return false
	}
	else if(document.getElementById("telephone").value==0)
	{
		alert("Please enter your telephone number.");
		document.getElementById("telephone").focus();
		return false
	}
	else if(document.getElementById("mobile").value==0)
	{
		alert("Please enter your mobile number.");
		document.getElementById("mobile").focus();
		return false
	}
	else if(document.getElementById("email").value==0)
	{
		alert("Please proivide us your email");
		document.getElementById("email").focus();
		return false
	}
	else if(document.getElementById("company").value==0)
	{
		alert("Please enter your company name.");
		document.getElementById("company").focus();
		return false
	}
	else if(document.getElementById("checkbox").checked==false)
	{
		alert("You must agree to our terms and conditions.");
		document.getElementById("checkbox").focus();
		return false
	}
	else
	{
		//
		//Email Validation
		//
		var email=document.getElementById("email").value;
		var splitted = email.match("^(.+)@(.+)$");
		if(splitted == null)
		{
			alert("Please enter a valid email address.");
			document.getElementById("email").focus();
			return false;
		}
		else if(splitted[1] != null )
		{
			var regexp_user=/^\"?[\w-_\.]*\"?$/;
			if(splitted[1].match(regexp_user) == null)
			{
				alert("Please enter a valid email address.");
				document.getElementById("email").focus();
				return false
			}
		}
		else if(splitted[2] != null)
		{
			var regexp_domain=/^[\w-\.]*\.[A-Za-z]{2,4}$/;
			if(splitted[2].match(regexp_domain) == null) 
			{
				var regexp_ip =/^\[\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}\]$/;
				if(splitted[2].match(regexp_ip) == null)
				{
					alert("Please enter a valid email address.");
					document.getElementById("email").focus();
					return false;
				}
			}// if
			//return true;
		}
		else
			return true;
	}
}

i was trying to make a code, but through trial and error i made this code

var word=prompt("enter a sentence below we will find where the first A or a starts");
document.write(word.indexOf("A"));
document.write(word.indexOf("a"));

what does this code do(if you cant tell, its in javascript)
i wanted it so someone could type a sentence in a prompt box and it would tell them where the first a or A is in the sentence.

I am new to programming. I am on chapter 2 of eloquent javascript book. I solved this exercise in the chapter and I just need some assessment and nudge. Although I think the shorter code is the better but this thought is not informed. Here is question and the codes to follow:

Write a program that uses*console.log*to print all the numbers from 1 to 100, with two exceptions. For numbers divisible by 3, print*"Fizz"*instead of the number, and for numbers divisible by 5 (and not 3), print*"Buzz"*instead. When you have that working, modify your program to print"FizzBuzz", for numbers that are divisible by both 3 and 5 (and still print*"Fizz"*or*"Buzz"*for numbers divisible by only one of those).
I have yet to work out the hint the author gave (these are just my own cooking based on understanding from chapters 1&2 of the book).

ATTEMPT 1:
Code:

 
for (var numString = 1; numString <= 100; numString++){
if (numString % 3 == 0 && numString % 5 == 0)
console.log("fizzbuzz");

else if (numString % 3 == 0)
console.log("fizz");

else if (numString % 3 == 0)
console.log("buzz");

else console.log(numString);
}

ATTEMPT 2:
Code:

for (var numString = 1; numString <= 100; numString++)
console.log((numString % 3 == 0 && numString % 5 == 0) ? "fizzbuzz" : (numString % 3 == 0 ? "fizz" : (numString % 5 == 0 ? "buzz" : numString)));

Reply With Quote




12-21-2014, 01:33 PM #2
Philip M View Profile View Forum Posts

Supreme Master coder! Join Date Jun 2002 Location London, England Posts 18,371 Thanks 204 Thanked 2,573 Times in 2,551 Posts

In coding there is often a trade-off between conciseness and clarity. FWIIW I would always go for clarity, even at the expense of relative verbosity. One day you or someone else may have to modify your code. With modern computers you are often talking about differences measured in negigible fractions of a millisecond.

His heart must be beating ten to the dozen. - Commentator, BBC Radio 2

I have asked over a week in diffrent forums, and no one seems to understand this code below :S! This code is for making a content be shown at my page with a mouseclick on a link. When you click the content will first slide down and at the same time fade in.

Does someone know how i can delete the slide down/up. I only want the content to fade in and out when i click on it. No sliding!

And i can also see a preloader function at the bottom, how can i insert a div? so i can show at my webpage that the preloader is loading.

PLEASE HELP ME !!! :<
Code:

//** Animated Collapsible DIV v2.0- (c) Dynamic Drive DHTML code library: http://www.dynamicdrive.com.
//** May 24th, 08'- Script rewritten and updated to 2.0.
//** June 4th, 08'- Version 2.01: Bug fix to work with jquery 1.2.6 (which changed the way attr() behaves).
//** March 5th, 09'- Version 2.2, which adds the following:
			//1) ontoggle($, divobj, state) event that fires each time a DIV is expanded/collapsed, including when the page 1st loads
			//2) Ability to expand a DIV via a URL parameter string, ie: index.htm?expanddiv=jason or index.htm?expanddiv=jason,kelly

//** March 9th, 09'- Version 2.2.1: Optimized ontoggle event handler slightly.
//** July 3rd, 09'- Version 2.4, which adds the following:
			//1) You can now insert rel="expand[divid] | collapse[divid] | toggle[divid]" inside arbitrary links to act as DIV togglers
			//2) For image toggler links, you can insert the attributes "data-openimage" and "data-closedimage" to update its image based on the DIV state

var animatedcollapse={
divholders: {}, //structu  {div.id, div.attrs, div.$divref, div.$togglerimage}
divgroups: {}, //structu  {groupname.count, groupname.lastactivedivid}
lastactiveingroup: {}, //structu  {lastactivediv.id}
preloadimages: [],

show:function(divids){ //public method
	if (typeof divids=="object"){
		for (var i=0; i<divids.length; i++)
			this.showhide(divids[i], "show")
	}
	else
		this.showhide(divids, "show")
},

hide:function(divids){ //public method
	if (typeof divids=="object"){
		for (var i=0; i<divids.length; i++)
			this.showhide(divids[i], "hide")
	}
	else
		this.showhide(divids, "hide")
},

toggle:function(divid){ //public method
	if (typeof divid=="object")
		divid=divid[0]
	this.showhide(divid, "toggle")
},

addDiv:function(divid, attrstring){ //public function
	this.divholders[divid]=({id: divid, $divref: null, attrs: attrstring})
	this.divholders[divid].getAttr=function(name){ //assign getAttr() function to each divholder object
		var attr=new RegExp(name+"=([^,]+)", "i") //get name/value config pair (ie: width=400px,)
		return (attr.test(this.attrs) && parseInt(RegExp.$1)!=0)? RegExp.$1 : null //return value portion (string), or 0 (false) if none found
	}
	this.currentid=divid //keep track of current div object being manipulated (in the event of chaining)
	return this
},

showhide:function(divid, action){
	var $divref=this.divholders[divid].$divref //reference collapsible DIV
	if (this.divholders[divid] && $divref.length==1){ //if DIV exists
		var targetgroup=this.divgroups[$divref.attr('groupname')] //find out which group DIV belongs to (if any)
		if ($divref.attr('groupname') && targetgroup.count>1 && (action=="show" || action=="toggle" && $divref.css('display')=='none')){ //If current DIV belongs to a group
			if (targetgroup.lastactivedivid && targetgroup.lastactivedivid!=divid) //if last active DIV is set
				this.slideengine(targetgroup.lastactivedivid, 'hide') //hide last active DIV within group first
				this.slideengine(divid, 'show')
			targetgroup.lastactivedivid=divid //remember last active DIV
		}
		else{
			this.slideengine(divid, action)
		}
	}
},

slideengine:function(divid, action){
	var $divref=this.divholders[divid].$divref
	var $togglerimage=this.divholders[divid].$togglerimage
	if (this.divholders[divid] && $divref.length==1){ //if this DIV exists
		var animateSetting={height: action}
		if ($divref.attr('fade'))
			animateSetting.opacity=action
		$divref.animate(animateSetting, $divref.attr('speed')? parseInt($divref.attr('speed')) : 500, function(){
			if ($togglerimage){
				$togglerimage.attr('src', ($divref.css('display')=="none")? $togglerimage.data('srcs').closed : $togglerimage.data('srcs').open)
			}
			if (animatedcollapse.ontoggle){
				try{
					animatedcollapse.ontoggle(jQuery, $divref.get(0), $divref.css('display'))
				}
				catch(e){
					alert("An error exists inside your \"ontoggle\" function:\n\n"+e+"\n\nAborting execution of function.")
				}
			}
		})
		return false
	}
},

generatemap:function(){
	var map={}
	for (var i=0; i<arguments.length; i++){
		if (arguments[i][1]!=null){ //do not generate name/value pair if value is null
			map[arguments[i][0]]=arguments[i][1]
		}
	}
	return map
},

init:function(){
	var ac=this
	jQuery(document).ready(function($){
		animatedcollapse.ontoggle=animatedcollapse.ontoggle || null
		var urlparamopenids=animatedcollapse.urlparamselect() //Get div ids that should be expanded based on the url (['div1','div2',etc])
		var persistopenids=ac.getCookie('acopendivids') //Get list of div ids that should be expanded due to persistence ('div1,div2,etc')
		var groupswithpersist=ac.getCookie('acgroupswithpersist') //Get list of group names that have 1 or more divs with "persist" attribute defined
		if (persistopenids!=null) //if cookie isn't null (is null if first time page loads, and cookie hasnt been set yet)
			persistopenids=(persistopenids=='nada')? [] : persistopenids.split(',') //if no divs are persisted, set to empty array, else, array of div ids
		groupswithpersist=(groupswithpersist==null || groupswithpersist=='nada')? [] : groupswithpersist.split(',') //Get list of groups with divs that are persisted
		jQuery.each(ac.divholders, function(){ //loop through each collapsible DIV object
			this.$divref=$('#'+this.id)
			if ((this.getAttr('persist') || jQuery.inArray(this.getAttr('group'), groupswithpersist)!=-1) && persistopenids!=null){ //if this div carries a user "persist" setting, or belong to a group with at least one div that does
				var cssdisplay=(jQuery.inArray(this.id, persistopenids)!=-1)? 'block' : 'none'
			}
			else{
				var cssdisplay=this.getAttr('hide')? 'none' : null
			}
			if (urlparamopenids[0]=="all" || jQuery.inArray(this.id, urlparamopenids)!=-1){ //if url parameter string contains the single array element "all", or this div's ID
				cssdisplay='block' //set div to "block", overriding any other setting
			}
			else if (urlparamopenids[0]=="none"){
				cssdisplay='none' //set div to "none", overriding any other setting
			}
			this.$divref.css(ac.generatemap(['height', this.getAttr('height')], ['display', cssdisplay]))
			this.$divref.attr(ac.generatemap(['groupname', this.getAttr('group')], ['fade', this.getAttr('fade')], ['speed', this.getAttr('speed')]))
			if (this.getAttr('group')){ //if this DIV has the "group" attr defined
				var targetgroup=ac.divgroups[this.getAttr('group')] || (ac.divgroups[this.getAttr('group')]={}) //Get settings for this group, or if it no settings exist yet, create blank object to store them in
				targetgroup.count=(targetgroup.count||0)+1 //count # of DIVs within this group
				if (jQuery.inArray(this.id, urlparamopenids)!=-1){ //if url parameter string contains this div's ID
					targetgroup.lastactivedivid=this.id //remember this DIV as the last "active" DIV (this DIV will be expanded). Overrides other settings
					targetgroup.overridepersist=1 //Indicate to override persisted div that would have been expanded
				}
				if (!targetgroup.lastactivedivid && this.$divref.css('display')!='none' || cssdisplay=="block" && typeof targetgroup.overridepersist=="undefined") //if this DIV was open by default or should be open due to persistence								
					targetgroup.lastactivedivid=this.id //remember this DIV as the last "active" DIV (this DIV will be expanded)
				this.$divref.css({display:'none'}) //hide any DIV that's part of said group for now
			}
		}) //end divholders.each
		jQuery.each(ac.divgroups, function(){ //loop through each group
			if (this.lastactivedivid && urlparamopenids[0]!="none") //show last "active" DIV within each group (one that should be expanded), unless url param="none"
				ac.divholders[this.lastactivedivid].$divref.show()
		})
		if (animatedcollapse.ontoggle){
			jQuery.each(ac.divholders, function(){ //loop through each collapsible DIV object and fire ontoggle event
				animatedcollapse.ontoggle(jQuery, this.$divref.get(0), this.$divref.css('display'))
			})
		}
 		//Parse page for links containing rel attribute
		var $allcontrols=$('a[rel]').filter('[rel^="collapse["], [rel^="expand["], [rel^="toggle["]') //get all elements on page with rel="collapse[]", "expand[]" and "toggle[]"
		$allcontrols.each(function(){ //loop though each control link
			this._divids=this.getAttribute('rel').replace(/(^\w+)|(\s+)/g, "").replace(/[\[\]']/g, "") //cache value 'div1,div2,etc' within identifier[div1,div2,etc]
			if (this.getElementsByTagName('img').length==1 && ac.divholders[this._divids]){ //if control is an image link that toggles a single DIV (must be one to one to update status image)
				animatedcollapse.preloadimage(this.getAttribute('data-openimage'), this.getAttribute('data-closedimage')) //preload control images (if defined)
				$togglerimage=$(this).find('img').eq(0).data('srcs', {open:this.getAttribute('data-openimage'), closed:this.getAttribute('data-closedimage')}) //remember open and closed images' paths
				ac.divholders[this._divids].$togglerimage=$(this).find('img').eq(0) //save reference to toggler image (to be updated inside slideengine()
				ac.divholders[this._divids].$togglerimage.attr('src', (ac.divholders[this._divids].$divref.css('display')=="none")? $togglerimage.data('srcs').closed : $togglerimage.data('srcs').open)
			}
			$(this).click(function(){ //assign click behavior to each control link
				var relattr=this.getAttribute('rel')
				var divids=(this._divids=="")? [] : this._divids.split(',') //convert 'div1,div2,etc' to array 
				if (divids.length>0){
					animatedcollapse[/expand/i.test(relattr)? 'show' : /collapse/i.test(relattr)? 'hide' : 'toggle'](divids) //call corresponding public function
					return false
				}
			}) //end control.click
		})// end control.each

		$(window).bind('unload', function(){
			ac.uninit()
		})
	}) //end doc.ready()
},

uninit:function(){
	var opendivids='', groupswithpersist=''
	jQuery.each(this.divholders, function(){
		if (this.$divref.css('display')!='none'){
			opendivids+=this.id+',' //store ids of DIVs that are expanded when page unloads: 'div1,div2,etc'
		}
		if (this.getAttr('group') && this.getAttr('persist'))
			groupswithpersist+=this.getAttr('group')+',' //store groups with which at least one DIV has persistance enabled: 'group1,group2,etc'
	})
	opendivids=(opendivids=='')? 'nada' : opendivids.replace(/,$/, '')
	groupswithpersist=(groupswithpersist=='')? 'nada' : groupswithpersist.replace(/,$/, '')
	this.setCookie('acopendivids', opendivids)
	this.setCookie('acgroupswithpersist', groupswithpersist)
},

getCookie:function(Name){ 
	var re=new RegExp(Name+"=[^;]*", "i"); //construct RE to search for target name/value pair
	if (document.cookie.match(re)) //if cookie found
		return document.cookie.match(re)[0].split("=")[1] //return its value
	return null
},

setCookie:function(name, value, days){
	if (typeof days!="undefined"){ //if set persistent cookie
		var expireDate = new Date()
		expireDate.setDate(expireDate.getDate()+days)
		document.cookie = name+"="+value+"; path=/; expires="+expireDate.toGMTString()
	}
	else //else if this is a session only cookie
		document.cookie = name+"="+value+"; path=/"
},

urlparamselect:function(){
	window.location.search.match(/expanddiv=([\w\-_,]+)/i) //search for expanddiv=divid or divid1,divid2,etc
	return (RegExp.$1!="")? RegExp.$1.split(",") : []
},

preloadimage:function(){
	var preloadimages=this.preloadimages
	for (var i=0; i<arguments.length; i++){
		if (arguments[i] && arguments[i].length>0){
			preloadimages[preloadimages.length]=new Image()
			preloadimages[preloadimages.length-1].src=arguments[i]
		}
	}
}

}

Hello!
Could someone please help me with some Js code?
I need to implement more than one gallery on a page, and the current script only allows one gallery.
Can someone please let me know if they can show me how to change the script to allow more than one gallery on a page please?

Here's a copy of the script:
Code:

<script type="text/javascript" src="jquery/jquery-1.4.1.js"></script> 

   <script type="text/javascript"> 
   var currentImage;
    var currentIndex = -1;
    var interval;
    function showImage(index){
        if(index < $('.bigPic img').length){
           var indexImage = $('.bigPic img')[index]
            if(currentImage){   
               if(currentImage != indexImage ){
                    $(currentImage).css('z-index',2);
                    clearTimeout(myTimer);
                    $(currentImage).fadeOut(500, function() {
                   myTimer = setTimeout("false", 3000);
                   $(this).css({'display':'none','z-index':1})
               });
                }
            }
            $(indexImage).css({'display':'block', 'opacity':1});
            currentImage = indexImage;
            currentIndex = index;
            $('.thumbs li').removeClass('active');
            $($('.thumbs li')[index]).addClass('active');
        }
    }
    
    function showNext(){
        var len = $('.bigPic img').length;
        var next = currentIndex < (len-1) ? currentIndex + 1 : 0;
        showImage(next);
    }
    
    var myTimer;
    
    $(document).ready(function() {
       myTimer = setTimeout("false()", 3000);
      showNext(); //loads first image
        $('.thumbs li').bind('click',function(e){
           var count = $(this).attr('rel');
           showImage(parseInt(count)-1);
        });
   });
    
   
   </script>

And heres the url for the page:
http://www.innov8graphics.com/client...proyectos.html

I would really appreciate someones help.
Many thanks

Sanjay

I have a java script code that highlights each row after it is selected by a checkbox
( i am using a control called gridview in asp.net )

i want the code to perform two things
1- highlight the row when it is selected ( when the checkbox status is checked ) .
2- cancel the highlighting when the checkbox is deselected again ( when the checkbox status is unchecked ) .

the code already makes the first thing successfully
my problem is in the second case ( i mean when the checkbox is unchecked ) the color (highlighting ) doesn't change .
here is the function
=======================================

function Check_Click(objRef)
{
//Get the Row based on checkbox
var row = objRef.parentNode.parentNode;

//Get the reference of GridView
var GridView = row.parentNode;

//Get all input elements in Gridview
var inputList = GridView.getElementsByTagName("input");

for (var i=0;i<inputList.length;i++)

{

//The First element is the Header Checkbox
var headerCheckBox = inputList[0];

//Based on all or none checkboxes
//are checked check/uncheck Header Checkbox
var checked = true;
if(inputList[i].type == "checkbox" && inputList[i] != headerCheckBox)
{
if(!inputList[i].checked)
{
row.style.backgroundColor = "#C2D69B";

checked = false;

break;

}
}
}
headerCheckBox.checked = checked;
}
====================================

please help me .. i need this code
thanks in advance

Hi Guys,

the files attached with this thread are used to popup Jquery datepicker.
the sample4 .htm shows how to dynamicaly add the datepicket to a dynamic generated textbox and it works fine...

i am trying to apply this on my dynamic generate one but it gives me error..

i am using different syntax to generate dynaminc textbox..but it should not affect the datepicker function Call...

below is my code :

// here i am creating my textbox

newStartDate = document.createElement( 'INPUT' );
newStartDate.id = 'id1';
newStartDate.setAttribute('name','StartDateName1');
newStartDate.setAttribute('type', 'Date');
newStartDate.size=8;
newStartDate.style.backgroundColor= bgc;

// here i am creating my img

oImg=document.createElement("img");
oImg.setAttribute('id', 'tcalico_myCalID');
oImg.setAttribute('name', 'myCalname');
oImg.setAttribute('src', 'calendar.png');
oImg.setAttribute('alt', 'Open Calendar');
oImg.setAttribute('title', 'Open Calendar');


so far it works , i have my textbox and my img picture
now i am going to call that function calendar_us.js
oImg.onclick = f2;

function f2()
{
new tcal
(
{
// form name
//'formname': 'FORM1',
// input name
'controlname': 'StartDateName1'
}
);

}
}


it does not give anything



and here is what is in the sample4.htm



<script language="JavaScript">

function f_createContent() {
var e_div = f_getElement('container');
e_div.innerHTML += '. <input type="text" name="testinput' + '" value="" />'
+ '<img title="Open Calendar" class="tcalIcon" onclick="A_TCALS[\'myCalID' + '\'].f_toggle()" id="tcalico_myCalID' + '" src="img/cal.gif"/><br />';

new tcal ({
// form name
'formname': 'testform',
// input name
'controlname': 'testinput',
// set unique ID to identify the elements
'id': 'myCalID'
});


}
function f_removeContent() {
var e_div = f_getElement('container');
e_div.innerHTML = '';
window.A_TCALS = null;
window.A_TCALSIDX = null;
N_CALNUM = 1;
}
</script>


any help or alternate solution how can i implement this will be more than appreciated !!


thanks

all help are really appreciated
==========================================

<%@ page language= "Jscript" %>
<%@ import namespace= "system" %>
<%@ import namespace= "system.data" %>
<%@ import namespace= "system.data.OleDb" %>
<%@ register tagprefix= "Header" Tagname="ImageHeader Src= "imageHeader.ascx""%>



<html>
<body>
<script language= "Jscript" runat = "server">
function page_load (sender : Object, events : EventArgs)
{
if(!IsPostBack)
{
var DataBaseConnection : OleDbConnection = new OleDbConnection ( ConfigurationSettings.AppSettings
("ConnectionString" ) );

var queryString : System.String = "SELECT customerid, [companyname] FROM customers";

dataBaseConnection.Open();

var dataBseCommand : OleDbCommand = new OleDbCommand ( queryString, dataBaseConnection );

var dataReader = dataBaseCommand.ExecuteReader();


while ( dataReader.Read())
nameList.Items.Add( dataReader.GetString( 0 ) + ", " + dataReader.GetString ( 1 ));

dateBaseConnection.Close();

}

else
{

dataGrid.DataSource = GetData();
dataGrid.DataBind();

}
}


function GetData() : ICollection
{
Var set : DataSet = new DataSet();

Var dataBaseConection: OleDbconnection = new
OleDbconnection( ConfigurationSettings.AppSettings(
"ConnectionString" ) );


var customerID : int = nameList.SelectedIndex + 1;

var queryString : String =
"SELECT [companyname] from customers WHERE " +
"customerid = " + customerID + ")";



var databaseCommand :OleDbCommand=
new OleDbCommand( querystring, dataBaseConnection);

var dataadapter : OleDbdataadapter=
new Oledbdataadapter databaseconnection);

dataAdapter.Fill( set );

dataBaseCommand.Connection.Close();

var dataView : DataView = new DataView( set.Tables[ 0 ] );




return dataView;
}

</script>

<form runat = "server">

<Header:ImageHeader id = "head" runat ="server">
</Header:ImageHeader>
<br />

Company Details:
<aspropList id = "nameList" runat = "server"
Width = "158px" Height = "22px">
</aspropList>
<asp:button id = "button" text = "select" runat = "server">
</asp:button>
<p>
<asp"DataGrid id = "dataGrid" runat = "server">
</aspataGrid>
</p>
</form>
</body>
</html>

My code used to work but suddenly stopped working and I have no idea why. It is javascript embedded in an html document.

Code:

<script language="JavaScript1.1">	

var slideimages = new Array()
  var slidelinks = new Array()
  function slideshowimages() {
  for (i = 0; i < slideshowimages.arguments.length; i++) {
    slideimages[i] = new Image()
      slideimages[i].src = slideshowimages.arguments[i]
    }
}

function slideshowlinks() {
  for (i = 0; i < slideshowlinks.arguments.length; i++)
    slidelinks[i] = slideshowlinks.arguments[i]
  }

function gotoshow() {
  if (!window.winslide || winslide.closed)
    winslide = window.open(slidelinks[whichlink])
    else
    winslide.location = slidelinks[whichlink]
    winslide.focus()
  }

</script>

From body:

<a href="javascript:gotoshow()"><img class="dropshadow"src="images/slideshow_1.gif" name="slide" border=0 width=240 height=180></a>
					
<script>	

//configure the paths of the images, plus corresponding target links
slideshowimages("images/slideshow_1.gif", "images/slideshow_2.gif", "images/slideshow_3.gif", "images/slideshow_4.gif", "images/slideshow_5.gif")

//configure the speed of the slideshow, in miliseconds
var slideshowspeed = 3000

var whichlink = 0
var whichimage = 0
function slideit() {
  if (!document.images);
    return document.images.slide.src = slideimages[whichimage].src whichlink = whichimage
  if (whichimage < slideimages.length - 1);
    whichimage++else
    whichimage = 0 setTimeout("slideit()", slideshowspeed);
  }	
slideit()
					
</script>

Any help would be greatly appreciated.

Hi Guys,
I have this JS code and it is really working just fine ... tit gives me all record based on what is selected on projectname down..


what i need to add is another dropdown to be able to filter by unique "BU"
just fyi how arrays are build here :
if we take
projectid[0] = 112
projectname[0] = MyProjectname

ID[0]= 102
BU[0]= Department 1
DESCRIPTION[0]= this is for department 1
NUM_T[0]= 5
MTH[0]= Oct-2011
NUM_F[0]= 2
NUM_M[0]= 3


for the same project i can have many department

projectid[0] = 112
projectname[0] = MyProjectname

ID[0]= 103
BU[0]= Department 2
DESCRIPTION[0]= this is for department 2
NUM_T[0]= 6
MTH[0]= Nov-2011
NUM_F[0]= 3
NUM_M[0]= 5


and so on


So i want to get the first DDL showing all distinct project ..which is done so far
- I am looking to add a 2nd DDL that includes all distinct BU "departments"
under same project ..

any ine can help on how to get that ?

thanks

below is my code :



[ code ]

<SCRIPT LANGUAGE="JavaScript">



var uniqueProjectIds = [], opt, temp = [];


for(var i = 0; i < PROJECTID.length; i++)
{

if(uniqueProjectIds[PROJECTID[i]] == null)
{
uniqueProjectIds[PROJECTID[i]] = [];
opt = document.createElement('option');
opt.text = PROJECTNAME[i];
opt.value = PROJECTID[i];


document.forms[0].cmbProjects.add(opt,undefined);
}
temp = uniqueProjectIds[PROJECTID[i]];
temp.push(i);
uniqueProjectIds[PROJECTID[i]] = temp;


}


function showDetails(val)

{
var tbl = document.getElementById('tblDetails');
while(tbl.rows.length != 1) {
tbl.tBodies[0].deleteRow(tbl.rows.length-1);
}
if(val != '-1') {
var dtls = uniqueProjectIds[val];
for(var i = 0; i < dtls.length; i++) {
var row = tbl.tBodies[0].insertRow(tbl.rows.length);




row.insertCell(0).innerHTML = ID[dtls[i]]
row.insertCell(1).innerHTML = BU[dtls[i]];
row.insertCell(2).innerHTML = DESCRIPTION[dtls[i]];

row.insertCell(3).innerHTML = NUM_T[dtls[i]];
row.insertCell(4).innerHTML = MTH[dtls[i]];
row.insertCell(5).innerHTML = NUM_F[dtls[i]];
row.insertCell(6).innerHTML = NUM_M[dtls[i]];

}
}
}

[ /code ]