JavaScript - Automatic Click In Function
Hi, hope someone can help. doing some work with google maps api. I have a function called codeaddress, this is triggered by a search button.
is there a way to add js to make an automatic click on results after search ? here is code of function.. Code: function codeAddress() { var address = document.getElementById("address").value; geocoder.geocode( { 'address': address}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { map.setCenter(results[0].geometry.location); map.setZoom(10); } else { alert("City was not found: " + status); } }); } Similar TutorialsHi All, This is in ASP.Net Im creating a task loggin system and this allows the user to raise tasks and update them, im using javascript for validation and if the fields are empty it then changes the fields back ground to Red which is fine but then it goes on to update the data in SQL which i dont want, any suggestions or how i can achieve no post back is the result from the function is False (for fields in error) Html Code where im calling the function Code: <asp:button runat="server" id="btnChangeCommentsAuth" CSSclass="RaiseButton" OnClientClick="CommentsCheck('MainDisplayContentChange_txtAuthCommentsArea');" PostBackUrl="~/RaiseTaskChange.aspx" Text="Auth" /> Javascript function Code: function CommentsCheck(comments) { var com; var result = new boolean(); com = document.getElementById(comments); if (document.getElementById(comments).value == '') { com.style.backgroundColor = "#B20635"; result = 0; } else { result = 1 } } Thanks in Advance look forward to your reply. I am trying to create a function that clicks a button within an iframe. I hope this is all that is needed.... i figured something like this but i know i’m wrong cause it doesn’t work. function close_it(){ var s = document.getElementById(“messagesBox”); var go = s.getElementByClassName(“box_title”); go.click(); return false; } Here’s the Dom Tree. <div class="messagesBox" id="messagesBox" style=""> <div style="" class="birdie clearfix"> //The 401 is differant everytime. <div class="box_blue"> <div class="box_top "> <a href="#" onclick="message.callNextInContainer($(this));return false" class="box_title" style"">X</a> Any help would be much appreciated. I need to simulate a mouseclick on a hyperlink with a function. Any idea if this is possible ? Hi guys I kinda needed help on jQuery/ javascript.. Here's the test page.. http://development.andrewfopalan.com/devpage/test.html# what I'm trying to do is like this.. http://trailers.apple.com/trailers/s...bandofmisfits/ the movie box... so far, I have made the cosmetics.. but the thing I was going to ask was.. when you click on the down arrow.. a popup dropdown list is going to show.. the problem is I am copying the same effect as the one with apple.. when you click outside of the popup dropdown list, the dropdown list should be fading out... but it wouldnt... I tried using doing.. it like this Code: $("#wrap" ).click(function () { $(".dropdown").fadeOut(); }); but the problem is.. whenever I click the down arrow button.. it continues to fadeout.. as soon as it fadesin... how should I do this? please guide me.. everything works just fine.. just this one.. I am really lost.. i the whole jquery code is in the page sirs... please help me pretty new to javascript/jquery.. How can I do this? I'm new to JavaScript. I tried messing with While but it just caused lag as it kept looping infinitely. The problem I think is that I have a variable that changes every time I click the button. The function changes the variable. So it successfully changes the variable once to my likings, then when I click the button (thus running the function) it does nothing. Here's an example I created to show you Quote: <html> <head> <script type="text/javascript"> var x = 50; var y = Math.floor(Math.random()*5); function test() { var a = x+y document.getElementById("testing").innerHTML=a; } </head> <body> <p id="testing"></p> <input type="button" value="asdf" onclick="test()" /> </body> </html> So in this case, I need to click the button multiple times in which each time it should add y to x. It only works once and then goes kaput. Thanks! Hi, I have a DOM click event that creates a <span>. When the user clicks a button, it turns that <span> into a textarea that the user can type a new name in, press enter, and then the span contains the text the user input. Sort of like when you rename a file in Windows Explorer. Anyway, the code is something like this, and I'm wondering if I can use 'area_el' in this way... right now it's giving me the error that area_el is undefined, even though I define it in the function that contains the Event declaration. The first part is the Dom stuff to make it all work. It's not stuff I need to mess with, but I'm putting it here in case it's useful. Code: var Dom = { get: function(el) { if (typeof el === 'string') return document.getElementById(el); else return el; }, add: function(el, dest) { var el = this.get(el); var dest = this.get(dest); dest.appendChild(el); }, remove: function(el) { var el = this.get(el); if(el.parentNode != null) el.parentNode.removeChild(el); } }; var Event = { add: function() { if (window.addEventListener) { return function(el, type, fn) { Dom.get(el).addEventListener(type, fn, false); }; } else if (window.attachEvent) { return function(el, type, fn) { var f = function() { fn.call(Dom.get(el), window.event); }; Dom.get(el).attachEvent('on' + type, f); }; } }() }; The following code defines what happens when the user clicks submit to create a polygon. I also have some variables: Code: var created_area_array = Array(); var createdarea_index = 0; var number_of_areas_saved=0; var currently_renaming=false; Event.add(window, 'load', function() { Event.add('SubmitArea', 'click', function() { if(polyPoints.length>0) add_created_area(); }); }); Finally, where the issue is. I define area_el in the function below, and further down I want to pass it to a function within the "rename" click event, but I get an error that area_el is undefined. Code: function add_created_area() { number_of_areas_saved++; var area_el = document.createElement('span'); var area_el_remove = document.createElement('span'); var area_el_rename = document.createElement('span'); var new_entry = polyPoints; var new_entry_array_index = "Area" + (createdarea_index); var new_entry_array_name = "Area #" + (createdarea_index+1); area_el.innerHTML = '<span class=\"address-text\">' + new_entry_array_name + '</span><br>'; area_el_remove.innerHTML = "<a onMouseOver=\"rollover('address_remove')\" onMouseOut=\"rollout('address_remove')\" style='cursor:pointer;'>" + "<img src=\"images/tabs-icons/normal-address_remove.png\" name='address_remove' title='remove' alt='remove'></a> "; area_el_rename.innerHTML = "<a onMouseOver=\"rollover('area_rename')\" onMouseOut=\"rollout('area_rename')\" style='cursor:pointer;'>" + "<img src=\"images/tabs-icons/normal-area_rename.png\" name='area_rename' title='rename' alt='rename'></a> "; created_area_array[new_entry_array_index] = new_entry; createdarea_index++; Dom.add(area_el_remove, 'CreatedAreas'); Dom.add(area_el_rename, 'CreatedAreas'); Dom.add(area_el, 'CreatedAreas'); Event.add(area_el, 'click', function(e) { if(!currently_renaming) { polyPoints = []; var thePolyPoints = (created_area_array[new_entry_array_index]).toString(); alert(thePolyPoints); //formatting created_area_array[new_entry_array_index] to store as polygon points in the polyPoints array thePolyPoints = thePolyPoints.replace(/[\[\]{}]/g, ""); thePolyPoints = thePolyPoints.replace(/Location/g, ""); //adding the co-ordinates to the polyPoints array thePolyPoints = thePolyPoints.split(","); for(var ctr=0; ctr+1<thePolyPoints.length; ctr+=2) { var location1 = new Microsoft.Maps.Location(thePolyPoints[ctr],thePolyPoints[ctr+1]); polyPoints.push(location1); } var out=""; for(var i=0; i<polyPoints.length; i++) { out += polyPoints[i] + " "; } alert(out); //creating the polygon and searching... if(create_area==true) { drawPolygon(); polygonSearch(); } else if(create_area==false) { document.getElementById('createarea').innerHTML = "<a id='createarea'><span class='create_area' style='color:blue'><strong>Create Area</strong></span></a>"; document.getElementById("mapDiv").oncontextmenu = function(){return false} MouseUpHandlerId = Microsoft.Maps.Events.addHandler(map, "mouseup",MouseUpHandler); MouseDownHandlerId = Microsoft.Maps.Events.addHandler(map, "mousedown",MouseDownHandler); MouseMoveHandlerId = Microsoft.Maps.Events.addHandler(map, "mousemove",MouseMoveHandler); MouseOverHandlerId = Microsoft.Maps.Events.addHandler(map, "mouseover",MouseOverHandler); drawPolygon(); polygonSearch(); create_area=true; } } }); Event.add(area_el_remove, 'click', function(e) { Dom.remove(this); Dom.remove(area_el_rename); Dom.remove(area_el); if(number_of_areas_saved>1) number_of_areas_saved--; }); Event.add(area_el_rename, 'click', function(e) { if(!currently_renaming) { area_el.innerHTML = '<textarea name=\"renaming_area\" id=\"renaming_area\" style=\"width:200px;height:10px;background-color:#DCDCDC; resize:none;font-size:8px;\" onKeyPress=\"return enter_rename(area_el, event)\" maxlength=\"30\"></textarea><br>'; currently_renaming=true; } }); Event.add("createdarea_clear", 'click', function(e) { Dom.remove(area_el_remove); Dom.remove(area_el_rename); Dom.remove(area_el); created_area_array = []; number_of_areas_saved=0; createdarea_index=0; }); } The enter_rename(area_el, event) function that isn't passing in my variable. Code: function enter_rename(area_el, event) { var keyPressed = (event.which) ? event.which : event.keyCode; var current_str = document.getElementById("renaming_area").value; if(keyPressed == 13) { if(current_str.length>0) { if(allSpaces(current_str)==true) { alert("Please enter a meaningful area name."); return false; } else { area_el.innerHTML = '<span class=\"address-text\">' + current_str + '</span><br>'; currently_renaming=false; return true; } } else return false; } else return true; } Making area_el global does not clear the span elements when I click my "createdarea_clear" button, however when it's local, the function works as expected. Hi guys I kinda needed help on jQuery/ javascript.. Here's the test page.. http://development.andrewfopalan.com/devpage/test.html# what I'm trying to do is like this.. http://trailers.apple.com/trailers/s...bandofmisfits/ the movie box... so far, I have made the cosmetics.. but the thing I was going to ask was.. when you click on the down arrow.. a popup dropdown list is going to show.. the problem is I am copying the same effect as the one with apple.. when you click outside of the popup dropdown list, the dropdown list should be fading out... but it wouldnt... I tried using doing.. it like this Code: $("#wrap" ).click(function () { $(".dropdown").fadeOut(); }); but the problem is.. whenever I click the down arrow button.. it continues to fadeout.. as soon as it fadesin... how should I do this? please guide me.. everything works just fine.. just this one.. I am really lost.. i the whole jquery code is in the page sirs... please help me pretty new to javascript/jquery.. I have a question: look at the following html code: /****html***/ <div class='class1'>text1</div> <div class='class1'>text2</div> <div class='class1'>text3</div> ...... /**html***/ If I want to change the background color of the textn by clicking it, what should I do instead of inserting "onclick='someFunction()'" in every div? Greetings, I'm looking to add keycode Accessibility to an html + javascript interaction. It's basically like tic tac toe where a user clicks on a cell (these cells are created by divs) and an 'O' appears in the cell. I'd like to be able to tab through the cell fields and hit the spacebar to put the 'O' in the focused cell. Here's an example of the html divs... [code] <div class="grid"> <div class="row row-1"> <div class="box true"><div class="inner" tabindex="0" id="orange"></div></div> <div class="box true"><div class="inner" tabindex="0" id="orange"></div></div> <div class="box true"><div class="inner" tabindex="0" id="orange"></div></div> <div class="box"><div class="inner" tabindex="0" id="orange"></div></div> <div class="clear"></div> </div> </div> [code] What I'm needing to know is where/what code goes into the .js to set up a keydown event. Here's the .js being used... [code] $(document).ready(function() { // init $('#holder .section:first').addClass('current-slide'); $('#nav .btn:first').addClass('current-slide'); $('#holder .section').addClass('noanswer'); $('#holder .section').delay(300).animate({'top':'0px'},{duration:600,easing:'easeOutCirc'}); //how fast the screen comes down // end init $('.noanswer .box').hover(function() { if ($(this).hasClass('selected')) { $(this).addClass('box-highlight-hover'); } else { $(this).addClass('box-highlight'); } }, function() { if ($(this).hasClass('selected')) { $(this).removeClass('box-highlight-hover'); } else { $(this).removeClass('box-highlight'); } }); // box functions $('.noanswer .box').live('click',function() { $(this).addClass('selected'); }); $('.noanswer .selected').live('click',function() { $(this).removeClass('selected'); $(this).removeClass('box-highlight-hover'); }); // slide animations $('#nav .mobility-btn').click(function() { if ($('.section').is(':animated')) { } else { $('#nav .btn').removeClass('current-slide'); $(this).addClass('current-slide'); $('.section').css({'z-index':'5'}); $('#mobility').css({'top':'-350px','z-index':'10'}); $('#mobility').animate({'top':'0px','z-index':'10'},{duration:600,easing:'easeOutCirc'}); //how fast the screen comes down $('.section').removeClass('current-slide'); $('#mobility').addClass('current-slide'); } }); $('#nav .vision-btn').click(function() { if ($('.section').is(':animated')) { } else { $('#nav .btn').removeClass('current-slide'); $(this).addClass('current-slide'); $('.section').css({'z-index':'5'}); $('#vision').css({'top':'-350px','z-index':'10'}); $('#vision').animate({'top':'0px','z-index':'10'},{duration:600,easing:'easeOutCirc'}); //how fast the screen comes down $('.section').removeClass('current-slide'); $('#vision').addClass('current-slide'); } }); $('#nav .hearing-btn').click(function() { if ($('.section').is(':animated')) { } else { $('#nav .btn').removeClass('current-slide'); $(this).addClass('current-slide'); $('.section').css({'z-index':'5'}); $('#hearing').css({'top':'-350px','z-index':'10'}); $('#hearing').animate({'top':'0px','z-index':'10'},{duration:600,easing:'easeOutCirc'}); //how fast the screen comes down $('.section').removeClass('current-slide'); $('#hearing').addClass('current-slide'); } }); $('#nav .cognitive-btn').click(function() { if ($('.section').is(':animated')) { } else { $('#nav .btn').removeClass('current-slide'); $(this).addClass('current-slide'); $('.section').css({'z-index':'5'}); $('#cognitive').css({'top':'-350px','z-index':'10'}); $('#cognitive').animate({'top':'0px','z-index':'10'},{duration:600,easing:'easeOutCirc'}); //how fast the screen comes down $('.section').removeClass('current-slide'); $('#cognitive').addClass('current-slide'); } }); // result $('.answerSubmit').hover(function() { $(this).addClass('answerSubmitHover'); }, function() { $(this).removeClass('answerSubmitHover'); }); $('.answerSubmit').live('click',function() { var parent = $(this).parents('.section'); var scoreParent = $(this).parent('.result'); // Calculate max score var maxScore = parent.find('.box').length; // Calculate actual score var actualScore; var selectednotTrue = 0; var selectedCorrect = 0; var notTrue = 0; actualScore = parent.find('.box').length; selectedCorrect = parent.find('.box.selected.true').length; notTrue = parent.find('.box:not(.true)').length; selectednotTrue = parent.find('.box.selected:not(.true)').length; actualScore = notTrue - selectednotTrue + selectedCorrect; scoreParent.find('.answer').html(actualScore); scoreParent.find('.outOf').html(maxScore); $(this).hide(); parent.find('.score').show(); parent.addClass('answer').removeClass('noanswer'); }); }); [code] Please let me know if I'm unclear or if more code is necessary. Thanks for any help you can give! k Hi all, Background: I'm currently working on a landing page which will display the same on both desktop & mobile devices, which is what we "want" for now. However, we've created an alternate registration page for mobile devices. This page can be accessed by clicking on a specific button, which has a class on it that will determine if the user is on a mobile device or not. If they are not, the normal action will occur, such as a registration popup, built specifically for desktop users. The problem is: I'm firstly having to use .remove to take away the class of pbx_ajax which operates the popup, so mobile users aren't affected by the popup and will continue onto the page we specially built for them. However, it seems my script is removing the class straight away, which prevents the popup from working for desktop users. Secondly, the script doesn't actually seem to work, it simply doesn't fire, which begs the question if i've cocked up my class bind. Code is attached below, please if anyone has any advice, do let me know as i'm at my wits end. Oh and i'm sure you'll notice, i'm polling for when the jQuery has loaded, as the library is located at the bottom of our site (its a rather large site). The javascript/jquery Code: //$(document).ready(function() { //Global function that will detect what device the page is being viewed on function globalDetectDevice() { var deviceIphone = "iphone"; var deviceIpod = "ipod"; //Initialize our user agent string to lower case. var uagent = navigator.userAgent.toLowerCase(); //************************** // Detects if the current device is an iPhone or iPod Touch. function DetectDevice() { if (DetectIphone()) { window.location = "/landing/register/mobile" ; } else if (DetectIpod()) { window.location = "/landing/register/mobile" ; } else { return false; } } } //Binding the above function to a class, that we can then attach to any clickable element //As jQuery is at the bottom of page, we poll the function until jQuery has loaded, once loaded, we clear the polling using clearTimout var bindTimer = setInterval(function() { if ("undefined" != typeof jQuery && globalDetectDevice) { $('.detectDevice').removeClass('pbx_ajax').bind('click', DetectDevice); clearTimeout(bindTimer); } }, 50); //} the html button Code: <a class="detectDevice pbx_ajax" title="Join Free" href="?cat=popup&action=open&settings=pbx_popup_register">~graphic("btn-get-started-prints-LP")</a> thanks for any help Ok know those people who are in the bad habit of double clicking everything? Well my site breaks if they double click it... is there a script I can use that won't let my functions run more then once every so many seconds? to avoid double clicking errors? Hi back again, another add on to my add more inputs thread Im trying to add automatic number when i add more inputs. but starting from what has already been inputted. For example I have volumes of a series. with volume 1 2 3 and 4 already made and I have a form to input another volume title. or in this case multiple forms. I want to add more inputs with the default values to keep adding +1 so... continueing with 5 6 7 8 and etc. What i have. I think im really bad at math or something or im just stupid. Problem is it resets the var number when i keep pushing to add more inputs. I've tried some if() but im just stupid... var limit = 20; // max number of rows in total var LIMIT=1; var theNumber = 0; var currentNumber = 0; Code: function addRow(number){ var currentNumber = number + 1; var content1='<input size="3" type="text" name="number[]" value="' + currentNumber + '"/>'; var content2='<input type="text" name="title[]">'; var content3='<input size="10" type="text" name="aka[]">'; currentNumber++; // NON IMPORTANT STUFF AFTER THIS if (LIMIT == limit) { alert("You have reached the limit of adding " + (limit) + " inputs"); return false; // just leave } LIMIT++; tabBody=document.getElementsByTagName("TBODY").item(0); row=document.createElement("TR"); cell1 = document.createElement("TD"); cell2 = document.createElement("TD"); cell3 = document.createElement("TD"); cell1.innerHTML=content1; cell2.innerHTML=content2; cell3.innerHTML=content3; row.appendChild(cell1); row.appendChild(cell2); row.appendChild(cell3); tabBody.appendChild(row); } how to automatic append picture to a list? check text in span,if it match today,a picture append after meeting(4-22) code like this. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <style type="text/css"> .li_title { list-style-type:none; font-size:12px; line-height:24px; } .date {float:right;margin-right:3px;} </style> </HEAD> <BODY> <DIV id=Conttab_p_switch1 style="POSITION: relative"> <UL> <LI class="li_title"><span class="date">2011-04-22</span><A title=meeting(4-22) href="#" rel="nofollow" target=_blank>meeting(4-22)</A></LI> <LI class="li_title"><span class="date">2011-04-11</span><A title=meeting(4-11) href="#" rel="nofollow" target=_blank>meeting(4-11)</A></LI> <LI class="li_title"><span class="date">2011-04-04</span><A title=meeting(4-04) href="#" rel="nofollow" target=_blank>meeting(4-04)</A></LI> </UL> </DIV> </BODY> </HTML> Hi all, I need help with my problem. I have a plasma TV on which I invoking a lot of different short videos and I need at this TV also displayed a particular Web page. Video length is variable and depends on the actual length of the video currently playing and display the Web page is always 3 minutes. I'd like to do in this format: video1.html (3 minutes) -> pocasi.cz (5 minutes) -> video2.html (10 minutes) -> pocasi.cz (5 minutes)->...-> video30.html (1,5 minutes) -> pocasi.cz (5 minutes) -> video1.html (2,5 minutes )->... . Video's and web page in full screen without buttons. Can someone please advise how the script should look like? Thank you for your advice. Hi friends, I am collecting and selling football stickers. Yes, World Cup 2010 stickers. The album have 640 distinct numbers. Everytime I receive a list of that stickers to buy by the user I would need ckeck out the price list because some stickers have different price from another. For example Stickers numbers: 00, 000, 1, 2, 3, 4, 5 and 29 costs 3,00. The stickers number 31, 50, 69, 88, 107, 126, 202, 411, 392, 544 and 637 costs = 1,00. The stickers 30, 49, 68, 87, 106, 125 costs 0,25 The sticker from 32 to 48 51 to 67 70 to 86 89 to 105 (and so on) costs 0,25 I would be glad if someone could help me for building a script which read from a textarea numbers contents and create a "short report" with the stickers numbers followed by its price and total sum. Bob Kuspe I have two vertical frames. The left frame has an image that scales to 100% of the window's height. I am trying to make the page automatically resize the width of that left frame so that it exactly fits the scaled image's width in order to always give the right frame as much space as possible, but I can't seem to get it to work. Can anyone help me out? Here's the code for my frameset: Code: <html> <frameset id="MyFrameset" cols="25%,*" frameborder="no" border="0"> <frame noresize="noresize" src="Leftframe.html" name="LeftFrame"> <frame noresize="noresize" src="Rightframe.html" name="RightFrame"> </frameset> </html> And here's the code for my left frame: Code: <html> <body style="overflow:hidden; margin:0; padding:0" onload="parent.document.getElementById('MyFrameset').setAttribute('cols', 'document.body.clientWidth,*', 0);"> <img src="image.JPG" style="border:none;" height="100%" alt="image"/> </body> </html> Oh yeah, the reason why I need to do this is so if someone is viewing the page on a widescreen monitor, the left frame won't eat up more space than necessary. Hello I have a html page which just enter the coordinates of a city and appear that processes the data file javascript. this is the part where I put the coordinates manually: Code: <script type="text/javascript"> var date = new Date(); // today var times = prayTimes.getTimes(date, [44, 11], +2); So far we have and everything worked .. just that I want to create a table with all names of cities, click on a city data appear to me .. there is some code that could only enter the coordinates by clicking on the name of the city, instead of entering all the time coordinates? thanks again p.s. sorry for my bad english Quote: The parameter A should display the sum of the remaining six fields. I did try adding that using the JAVA script that is mentioned in second code. The total should be display immediately after value is set for any of the text boxes. The text box gets the value using drop down menu. This procedure only works if I use the keyboard tab. If I use the mouse to select YES and No, then it will not display the total Code: <html> <head> <script type="text/javascript" src="javascript/addfunctions.js"></script> <script type="text/javascript"> function enable1() { document.audit_billing_IE.Para_A_A1_comment.disabled = false; document.audit_billing_IE.Para_A_A1_score.value = 00; } function enable2() { document.audit_billing_IE.Para_A_A2_comment.disabled = false; document.audit_billing_IE.Para_A_A2_score.value = 00; } function enable3() { document.audit_billing_IE.Para_A_A3_comment.disabled = false; document.audit_billing_IE.Para_A_A3_score.value = 00; } function enable4() { document.audit_billing_IE.Para_A_A4_comment.disabled = false; document.audit_billing_IE.Para_A_A4_score.value = 00; } function enable5() { document.audit_billing_IE.Para_A_A5_comment.disabled = false; document.audit_billing_IE.Para_A_A5_score.value = 00; } function enable6() { document.audit_billing_IE.Para_A_A6_comment.disabled = false; document.audit_billing_IE.Para_A_A6_score.value = 00; } function disable1() { document.audit_billing_IE.Para_A_A1_comment.disabled = true; document.audit_billing_IE.Para_A_A1_score.value = 10; } function disable2() { document.audit_billing_IE.Para_A_A2_comment.disabled = true; document.audit_billing_IE.Para_A_A2_score.value = 10; } function disable3() { document.audit_billing_IE.Para_A_A3_comment.disabled = true; document.audit_billing_IE.Para_A_A3_score.value = 10; } function disable4() { document.audit_billing_IE.Para_A_A4_comment.disabled = true; document.audit_billing_IE.Para_A_A4_score.value = 10; } function disable5() { document.audit_billing_IE.Para_A_A5_comment.disabled = true; document.audit_billing_IE.Para_A_A5_score.value = 10; } function disable6() { document.audit_billing_IE.Para_A_A6_comment.disabled = true; document.audit_billing_IE.Para_A_A6_score.value = 10; } function na1() { document.audit_billing_IE.Para_A_A1_comment.disabled = true; document.audit_billing_IE.Para_A_A1_score.value = 00; } function na2() { document.audit_billing_IE.Para_A_A2_comment.disabled = true; document.audit_billing_IE.Para_A_A2_score.value = 00; } function na3() { document.audit_billing_IE.Para_A_A3_comment.disabled = true; document.audit_billing_IE.Para_A_A3_score.value = 00; } function na4() { document.audit_billing_IE.Para_A_A4_comment.disabled = true; document.audit_billing_IE.Para_A_A4_score.value = 00; } function na5() { document.audit_billing_IE.Para_A_A5_comment.disabled = true; document.audit_billing_IE.Para_A_A5_score.value = 00; } function na6() { document.audit_billing_IE.Para_A_A6_comment.disabled = true; document.audit_billing_IE.Para_A_A6_score.value = 00; } function changed1(el) { var sel = el.options[el.selectedIndex]; if (sel.value == "Yes")disable1(); if (sel.value == "No")enable1(); if (sel.value == "Na")na1(); } function changed2(el) { var sel = el.options[el.selectedIndex]; if (sel.value == "Yes")disable2(); if (sel.value == "No")enable2(); if (sel.value == "Na")na2(); } function changed3(el) { var sel = el.options[el.selectedIndex]; if (sel.value == "Yes")disable3(); if (sel.value == "No")enable3(); if (sel.value == "Na")na3(); } function changed4(el) { var sel = el.options[el.selectedIndex]; if (sel.value == "Yes")disable4(); if (sel.value == "No")enable4(); if (sel.value == "Na")na4(); } function changed5(el) { var sel = el.options[el.selectedIndex]; if (sel.value == "Yes")disable5(); if (sel.value == "No")enable5(); if (sel.value == "Na")na5(); } function changed6(el) { var sel = el.options[el.selectedIndex]; if (sel.value == "Yes")disable6(); if (sel.value == "No")enable6(); if (sel.value == "Na")na6(); } </script> </head> <body> <form name="audit_billing_IE" method="POST" action="billing.php"> <table> <tr> <td> Parameter A </td> <td colspan='3'> <input type="text" name="product_name4" id="product_name4" /> </td> </tr> <tr> <td> Procedure </td> <td> <select name="Para_A_A1" id = "Para_A_A1" align="center" onchange="changed1(this)"> <option value="s1"> Select</option> <option value="Yes"> Yes </option> <option value="No"> No </option> <option value="Na"> Na </option> </select> </td> <td> <input type="text" name="Para_A_A1_comment" value="" disabled/> </td> <td align="center"> <input type="text" name="Para_A_A1_score" value="" onFocus="startCalc();" onBlur="stopCalc();"/> </td> </tr> <tr> <td> Days Calculation </td> <td> <select name="Para_A_A2" id = "Para_A_A2" align="center" onchange="changed2(this)"> <option value="s2"> Select</option> <option value="Yes"> Yes </option> <option value="No"> No </option> <option value="Na"> Na </option> </select> </td> <td > <input type="text" name="Para_A_A2_comment" value="" disabled/> </td> <td> <input type="text" name="Para_A_A2_score" id="Para_A_A2_score" value="" onFocus="startCalc();" onBlur="stopCalc();"/> </td> </tr> <tr> <td> request form </td> <td> <select name="Para_A_A3" align="center" onchange="changed3(this)"> <option value="s3"> Select</option> <option value="Yes"> Yes </option> <option value="No"> No </option> <option value="Na"> Na </option> </select> </td> <td > <input type="text" name="Para_A_A3_comment" value="" disabled/> </td> <td> <input type="text" name="Para_A_A3_score" id="Para_A_A3_score" value="" onFocus="startCalc();" onBlur="stopCalc();" /> </td> </tr> <tr> <td> Case </td> <td> <select name="Para_A_A4" align="center" onchange="changed4(this)"> <option value="s4"> Select</option> <option value="Yes"> Yes </option> <option value="No"> No </option> <option value="Na"> Na </option> </select> </td> <td > <input type="text" name="Para_A_A4_comment" value="" disabled/> </td> <td> <input type="text" name="Para_A_A4_score" id="Para_A_A4_score" value="" onFocus="startCalc();" onBlur="stopCalc();"/> </td> </tr> <tr> <td> interaction </td> <td> <select name="Para_A_A5" align="center" onchange="changed5(this)"> <option value="s5"> Select</option> <option value="Yes"> Yes </option> <option value="No"> No </option> <option value="Na"> Na </option> </select> </td> <td > <input type="text" name="Para_A_A5_comment" value="" disabled/> </td> <td> <input type="text" name="Para_A_A5_score" id="Para_A_A5_score" value="" onFocus="startCalc();" onBlur="stopCalc();"/> </td> </tr> <tr> <td> MIS</td> <td> <select name="Para_A_A6" align="center" onchange="changed6(this)"> <option value="s6"> Select</option> <option value="Yes"> Yes </option> <option value="No"> No </option> <option value="Na"> Na </option> </select> </td> <td > <input type="text" name="Para_A_A6_comment" value="" disabled/> </td> <td> <input type="text" name="Para_A_A6_score" id="Para_A_A6_score" value="" onFocus="startCalc();" onBlur="stopCalc();"/> </td> </tr> </table> </form> </body> </html> Code: function startCalc(){ interval = setInterval("calc()",1); } function calc(){ one = document.audit_billing_IE.Para_A_A1_score.value; two = document.audit_billing_IE.Para_A_A2_score.value; three = document.audit_billing_IE.Para_A_A3_score.value; four = document.audit_billing_IE.Para_A_A4_score.value; five = document.audit_billing_IE.Para_A_A5_score.value; six = document.audit_billing_IE.Para_A_A6_score.value; document.audit_billing_IE.product_name4.value = [(one * 1) + (two * 1) + (three * 1) + (four * 1) + (five * 1) + (six * 1)]; } function stopCalc(){ clearInterval(interval); } Hi, I admit from the start, I'm not very good with JS, I've used it a few times over the years, but mostly readymade scripts that I can just link to a website and use. Anyway, I need something somewhat specific and I don't know where to find such a code or even if I can modify the one I have found to do what I need. What I need is to be able to update totals on the page as things are changed, but I'm not talking about one total. What I have is a list of spare parts with a quantity box next to them, when someone changes the quatity the price for that part needs to update as well as the total price AND a sum that is an allocated amount minus the total (so they can see how much of their allocation they have left). So far, all I've managed to find is a script that will update just the final total (http://www.mcfedries.com/JavaScript/OrderTotals.asp), but as you can see, that's not that helpful. I've sat and stared at the code and while I can say what things do what, I wouldn't know where to start in changing it. Hope someone can help! Thanks Form cap: http://img38.imageshack.us/img38/8118/partlist.png |