|
JavaScript - Onkeyup Not Working
Now, i am adding a onKeyUp function to change the radio if the value of another field is larger than 1. But this code isn't working... Any thoughts?
Code: function getUses() {
var listcost = document.getElementsByName('form[listcost]');
var uses = document.getElementById('Uses');
if (uses == 1) {
listcost[0].checked = true;
}
else {
listcost[1].checked = true;
}
}
Similar TutorialsI have a function that checks to see the number entered in a textfield and then, if greater than 1, will change a radio button from Single to Multiple and visa versa. The function is called from the textfield with an onkeyup="function()". The problem I am having is that it works in IE just fine, but in Firefox it doesn't seem to be doing anything. I'm not getting any errors and can't seem to see what is the problem. Google doesn't seem to be any help... Anyone have any ideas? Thanks! <script type="text/javascript"> function sum1() { noofrow = document.getElementById("NoOfRow").value-0; for (i=1;i<=3;i++) { var DAY1=parseFloat(document.getElementById('"day"+i').value,2); var day2=parseFloat(document.getElementById("day"+i).value,2); var day3=parseFloat(document.getElementById("day"+i).value,2); var tot=DAY1+day2+day3; document.getElementById("day"+i).value=tot; } } </script> <?php mysql_connect("localhost", "Admin", "aaaaaa") or die(mysql_error()); mysql_select_db("sb") or die(mysql_error()); $sqlstr = "SELECT * FROM WWW "; $row=mysql_query($sqlstr); //echo $record; //$row = mysql_fetch_array( $record ); ?> <body> <table width="834" border="1"> <tr> <td width="115">Order name</td> <td width="80">qty</td> <td width="144">Day1</td> <td width="144">Day2</td> <td width="144">Day3</td> <td width="145">TOT</td> </tr> <?php $count=0; while($record = mysql_fetch_array( $row )) { $count++; ?> <tr> <td> <?php print $record['Ordername']; ?></td> <td> <?php print $record['QTY']; ?></td> <td><form id="form1" name="form1" method="post" action=""> <label> <input type="text" name="day1qty<?php echo $count ?>" value="" /> </label> </form> </td> <td> <label> <input type="text" name="day1qty<?php echo $count ?>" /> </label> </td> <td> <label> <input type="text" name="day2qty<?php echo $count ?>" /> </label> </td> <td> <label> <input type="text" name="ttl<?php echo $count ?>" onkeyup="sum1()" /> </label> <input name="NoOfRow" id="NoOfRow" type="hidden" size="4" value="<?php echo $count ?>"> </form> </td> </tr> <?php echo $count; } ?> </table> please help me for the above code to get the sum of day1 day2 day3 onkeyup to get the total im really confusing above this plzz help me for to get the ttl value when key in values plzz help me ......................... give me smaple code also Hi, I'm a little rusty on my javascript. I'm trying to use onKeyUp and onBlur to validate html table field text entry. I'm using Firefox in Windows XP, and Javascript is turned on. Mind taking a look to see why it's not working? Thanks! -Jason Code: <html>
<head>
<title>javascript onKeyUp problem example</title>
<script type="text/javascript"><!--
//Validates full zip code when zip code field is left. If invalid, should pop an alert message.
function onBlur_Zip() {
var zipCodePattern = /^\d{5}$|^\d{5}-\d{4}$/;
if (zipCodePattern.test(document.getElementByID("zip").value) == -1) {
alert("Please enter a valid zip code.");
}
return false;
}
//Validates partial zip code. If invalid, should make table row background color yellow.
function onKeyPress_Zip() {
var zipCodePattern = /^\d{0,5}$|^\d{5}-\d{0,4}$/;
var val = document.getElementByID("zip").value;
alert(val);
if (zipCodePattern.test(document.getElementByID("zip").value) == -1) {
alert("onkeypress zip false");
document.getElementByID("zipRow").style.backgroundColor="yellow";
}
else {
alert("onkeypress zip true");
document.getElementByID("zipRow").style.backgroundColor="white";
}
return false;
}
// -->
</script>
</head>
<body>
<form><table border=1 cellpadding=5>
<tr id="zipRow">
<td>Test field:</td>
<td><input id="zip" type="text" name="zip" onKeyUp="javascript:onKeyPress_Zip()" onBlur="javascript:onBlur_Zip()" /></td>
</tr></table></form>
</body>
</html>
Hello everyone... I've got a question about an onKeyUp event. I'm using a text box that HAS to be a negative number therefore it has to have a - sign in front of the number. Can someone point me in the right direction as to how to write a function to do this? Thanks so much...
Hi, I have the following code. This code is working fine in FF but not in IE. Can any one let me know how i can resolve this. function handlerFunc (elem, elem1) //elem1 is id of input tag { elem.onKeyUp = keyupHandler (elem1); //throwing error in IE. If i remove argument it is working fine, but i want to make it work with arguments. } function keyUpHandler (elem1) { alert (elem1.form.name); } Hey, I have a calculation system that uses ajax with php and xml and executes with onkeyup. The only problem with this is the result can be returned before the user finishes entering the entire number. My question is how can I give a delay prior to running the rest of the js. I know how to use setTimeout() but will it get reset out every time the function is called or for example if they enter 5 characters in the form, will the script be called 5 times with a second delay from each or will it only be called once? Is there a performance degradation involved? Hope that made sense. Thanks! Hi there, I have an ajax search function. I have an input text field where I type in what I want to search for, but I would like the search to be delayed of a few miliseconds before the ajax search is called. How could I do that? The search field: Code: <input type="text" onkeyup="searchPlayer(this.value)"> The javascript function: Code: function searchPlayer(str)
{
here is my ajax search...
}
I tried different ways but I don't seem to be able to delay the searchPlayer function. Any help on that? Should I use setTimeout on the input field, or in my function or in another function? And how do I pass the 'this.value' to my searchPlayer function if using setTimeout? I am lost... Thanks in advance! Just like the title says. What would make a block of code that runs an "onkeydown" work perfectly fine, but when changed to "onkeyup" it fails. I could post code, but I dont even think it would matter? onkeypress also fails.
Hi, I currently have some buttons representing letters and a textbox. When a button is clicked, its value is copied into the text box. I have an onkeyup event which means that every time a button is clicked, a function is called which searches some arrays using the current text box value. However, the problem I am currently having is that the onkeyup event which calls the function works if I type the value in using my computer keyboard, but not when using the buttons (even though the buttons enter values into the textbox). Does anyone have any suggestions on how I can make it so that when I press a button, the onkeyup event triggers and the function is called? Thanks. I have client side scripting for a text box value which truncates value if user enters more than 255 characters. For this i use both onchange and onkeyUp events. I added Server side validation too(more cautious) to restrict user from continuing the page if he enters more than 255 chars. We are using this product from 7 yeras and yesterday one of the customer said that(he has a screenshot too) he saw the server side error message. this explains that my client side javascript methods doesnot fire. he is using IE browser. Any idea why this could happen?
what is the best way to count the seconds between each onkeyup to "autosave" without sending an ajax command after each key? id like my script to update after 2 seconds of no typing.... (yes, jquery is in use on the page) Code: function microtime (get_as_float) {
var now = new Date().getTime() / 1000;
var s = parseInt(now, 10);
return (get_as_float) ? now : (Math.round((now - s) * 1000) / 1000) + ' ' + s;
}
var lastKeyUp=0;
function saveChange(id,field,value){
thismicrotime=microtime(true);
if(lastKeyUp == 0 || (thismicrotime-lastKeyUp) >= 2000000){
$.get("saveChange.php",
{ 'field': field, 'value': value, 'id': id },
function(data){
lastKeyUp=thismicrotime;
},
'xml'
);
}
}
Code: <input type="text" name="field1" onkeyup="saveChange('2','field1',this.value);" />
i'd use onchange or onblur but that requires you to unfocus the field before it saves... Hi, i try to do that every char that i type in a input-type there will be a alert, but it doesnt do that, when the page loads it pop ups one time an alert and it doesnt pop up more alerts when i type something in the input-type Sorry for the bad english here is my code Code: <script type="text/javascript">
function init()
{
document.Form1.phone.onkeyup= alert('a');
}
window.onload=init;
</script>
I'm working on a script to check password strength "onkeyup",so when the user enters a password after every character i call a function to check the passwords strength.I'm almost ready,but i stucked with one thing: I want to check the same characters in the password,so i can deduct some point from the score if there are identical characters. Here is my code: PHP Code: var multis = 0; for(var x = 1; x < passLength; x++) { actChar = new RegExp(password.charAt(x),"g"); multis += password.match(actChar).length; } I know it seems an easy task,but i've spent at least 6 hours with it,(the first pitfall was that i didn't know the RegExp function and took my variables into the match() function,i think you can imagine the results)and i just can't figure this out,i always get crazy results,i've tried a few more versions as well without any luck. Thx in advance for anybody who can help me! I'm trying to output something in a separate div if the information entered in the form is invalid. It is simply not working, no errors. Code: <script type="text/javascript" language="javascript">
function validateIGN(ign) {
var validign = /^[a-zA-Z0-9]{1,30}$/;
if (!validign.test(ign)) {
document.getElementById.ignErrors.innerHTML = "<p>Your IGN is not formatted properly.";
}
else {
}
}
</script>
Heres the HTML where the onkeyup is.. Code: <form name= "newsletter" class="newsletter" action="doNewsletter.php" method="post">
<h2>Fill out this form if you want to be notified when the website is up!</h2><br/>
<center><table class="twoslot">
<tr>
<td>IGN(In Game Name):</td><td><input type="text" name="ign" onkeyup="return validateIGN(newsletter.ign.value);" /></td>
</tr>
<br/>
<tr>
<td>E-mail:</td><td><input type="text" name="email" /></td>
</tr>
<br/>
<tr>
<td>
<center>
<input type="submit" value="Submit" />
</center>
</td>
</tr>
</table></center>
<span style="font-size: .5em;">This is not working yet</span>
</form>
Input from Chromes on-screen keyboard and a form text field with an onchange or onkeyup function call doesn't seem to work. Can you think of a way around it? Cheers
What I want is a textbox that the user can enter information into. When they press a key the onkeyup event will simulate a function. All that I can do. The function needs to automatically scroll down the page to the anchor that corresponds to the number the user entered. The web page is a factor finding program. You can enter 2 numbers and it finds all the factors of all the numbers between the 2 you entered. Here is the link: http://factorfinder.tumblr.com/ As you can see, when you try to find factors of numbers a new window opens and there is a search box in the top left. Unfortunately, it doesn't work. If you want to check out the code look at the web page but here is the bit that creates the new window Code: function DisplayFactors(FactorsFound, Input, Maximum, ShowFactors, ShowPrimeFactors){
FactorsWindow = window.open("", "", "location = no, menubar = no, personal = no, scrollbars = yes, status = no, toolbar = no, resizable = no, width = 580%, height = 600%, left = 720%, top = 100%")
FactorsWindow.document.write("<div id = 'TheHeader' style = 'position: fixed; left: 0; top: 0; width: 100%; height: 15%; z-index: 2; background-color: white; border-bottom: 3px dashed black;'><table style = 'position: relative; left: 2%; top: 25%; font-size: 24px; font-weight: bolder; text-decoration: underline;'><tr><td>The Factor Finding Window</td></tr></table><table align = 'right' style = 'position: relative; top: -25%;'><tr><td>Search For The Number:</td></tr><tr><td><input type = 'text' id = 'SearchNumber_txt' maxlength = '12' onkeyup = 'opener.Search()'/></td></tr></table></div>")
FactorsWindow.document.write("<div id = 'TheBody' style = 'position: absolute; left: 0; top: 20%; width: 100%; height: 80%; z-index: 1; background-color: white;'>")
}
function Search(){
FactorsWindow.location.hash = "#Factor" + FactorsWindow.document.getElementById("SearchNumber_txt").value
//This is the bit I need to change because it currently doesn't work
}
also, this is the bit where I place the anchors in the array Code: FactorsFound.push("<a name = 'Factor'" + Input2 + "><b>The Factors of " + Input2 + " a </b></a><p style = 'margin: 0, 0, 25px, 0; position:relative; left:20px;'>")
Ultimately I need it so that when the onkeyup event is triggered it scrolls down the window to the anchor that corresponds to the number entered. I will validate the numbers entered after I find out how to do it. I mean, If the user enters the number 9 and the Factor Window is only displaying numbers 2 - 6, then I'll add an alert message or something. I'll cross that bridge when I get to it. I couldn't find this anywhere on the internet. Hi All, I have two sites using zeroclipboard (hosted at google code) one works only in firefox and barely, the other is not working at all. It does use Flash, but I think the issue is on the js side of things. On both links, clicking the filename below the thumbnail will copy and add the link as an IMG code to a div below. *working* link http://pics.boasbysatyra.com/access/spiders.php This one only works in FF, and the clip area is offset badly. Here is the template for the zc code: Code: <div class="photo" style="float: left; padding: 4px;">
<div class="exif"><a href="[~41~]?dir=[+images_dir+]&file=[+filename+]" rel="shadowbox[exif_[+content_id+]]" title="exif data for [+filename+]" alt="exif data for [+filename+]">EXIF Data</a></div>
<a class="thumb" rel="shadowbox[[+content_id+]]" href="[+images_dir+][+filename+]" title="[+title+] | [+description+]">
<img src="[+thumbs_dir+][+filename+]" alt="[+title+]" />
</a>
<div class="filecode" id="d_clip_button[+filename+]">[+filename+]
<script language="JavaScript">
var clip = new ZeroClipboard.Client();
clip.setText( 'http://pics.boasbysatyra.com[+images_dir+][+filename+]' );
clip.glue( 'd_clip_button[+filename+]' );
clip.addEventListener( 'onComplete', my_complete );
function my_complete( client, text ) {
$('.picklist').append('<div class="piclinks">[IMG]' + text + '[/IMG]</div>');
}
</script>
</div>
</div>
And the JS for the page: Code: var needRef;
//flag for page reload
function pEdit(){
needRef = 1;
}
Shadowbox.init({
handleOversize: "resize",
modal: true,
initialHeight: 32,
initialWidth: 400,
overlayOpacity: 0.85,
onClose: function(){//check for reload flag and reload
if (needRef == 1){window.location.href=window.location.href;}
}
});
ZeroClipboard.setMoviePath('/js/zc/ZeroClipboard10.swf');
function initMenu() {
$('#menu ul').hide();
$('#menu ul:first').show();
$('#menu li a').click(function() {
var checkElement = $(this).next();
if ((checkElement.is('ul')) && (checkElement.is(':visible'))) {
//return false;
}
if ((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
$('#menu ul:visible').slideUp('normal');
checkElement.slideDown('normal');
return false;
}
});
}
$(document).ready(function() {
initMenu();
});
Now on to the totally broken one - it creates the elements required, but gives them a 0x0 area! http://jb.boasbysatyra.com/forum-pic...cs/nature.html Code: div class="photo" style="float: left; margin: 4px;">
<div class="exif"><a href="[~133~]?dir=[+images_dir+]&file=[+filename+]" rel="shadowbox[exif_[+content_id+]]" title="exif data for [+filename+]" alt="exif data for [+filename+]">EXIF Data</a></div>
<a class="thumb" rel="shadowbox[[+content_id+]]" href="[+images_dir+][+filename+]" title="[+title+] | [+description+]">
<img src="[+thumbs_dir+][+filename+]" alt="[+title+]" />
</a>
<div id="d_clip_container[+filename+]" style="position:relative; width: 120px; height: 0.5em;">
<div class="filecode" id="d_clip_button[+filename+]">[+filename+]
<script language="JavaScript">
var clip = new ZeroClipboard.Client();
clip.setText( 'http://jb.boasbysatyra.com[+images_dir+][+filename+]' );
clip.glue( 'd_clip_button[+filename+]','d_clip_container[+filename+]' );
clip.addEventListener( 'onComplete', my_complete );
function my_complete( client, text ) {
$('.picklist').append('<div class="piclinks">[IMG]' + text + '[/IMG]</div>');
}
</script>
</div>
</div>
</div>
On this one I wrapped it as suggested on the zc site, I originally started with the code for the other site - it didn't work, so I went tweaking... Here is the JS: Code: var needRef;
//flag for page reload
function pEdit(){
needRef = 1;
}
Shadowbox.init({
handleOversize: "resize",
modal: true,
initialHeight: 32,
initialWidth: 400,
overlayOpacity: 0.85,
onClose: function(){//check for reload flag and reload
if (needRef == 1){needRef = 0; window.location.href=window.location.href;}
}
});
ZeroClipboard.setMoviePath('/js/zc/ZeroClipboard10.swf');
$(document).ready(function() {
$(".dim img").fadeTo("slow", 0.65);
$(".dim img").hover(function(){
$(this).fadeTo("slow", 1.0);
},function(){
$(this).fadeTo("slow", 0.65);
});
$('#mainContent').hide().fadeIn(1200);
//When page loads...
$(".tab_content").hide(); //Hide all content
// $("ul.tabs li:first").addClass("active").show(); //Activate first tab
// $(".tab_content:first").show(); //Show first tab content
//On Click Event
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active"); //Remove any "active" class
$(this).addClass("active"); //Add "active" class to selected tab
$(".tab_content").hide(); //Hide all tab content
var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
$(activeTab).fadeIn(); //Fade in the active ID content
return false;
});
});
(function($) {
$(document).ready(function(){
$('.menu1').ptMenu();
$('.menu2').ptMenu({vertical:true});
});
})(jQuery);
I have taken a look at this for a few days and tried many things with no luck, any help is appreciated. Thanks! Ok, here's the page as it is right now: http://www.crackin.com/dev/index.php The paganation for the top 3 images is Sweet Pages: http://tutorialzine.com/2010/05/swee...tion-solution/ The content loading below is a page-replace script I got he http://css-tricks.com/dynamic-page-replacing-content/ And I'm also trying to integrate shadowbox (or lightbox, whichever will work) into the lower set of images. I have 2 problems right now I can't figure out, and I'm sure it somehow has to do with the fact I'm trying to mash 3 different JS addons into a single page, I'm still pretty new to this whole JS thing... First problem I'm having is that IE7 and Opera don't like the links in the upper images. Clicking a gallery image does not load the associated page below from those 2 browsers, however IE8 and FF seem to work fine. Second problem is getting shadowbox/lightbox to work on those lower images. I tried a couple different things but main thing I did is make sure the script is actually working by setting the header text to a link with shadowbox attached and that worked. That same link doesn't work when applied to the lower images (loads image in new window). Lightbox does the same thing. Thanks for any help. I hope I have this post in the right place! Any help would be very much appreciated... I have a feature on my website that allows users to choose the website background (using alternate css sheets) and then uses an externally linked javascript file to store the background choice as a cookie so it is consistent throughout the website. This works perfectly locally (i.e. when previewing my website on my computer) but now it is uploaded to my host it doesn't appear to be working. (with the same browser) My javascript is he http://www. b r p - e n v .com/javascript/backgroundchange.js (with no spaces) The website that the javascript file is linked to is http://www. b r p - e n v .com (with no spaces) In the head I have: <script type="text/javascript" src="../javascript/backgroundchange.js"></script> ...then I have: <body onload="set_style_from_cookie()"> ...and for users to choose which background: <form> <input type="image" src="../images/white-background-thumb.jpg" onclick="switch_style('bg1');return false;" name="theme" value="White" id="bg1"> etc... </form> My problem is: The background reverts back to the default when moving to a different page. This would indicate that the background choice is not being saved in cookies. But this works locally! I have tried putting the javascript directly onto each page but I still had the same problem. I hope someone can help, I will be so grateful if I can get this to work. Many thanks indeed! I have a usercontrol which get inputs from the user and show the slideshows. I have added jquery.js and jqfancytransitions.js to the control. when i apply the effects dynamically it is working on local iis but the same coding is not working on iis server. The link for the page is http://www.gloriatech.com/slideshow.aspx . Actually it display the images but no effects are applied. I also checked the js files, it is in right path only.When i checked this page in firebug , it shows the error which is " Sys is undefined". I dont know how to solve it. Can anyone help me? Thanx in advance. |
|||||||