|
JavaScript - Show Text In Search Box After User Selects Something
Hello,
I have this search box form with 2 select boxes : Code: <form action="search.php" method="get"> <select name="RingType"> <option value="Nose">Nose</option> <option value="Toe">Toe</option> <option value="Belly">Belly</option> </select> <select name="NecklaceType"> <option value="gold">Gold</option> <option value="diamond">diamond</option> <option value="pearl">pearl</option> </select> <input type="text" size="60" name="keywords" /> <input class="submit" type="submit" value="Search" /> </form> For example, when a visitor selects "Belly" RingType, I want "Belly Ring" to appear in the search box. and when the visitor selects "pearl" NecklaceType, I want "pearl necklace" to appear in the search box. if the visitor first selects "Belly" RingType, and then selects "pearl" NecklaceType, I want "Belly Ring pearl necklace" to appear in the search box. After making his selections in the search box, if he types something in the search box, it should add to what is already there in the search box. Or, if he first types something in the search box for example, "jewelry" and then selects "pearl" in the necklacetype select box, the search box should show : "jewelry pearl necklace" Can you please show how to do this ? Thanks a lot. Similar TutorialsI have a form where users will be making a selection in a drop down box. I need, essentially, to store two values: the first value is the actual value assigned with each drop down item (their label, basically), and the second value being a completely separate value that will change based on what they chose from the drop down box to begin with. Example: Drop down box contains selections A, B, C, D. User selects A, I need to keep the original dropdown box's A value in tact for the dropdown box's value, and then store a 1 in a hidden textbox. User selects B, a 2 is stored, etc. Both of these values will be e-mailed, hence the reason I chose a hidden textbox to store the second value. Additionally, I don't want the user to see the second value on the form itself. If there's a better way to accomplish this, please let me know. So I am trying to make a form that will eventually take the user to a specified link. It is a form that uses drop down menus. I based this off of someone elses code (with permission ), but it shows everything <= user input. I cannot for the life of me figure out how to make it only show only one of the next options. here is the JS code: Code: <script language="JavaScript">
function ShowMenu(num, menu, max)
{
for(i = 1999; i <= num; i++){
var menu2 = menu + i;
document.getElementById(menu2).style.display = 'block';
}
var num2 = num;
num2++;
while(num2 = max){
var menu3 = menu + num2;
document.getElementById(menu3).style.display = 'none';
num2=num2+1;
}
}
</script>
This is only the JS code. I didn't want to waste space with the rest of the code. If you want to see it let me know and I can include that. I am sure this is rather basic, but my JS knowledge is less than that...It has been some time since undergrad computer science class. Thanks in advance for any help! Hi. I have developed a form all working fine but am struggling on the following. I need a checkbox for an item, when the checkbox is true the user can enter text in a text box, only if the checkbox is ticked. I have numerous items I need for this. Hope someone can help. Thanks Ok so im new to javascript and I have a button in an interface for an app. It's like drag and drop and i want this button to link you to a certain website searching for what the user types in the searchField1 box. The button is button16. Such as you type dogs into the text box and you click the google button among other search engines and it will redirect you to a google search doing a search for dogs. But how do I make this button search google and search for whats in searchField1. I would really appreciate the help. Im looking everywhere to learn this but just cant find it. If you could tell me how or send me a link to a tutorial that would be great. Thanks! Here is the code: I don't know where and what to add to do that. Please help. Hi need a bit of expert help with some thing i am trying to achive but cant find any code on line. all i want to do is to have a list of items in a div box on the left of the screen and when i click on one of them it shows a div box with the related text on the right side of screen in the second div box and hides any previouse showing divs on the right. Thanks Ralph I'm having major pains trying to figure this out. I'm kind of new to Javascript, I need to open a text file from an external server, store each line in an array, then search that array for a certain word (HIGH), and if it exists then write something to the webpage, and if not, write something else. Here is what I have so far: Code: <html>
<head>
<title>Test</title>
<script>
<!--
function test(x) {
if (wxd1txt.readyState === 4 && wxd1txt.status === 200) { // Makes sure the document is ready to parse and Makes sure it's found the file.
var wxd1text = wxd1txt.responseText;
var wxd1array = wxd1txt.responseText.split("\n"); // Will separate each line into an array
var wxd1high = wxd1array.toString(); //Converting the String content to String
//var highsearchreg = new RegExp("HIGH");
//var wxd1high = wxd1array[x].search(highsearchreg);
document.write(wxd1high);
if (wxd1high.search("HIGH") >= 0){
document.write("HIGH RISK");}
else {
document.write("NO RISK");}
}
}
//-->
</script>
</head>
<body>
Hi!
<script>
<!--
var Today = new Date();
var ThisDay = Today.getDate();
var ThisMonth = Today.getMonth()+1;
var ThisYear = Today.getYear();
var Hour = Today.getHours();
var Day2 = Today.getDate()+1;
var Day3 = Today.getDate()+2;
if (navigator.appName != "Microsoft Internet Explorer") {
ThisYear = ThisYear + 1900;}
if (ThisMonth < 10) {
ThisMonth = "0" + ThisMonth;}
if (ThisDay < 10) {
ThisDay = "0" + ThisDay;}
if (Hour == 2 || Hour == 22 || Hour == 23 || Hour == 0 || Hour == 1) {
var wxHourd1 = 0600}
else if (Hour >= 3 && Hour <= 10) {
var wxHourd1 = 1300;}
else if (Hour >= 11 && Hour <= 13) {
var wxHourd1 = 1630;}
else if (Hour >= 14 && Hour <= 16) {
var wxHourd1 = 2000;}
else if (Hour >= 17 && Hour <= 21) {
var wxHourd1 = 0100;}
//var wxurld1 = "http://www.spc.noaa.gov/products/outlook/archive/"+ThisYear+"/KWNSPTSDY1_"+ThisYear+""+ThisMonth+""+ThisDay+""+wxHourd1+".txt";
var wxurld1 = "http://www.spc.noaa.gov/products/outlook/archive/2010/KWNSPTSDY1_201005101300.txt" //(High risk day for testing)
//document.write(wxurld1); //Use this to verify this section is working
if (window.XMLHttpRequest)
{
wxd1txt=new XMLHttpRequest();
}
else // IE 5/6
{
wxd1txt=new ActiveXObject("Microsoft.XMLHTTP");
}
wxd1txt.open("GET", wxurld1, true);
wxd1txt.onreadystatechange = test();
// -->
</script>
</body>
</html>
When added to a webpage, nothing shows up except the "Hi!" and there are no errors in the Javascript Console in Google Chrome. Is this possible with Javascript, and if so, what am I doing wrong or not doing? Also, I have 2 URLs, one is a text file that has the HIGH text I want for an example, the other is the current file, which shouldn't have HIGH in it (unless the weather in the US turns really bad) I am looking for a way to show more or less text. I want to show 600 characters by default and if show more is clicked it will show 600 more characters and then if clicked again shows 600 more untill there are no more characters. I also would like a show less button to collapse the text back to its default 600 characters. I have pages with 5000+ words and this would make reading much easier and make it look nicer. Right now I am using this to show the first 600 chars and when show more is clicked it expands all the way. Code: $(document).ready(function() {
var showChar = 600;
var ellipsestext = "...";
var moretext = "View more";
var lesstext = "View less";
$('.more').each(function() {
var content = $(this).html();
if(content.length > showChar) {
var c = content.substr(0, showChar);
var h = content.substr(showChar-1, content.length - showChar);
var html = c + '<span class="moreelipses">'+ellipsestext+'</span> <span class="morecontent"><span>' + h + ' </span><a rel="nofollow" href="" class="morelink">'+moretext+'</a></span>';
$(this).html(html);
}
});
$(".morelink").click(function(){
if($(this).hasClass("less")) {
$(this).removeClass("less");
$(this).html(moretext);
} else {
$(this).addClass("less");
$(this).html(lesstext);
}
$(this).parent().prev().toggle();
$(this).prev().toggle();
return false;
});
});
I am looking for any code or this code to be altered to show 600 characters by default and 600 more when show more is clicked and so on. I don't care how it is done, whether it be javascript or jquery or anything I would just like it to work and I have very little knowledge of java and if anyone could help me I would really appreciate it. thanks. I found this code sample that when a user clicks somewhere on the image, then an "X" will appear. I would like to have the "X"s remain visible even when the user clicks on a different area of the image. As you can imagine, a user clicks clicks clicks then there are "X"s everywhere. How do I do this? Do I need to create more "div" tags with the mouse click locations? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Mouse position</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script language="JavaScript" type="text/JavaScript"> var posx; var posy; function getMouse(e){ posx=0;posy=0; var ev=(!e)?window.event:e;//IE:Moz if (ev.pageX){//Moz posx=ev.pageX+window.pageXOffset; posy=ev.pageY+window.pageYOffset; } else if(ev.clientX){//IE posx=ev.clientX+document.body.scrollLeft; posy=ev.clientY+document.body.scrollTop; } else{return false}//old browsers } function showP(){ document.getElementById("div2").style.visibility="visible"; document.getElementById("div2").style.top =(posy-10)+'px'; document.getElementById("div2").style.left=(posx-6)+'px'; } </script> <style type="text/css"> .div1 {position:absolute;top:100px;left:100px;visibility:visible;z-index:5} .div2 {position:absolute;top:0px;left:0px;visibility:hidden;z-index:1;color:black;} .div3 {position:absolute;visibility:hidden;z-index:10;font-family:monospace;font-size:20px;font-weight:900;color:black;} </style> </head> <body onmousemove="getMouse(event)"> <div id="div1" class="div1"> <img src="./yourImage.jpg" onclick="showP()"> </div> <div id="div2" class="div3"> X </div> </body> </html> view the rest of my comments works on the first page but when i extend the search results the rest of the view comments wont expand. click View all 3 comments and it will show all comments then click more button try to click the view all comments on the next comment and nothing happens but the screen jumping up to the top. http://www.runningprofiles.com/membe...ll_Script.php# Why is this?? What do i need to do to fix it? 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"> $(function() { $('.more').live("click",function() { var ID = $(this).attr("id"); if(ID) { $("#more"+ID).html('<img src="moreajax.gif" />'); $.ajax({ type: "POST", url: "http://www.runningprofiles.com/members/shout/data/ajax_more.php", data: "lastmsg="+ ID, cache: false, success: function(html){ $("ol#updates").append(html); $("#more"+ID).remove(); // removing old more button } }); } else { $(".morebox").html('The End');// no results } return false; }); }); $(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"> <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; }); //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; } *{ margin:0px; padding:0px } ol.timeline { list-style:none } ol.timeline li { position:relative; border-bottom:1px #dedede dashed; padding:8px; } .morebox { font-weight:bold; color:#333333; text-align:center; border:solid 1px #333333; padding:8px; margin-top:8px; margin-bottom:8px; -moz-border-radius: 6px; -webkit-border-radius: 6px; } .morebox a{ color:#333333; text-decoration:none} .morebox a:hover{ color:#333333; text-decoration:none} #container{margin-left:60px; width:580px } </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> <ol class="timeline" id="updates"> <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> <?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="80%"> <?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> <?php } ?> </ol> <div id="more<?php echo $id; ?>" class="morebox"> <a href="#" class="more" style='display:block;width:100%;' id="<?php echo $id; ?>">more <?php echo $id; ?></a> </div> </div> </td> </tr> </table> </div> </body> </html> if it help here is ajax_more.php PHP Code: <?php include("../../../settings.php"); if(isSet($_POST['lastmsg'])) { $lastmsg=$_POST['lastmsg']; $lastmsg=mysql_real_escape_string($lastmsg); $small=mysql_query("select * from messages2 WHERE msg_id<'$lastmsg' order by msg_id desc LIMIT 2"); 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> <?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 class="comments" 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> <?php } ?> <div id="more<?php echo $id; ?>" class="morebox"> <a href="#" class="more" style='display:block;width:100%;' id="<?php echo $id; ?>">more <?php echo $id; ?></a> </div> <?php } ?> Hello! I am using this script for showing who is on the air. I would like to know if anyone has an idea how to make this show a picture file instead of text for who is on air. The script is great in that the gmt offset works. I would just rather have it show an image instead of text. Code: <span id = "dj" style="font-size:12px; font-weight:bold; font-family: Tahoma; color: #6600FF;"></span>
<script type = "text/javascript">
function display() {
var show = "No show scheduled at present";
var GMToffset = -5; // Your current GMT offset, whether Standard or Daylight
var now = new Date();
var dy = now.getDay(); // day of week 0-6
now.setHours(GMToffset + now.getHours() + now.getTimezoneOffset() / 60);
var hh = now.getHours();
var mn = now.getMinutes();
hh = hh + (mn/60); // minutes expressed as fractions of an hour
// The GMT offset ensures that every visitor, regardless of their timezone, will see the schedule
// that is appropriate for the site owner's local time.
// Tip - for testing purposes you can put here
//dy = 5;
//hh = 9.25;
// or whatever to check that the right show appears at that day/time.
if (dy >=1 && dy <=5) { // days in Javascript are 0 Sunday - 6 Saturday
if (hh >=0 && hh <3) {show = "Matt Knight at Night"}
if (hh >=3 && hh <9) {show = "Non-Stop Music"}
if (hh >=9 && hh <17) {show = "The Matt Knight Show"}
if (hh >=17 && hh <18) {show = "Saving the 70's with Mike Walker"}
if (hh >=18 && hh <20) {show = "Non-Stop Music"}
if (hh >=20 && hh <21) {show = "Eighties at Eight with Rockin' Ron"}
if (hh >=21 && hh <24) {show = "Matt Knight at Night"}
}
if (dy >= 2 && dy <=5) {
if (hh >=0 && hh <3) {show = "Matt Knight at Night"}
if (hh >=3 && hh <9) {show = "Non-Stop Music"}
if (hh >=9 && hh <18) {show = "The Matt Knight Show"}
if (hh >=18 && hh <19) {show = "Non-Stop Music"}
if (hh >=19 && hh <20) {show = "Non-Stop Music"}
if (hh >=20 && hh <21) {show = "Eighties at Eight with Rockin' Ron"}
if (hh >=21 && hh <24) {show = "Hank and Jim Show"}
}
if (dy >= 3 && dy <=5) {
if (hh >=0 && hh <3) {show = "Hank and Jim Show"}
if (hh >=3 && hh <9) {show = "Non-Stop Music"}
if (hh >=9 && hh <18) {show = "The Matt Knight Show"}
if (hh >=18 && hh <19) {show = "Non-Stop Music"}
if (hh >=19 && hh <20) {show = "Non-Stop Music"}
if (hh >=20 && hh <21) {show = "Eighties at Eight with Rockin' Ron"}
if (hh >=21 && hh <24) {show = "The Pete Sayek Show"}
}
if (dy >= 4 && dy <=5) {
if (hh >=0 && hh <1) {show = "The Pete Sayek Show"}
if (hh >=1 && hh <9) {show = "Non-Stop Music"}
if (hh >=9 && hh <15) {show = "The Matt Knight Show"}
if (hh >=15 && hh <18) {show = "Stafford's World - Mark Stafford"}
if (hh >=18 && hh <19) {show = "Non-Stop Music"}
if (hh >=19 && hh <20) {show = "Non-Stop Music"}
if (hh >=20 && hh <21) {show = "Eighties at Eight with Rockin' Ron"}
if (hh >=21 && hh <24) {show = "Matt Knight at Night"}
}
if (dy == 5) {
if (hh >=0 && hh <3) {show = "Matt Knight at Night"}
if (hh >=3 && hh <9) {show = "Non-Stop Music"}
if (hh >=9 && hh <15) {show = "The Matt Knight Show"}
if (hh >=15 && hh <18) {show = "Beachey Live from the U.K."}
if (hh >=18 && hh <19) {show = "Catt Live from California"}
if (hh >=19 && hh <20) {show = "Catt Live from California"}
if (hh >=20 && hh <21) {show = "Catt Live from California"}
if (hh >=21 && hh <23) {show = "Psychedelic Detached Garage - George Cannon"}
if (hh >=23 && hh <24) {show = "Matt Knight at Night"}
}
if (dy == 6) { // Saturday Note the two = signs to mean equals
if (hh >=0 && hh <10) {show = "Non-Stop Music"}
if (hh >= 10 && hh <13) {show = "Stafford's World - Mark Stafford"}
if (hh >=13 && hh <13.30) {show = "Cheeze Pleeze - Snarfdude and Dafodil"}
if (hh >=13.30 && hh <20) {show = "Non-Stop Music"}
if (hh >=20 && hh <23) {show = "Flashback with Matt Knight"}
if (hh >=23 && hh <24) {show = "Imagination Theater"}
} //End of Saturday Shows
if (dy == 0) { //Sunday Shows
if (hh >= 0 && hh <10) {show = "Non-Stop Music"}
if (hh >=10 && hh <11) {show = "Motown Memories with Tom Fallon"}
if (hh >=11 && hh <22) {show = "Non-Stop Music"}
if (hh >=22 && hh <23) {show = "Imagination Theater"}
if (hh >=23 && hh <24) {show = "Non-Stop Music"}
} // End of Sunday Shows
var a = "" + show + " \u00A0 \u00A0 \u00A0 \u00A0 "; // spaces must be separted by Unicode spaces to prevent collapse
document.getElementById("dj").innerHTML = a;
setTimeout("display()", 60000); // update every 60 seconds
}
</script>
Hi Im looking for a way to show hide text box on select option change PHP Code: <select name="letter_type" id="lt"> <option value="Registered">Registered</option> <option selected="selected" value="Unregistered">Unregistered</option></select> <input name="textfield7" id="regty" type="text" accesskey="1" tabindex="1" size="20" /> i wana show that text box if user select "Registered" from select option. any help would be great sorry for language errors. Thanks hi, the yahoo function below is for dragging a box around teh screen Code: (function() {
var Dom = YAHOO.util.Dom,
Event = YAHOO.util.Event,
dd1, dd2, dd3;
YAHOO.example.DDRegion = function(id, sGroup, config) {
this.cont = config.cont;
YAHOO.example.DDRegion.superclass.constructor.apply(this, arguments);
};
YAHOO.extend(YAHOO.example.DDRegion, YAHOO.util.DD, {
cont: null,
init: function() {
//Call the parent's init method
YAHOO.example.DDRegion.superclass.init.apply(this, arguments);
this.initConstraints();
Event.on(window, 'resize', function() {
this.initConstraints();
}, this, true);
},
initConstraints: function() {
//Get the top, right, bottom and left positions
var region = Dom.getRegion(this.cont);
//Get the element we are working on
var el = this.getEl();
//Get the xy position of it
var xy = Dom.getXY(el);
//Get the width and height
var width = parseInt(Dom.getStyle(el, 'width'), 10);
var height = parseInt(Dom.getStyle(el, 'height'), 10);
//Set left to x minus left
var left = xy[0] - region.left;
//Set right to right minus x minus width
var right = region.right - xy[0] - width;
//Set top to y minus top
var top = xy[1] - region.top;
//Set bottom to bottom minus y minus height
var bottom = region.bottom - xy[1] - height;
//Set the constraints based on the above calculations
this.setXConstraint(left, right);
this.setYConstraint(top, bottom);
}
});
I would like to show the final TOP and LEFT results in textboxes onMouseUP?! thanks in advance! Hi there, I am new to Java Script but had to delve into it to create the options for a form I wish to create. I downloaded chainedseletmenu from the following; http://www.dynamicdrive.com/dynamici...menu/index.htm I have the script working, so that you select a first option and a new box appears, then you select the next option and an aditional box appears and so on... This is fine, but I wish to only make additional selection boxes appear if certain options from the drop down lists are selected, but not for others. Also, I wish for users of my forms to be able to add options that are not yet available, I will give an example, lets say cars; if a user selects a make from the list, eg "Honda", a drop down selection list apears, the user then has the option to choose the "Type" of Honda, eg "Prelude", "Civic", "NSR" etc. I would like to be able to add an additional here; = "Not listed". When the "Not listed" is clicked, I would like to give my users the choice to enter the type (in this example, it could be "CRX") into an auto-appearing text box, after form submission, this could then be added the existing selection list for future users. I am aware that this requires use of a database and conection to tit, but for a start, can anyone guide me in the right direction, or does anyone have examples of such code that I can study and get an idea of what to do? This is for a non-profit educational site that I am trying to create for my learners! So would apprieciate any help I can get! Kind regards, Luke What am I doing wrong here? I am trying to make it where the user can name the link whatever he/she wants.... I think it might be this part... links[i] = name.linkPosition.value; Where linkPosition is a variable. Can I do this? Or is there another way? Code:
<div id="navBar">
<ul>
<li><a href="#" id="link0"><script>document.write(links[0]);</script></a></li>
<li><a href="#" id="link1"><script>document.write(links[1]);</script></a></li>
<li><a href="#" id="link2"><script>document.write(links[2]);</script></a></li>
<li><a href="#" id="link3"><script>document.write(links[3]);</script></a></li>
<li><a href="#" id="link4"><script>document.write(links[4]);</script></a></li>
</ul>
</div><!--end navBar -->
<form>
<label style="color: #FFF;">Change name of links! You can only change them once!</label><br />
<input type="text" class="customLink" size="15" name="link0" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>
<input type="text" class="customLink" size="15" name="link1" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>
<input type="text" class="customLink" size="15" name="link2" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>
<input type="text" class="customLink" size="15" name="link3" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>
<input type="text" class="customLink" size="15" name="link4" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>
<input type="button" onclick="replaceLinks(this.form)" value="Replace Link Names!" />
</form>
Code: <script>
var links = new Array("home", "portfolio", "stuff", "about me", "contact");
function replaceLinks(name){
for (var i=0; i<=4; i++) {
var linkPosition = "link"+i;
links[i] = name.linkPosition.value;
changeLink(i);
}
}
function changeLink(number) {
document.getElementById("link"+number).innerHTML="<span style=\"text-transform: capitalize;\">" + links[number] + "</span>";
}
</script>
ANY HELP WOULD BE AWESOME!!! I just replaced the functions to look like this... Code: function replaceLinks(name){
for (var i=0; i<=4; i++) {
links[i] = name.linker+i.value;
changeLink(i);
}
}
function changeLink(linkNumber) {
document.getElementById("link"+linkNumber).innerHTML="<span style=\"text-transform: capitalize;\">" + links[linkNumber] + "</span>";
}
Now the links are updating but I get NaN for each link. Need help with my text box. I want to make it so if i have several text boxes only one number can be entered once. So if i type the number 15 in the first text box and type 15 in the second text box an error will occur saying you cant enter the same number twice. Any idea how to do this? Code:
<html>
<head>
<title>Untitled Document</title>
<script>
function checkForInvalid(obj) {
obj.value = obj.value.replace(/[^0-9\-]|(-{2,})/gi, (RegExp.$1.indexOf("-") > -1) ? "-" : "");
}
</script>
</head>
<body>
<form name="myForm">
<input type="text" name="one" onkeyup="checkForInvalid(this)">
<br>
<input type="text" name="two" onkeyup="checkForInvalid(this)">
<br>
<input type="text" name="three" onkeyup="checkForInvalid(this)">
</form>
</body>
</html>
Thanks Hey everyone, I've looked around quite a bit and can't seem to find anything but I was wondering if there is some open source software offering a text editor/input field similar to the one used on this forum when submitting a comment or thread? Where you can click a bold button or Italic button or URL button to structure it? Thanks Josh Hey guys, I just joined the forums (literally) and just started coding (mainly with CSS and HTML) about 3-4 weeks ago. I'd really like to get into JavaScript to make cool things happen on my website. With that being said, I've come up with a pretty cool idea but am not sure how to go about my problem. Enough with the chit chat. What I'm trying to do is add text to a user's input. For instance, if they write "Hello", the function should automatically add "World" to the output. I'd ideally like for the output to be searched on Google (think search engine) with the results displayed on a new page. Thanks in advance for any help! Hi, my code below shows 2 radio buttons, when you click on one, it shows the content from a div, I would like to show the content of the checked radio button by default, at teh moment, they don't show any content until they are clicked! Code: <html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input[name$='group1']").click(function() {
var test = $(this).val();
$("div.desc").hide();
$("#"+test).show();
});
});
</script>
</head>
<body>
<input type="radio" name="group1" value="AvailableMon" checked>Available
<input type="radio" name="group1" value="Unavailable">Unavailable
<style type="text/css">
.desc { display: none; }
</style>
<div id="AvailableMon" class="desc">Available</div>
<div id="Unavailable" class="desc">Unavailable</div>
</body>
</html>
I'm pretty much lost at javascript, and unfortunately can use php to accomplish this, so here goes........ I have existing html page that includes a Week #. ie, 1, 2, 3, 5.... and so on. I'd like to be able to have a text, csv, or similar file that I can update on frequent basis that will list a Week # and than custom field of some type. (likely a date or unix time stamp). Is there a way to open a text file (or csv, etc) in javascript. Than be able to compare and get the correct data? Off the top of my head, I think its possible, and would involve something like the following? 1. Create a csv file like below 1, this is custom, my other custom 2, some more, and this too 3, and somthing, see spot run 2. Next would be have a javascript open and read the file. You would assign a variable name to each 1st, 2nd and 3rd item of each line. Than the script would loop through each line until it found a a match of Variable 1 to the Week your looking for. You could then parse out and use the other variables from that line. Any of that make sense? I hope to try and experiment some later today or tonight if I can, but javascript is still pretty foreign to me. Is it possible to dynamically change the value of text on a page as the user types into a text box? E.g. like: You Are Typing: <script> var keyword = document.getElementById('string'); document.write(keyword); </script> Or I could probably insert it into a function and loop it over and over again or is there a better way? |
|||||||