JavaScript - Forms With Increment Function
Hello to codingforums,
This is my beginning posting here as I am mostly reading, compiling and so.. There are multiple forms in the script generated page, that has to update via script url - and the problem is probably looping through form script -so please help with this as only first form submit correctly while other pass value from 1st - need looping method or condition? Code: <SCRIPT language=Javascript> function getMessage(hwm) { loc = './index.php?p=ordersBasket&sOption=add'; jlc = document.getElementById('qty'); jloc = document.getElementById('pid'); nloc = loc+ '&iProduct='+jloc.value+ '&iQuantity='+jlc.value; self.location = nloc; } </SCRIPT> <FORM id="123" name="123"> <input type="button" id="minus" value="-" onClick="qty.value = (qty.value-1)"> <input type="button" value="+" onClick="qty.value = (+qty.value+1)"> <input type="text" size="4" id="qty" name="name" value="3" /> <INPUT TYPE="text" id="pid" VALUE="123" /> <INPUT TYPE="button" value="order" onclick="getMessage(this)"> </FORM> <FORM id="456" name="456"> <input type="button" id="minus" value="-" onClick="qty.value = (qty.value-1)"> <input type="button" value="+" onClick="qty.value = (+qty.value+1)"> <input type="text" size="4" id="qty" name="name" value="3" /> <INPUT TYPE="text" id="pid" VALUE="456" /> <INPUT TYPE="button" value="order" onclick="getMessage(this)"> </FORM> <FORM id="789" name="789"> <input type="button" id="minus" value="-" onClick="qty.value = (qty.value-1)"> <input type="button" value="+" onClick="qty.value = (+qty.value+1)"> <input type="text" size="4" id="qty" name="name" value="3" /> <INPUT TYPE="text" id="pid" VALUE="789" /> <INPUT TYPE="button" value="order" onclick="getMessage(this)"> </FORM> Similar TutorialsHi Coders, I have a javascript function which lets a user to choose one of the 7 option buttons on a "mainsub.asp" page and the page will then be forwarded to one of the 7 process pages depending on what has been chosen. The problem is that firefox is angry with the first line ("if" statement) and tells the following in its error console: Error: document.forms[0].C1 is not a function Source File: [localhost...] Line: 117 Here is the code: function fSubmit(){ if (document.forms[0].C1(0).checked) document.forms[0].action="process.asp"; else if (document.forms[0].C1(1).checked) document.forms[0].action="process1.asp"; else if (document.forms[0].C1(2).checked) document.forms[0].action="process2.asp"; else if (document.forms[0].C1(3).checked) document.forms[0].action="process3.asp"; else if (document.forms[0].C1(4).checked) document.forms[0].action="process4.asp"; else if (document.forms[0].C1(5).checked) document.forms[0].action="process5.asp"; else if (document.forms[0].C1(6).checked) document.forms[0].action="process6.asp"; else document.forms[0].action="process.asp"; return; } Internet explorer does not complain about anything and does its job great. But I could not figure out how to change the code to be also compliant with Firefox? Thanks for all the comments. I'm using the autofill forms plugin for firefox which can be found he https://addons.mozilla.org/en-US/firefox/addon/4775 I use it to automatically fill various web forms, duh. But I would like certain values to be chosend randomly from a list I create. I contacted the developer and he said the add on probably does not need a new feature because there is a 'dynamic tags' function to fill certain forms with dynamic values (e.g. the current time or date). He has given over the project to another developer and told me I probably would find a solution in a good javascript programming forum. So here I am! Can anyone help me with this? Basically, I just need a javascript code which chooses on item from an array randomly, I guess? I'm not a programmer myself, so any help would be greatly (!) appreciated. Thanks a lot in advance for any further guidance! Note: Here are sample dynamic tags from the plugin: <datetime> new Date().toLocaleString() <useragent> navigator.userAgent <langcode> navigator.language <resolution> screen.width+'x'+screen.height <clipboard> this.getClipboardText() I need to develop this feature for a charity site displays a number that counts up 1 every 15 seconds. This is to show how many times a kid is abused in this country. I've been researching this and haven't been able to find anything helpful yet. I figured this piece of code was a good start: function doSomething() { setTimeout('doSomething()',15000); } I'm super stuck. Is it possible to increment in a for...in loop? This is what I'm trying to do, but the increments aren't happening. Any help or advice is much appreciated!! Code: var i_1 = 3; var i_2 = 8; for (var key in data.id) { if ([key] < '4') { attach_to = '.active'; } else if ([key] > i_1 && [key] < i_2) { attach_to = '.item_' + i_1; } document.write(attach_to + '<br/>' + i_1+ '<br/>'); i_1 + 4; i_2 + 4; } First off, i have no idea what to do, because when i get beyond the realm of html/css, vb and php (some) i become lost. I hope someone can help me achieve this because i have no idea what i'm doing, and I've been at it for 2 weeks and no money to hire someone to do this for me. If you ever been in my situation, you know exactly how i feel. I have no code of my own to show you, but hope someone can still help me. I'm have a number 0.0000000, and every min i need that number to increase to 0.0000000, than to 0.0000002 and so on and so forth. Every time i click a button, whatever the number has risen to, it will reset it back down to 0.0000000. Can someone help me out with this? Hi again, I have written the follow code. It is meant to (when finished) output a table showing each member of the array PEOPLE. There Income ,there Tax bracket and there finally there total tax paid. The calulations in the if-else statements are correct. I have to create a loop that will go through the if else statements equal to the amount of the people in the array (This is no problem I have done this earlier) My problem is when I try to add each element (PEOPLE) to the table or there indivual tax outcomes. Can I create a loop and increment in the elements each iteration to put on the table?(for there names) As I am not meant to store each iteration,it is to write to the table each time. This is the code I'm working on with out the loop. [CODE]<html> <head> <script> PEOPLE = new Array ('Mr Dobbaleana','David Lai','Richard Watson','Leigh Brookshaw','Stijn Dekeyser'); BRACKET_LIMITS = new Array (0,6000,37000,80000,180000); MIN_TAX = new Array (0.00,0.00,4650.00,17550.00,54550.00); TAX_RATES = new Array (0.00,0.15,0.30,0.37,0.45); var taxBracket =0; var taxToPay =0; document.writeln ('<table border="2">'); document.writeln ('<tr>'); document.writeln ('<th>'+('Name')+'</th>'); document.writeln ('<th>'+('Income')+'</th>'); document.writeln ('<th>'+('Bracket')+'</th>'); document.writeln ('<th>'+('Tax')+'</th>'); document.writeln ('</tr>'); var currentPersonInRow = parseInt(prompt('Enter your income')); if (currentPersonInRow <= BRACKET_LIMITS[1]){ taxBracket=BRACKET_LIMITS.indexOf(0); taxToPay = (currentPersonInRow-BRACKET_LIMITS[0])*TAX_RATES[0]+MIN_TAX[0]; // will give total taxable income } else if (currentPersonInRow<=BRACKET_LIMITS[2]){ taxBracket=BRACKET_LIMITS.indexOf(6000); taxToPay = (currentPersonInRow-BRACKET_LIMITS[1])*TAX_RATES[1]+MIN_TAX[1]; // will give total taxable income } else if (currentPersonInRow<=BRACKET_LIMITS[3]){ taxBracket=BRACKET_LIMITS.indexOf(37000); taxToPay = (currentPersonInRow-BRACKET_LIMITS[2])*TAX_RATES[2]+MIN_TAX[2]; // will give total taxable income } else if (currentPersonInRow<=BRACKET_LIMITS[4]){ taxBracket=BRACKET_LIMITS.indexOf(80000); taxToPay = (currentPersonInRow-BRACKET_LIMITS[3])*TAX_RATES[3]+MIN_TAX[3]; // will give total taxable income } else { taxBracket=BRACKET_LIMITS.indexOf(180000); taxToPay = (currentPersonInRow-BRACKET_LIMITS[4])*TAX_RATES[4]+MIN_TAX[4]; // will give total taxable income } document.writeln ('<tr>'); document.writeln ('<td>'+(PEOPLE[0])+'</td>'); document.writeln ('<td>'+('$')+(currentPersonInRow)+'</td>'); document.writeln ('<td>'+(taxBracket)+'</td>'); document.writeln ('<td>'+('$')+(taxToPay)+'</td>'); document.writeln ('</tr>'); </script> </head> <body> </body> </html> [/ICODE] OK this is the code I wrote and it works but doesnt meet the assigment critera. Code: <html> <head> <script> PEOPLE = new Array ('Mr Dobbaleana','David Lai','Richard Watson','Leigh Brookshaw','Stijn Dekeyser'); BRACKET_LIMITS = new Array (0,6000,37000,80000,180000); MIN_TAX = new Array (0.00,0.00,4650.00,17550.00,54550.00); TAX_RATES = new Array (0.00,0.15,0.30,0.37,0.45); var personZero = parseFloat( prompt ((' Enter income for ')+(PEOPLE[0]),('0.00'))); var personOne = parseFloat (prompt ((' Enter income for ')+(PEOPLE[1]),('0.00'))); var personTwo = parseFloat (prompt ((' Enter income for ')+(PEOPLE[2]),('0.00'))); var personThree = parseFloat (prompt ((' Enter income for ')+(PEOPLE[3]),('0.00'))); var personFour = parseFloat(prompt ((' Enter income for ')+(PEOPLE[4]),('0.00'))); if ((personZero >= BRACKET_LIMITS[0])&&(personZero <= BRACKET_LIMITS[1])) { var cal1= (personZero-BRACKET_LIMITS[0]); var cal2= (cal1*TAX_RATES[0]); var totalTaxPaid = (cal2+MIN_TAX[0]); var taxBracketOfPeople1=0; alert(totalTaxPaid); } if ((personZero >= BRACKET_LIMITS[1])&&(personZero <= BRACKET_LIMITS[2])) { var cal1= (personZero-BRACKET_LIMITS[1]); var cal2= (cal1*TAX_RATES[1]); var totalTaxPaid = (cal2+MIN_TAX[1]); var taxBracketOfPeople1=1; alert(totalTaxPaid); } if ((personZero >= BRACKET_LIMITS[2])&&(personZero <= BRACKET_LIMITS[3])) { var cal1= (personZero-BRACKET_LIMITS[2]); var cal2= (cal1*TAX_RATES[2]); var totalTaxPaid = (cal2+MIN_TAX[2]); var taxBracketOfPeople1=2; alert(totalTaxPaid); } if ((personZero >= BRACKET_LIMITS[3])&&(personZero <= BRACKET_LIMITS[4])) { var cal1= (personZero-BRACKET_LIMITS[3]); var cal2= (cal1*TAX_RATES[3]); var totalTaxPaid = (cal2+MIN_TAX[3]); var taxBracketOfPeople1=3; alert(totalTaxPaid); } if ((personZero >= BRACKET_LIMITS[4])) { var cal1= (personZero-BRACKET_LIMITS[4]); var cal2= (cal1*TAX_RATES[4]); var totalTaxPaid = (cal2+MIN_TAX[4]); var taxBracketOfPeople1=4; alert(totalTaxPaid); } if ((personOne >= BRACKET_LIMITS[0])&&(personOne <= BRACKET_LIMITS[1])) { var cal1= (personOne-BRACKET_LIMITS[0]); var cal2= (cal1*TAX_RATES[0]); var totalTaxPaid1 = (cal2+MIN_TAX[0]); var taxBracketOfPeople2=0; alert(totalTaxPaid1); } if ((personOne >= BRACKET_LIMITS[1])&&(personOne <= BRACKET_LIMITS[2])) { var cal1= (personOne-BRACKET_LIMITS[1]); var cal2= (cal1*TAX_RATES[1]); var totalTaxPaid1 = (cal2+MIN_TAX[1]); var taxBracketOfPeople2=1; alert(totalTaxPaid1); } if ((personOne >= BRACKET_LIMITS[2])&&(personOne <= BRACKET_LIMITS[3])) { var cal1= (personOne-BRACKET_LIMITS[2]); var cal2= (cal1*TAX_RATES[2]); var totalTaxPaid1 = (cal2+MIN_TAX[2]); var taxBracketOfPeople2=2; alert(totalTaxPaid1); } if ((personOne >= BRACKET_LIMITS[3])&&(personOne <= BRACKET_LIMITS[4])) { var cal1= (personOne-BRACKET_LIMITS[3]); var cal2= (cal1*TAX_RATES[3]); var totalTaxPaid1 = (cal2+MIN_TAX[3]); var taxBracketOfPeople2=3; alert(totalTaxPaid1); } if ((personOne >= BRACKET_LIMITS[4])) { var cal1= (personOne-BRACKET_LIMITS[4]); var cal2= (cal1*TAX_RATES[4]); var totalTaxPaid1 = (cal2+MIN_TAX[4]); var taxBracketOfPeople2=4; alert(totalTaxPaid1); } if ((personTwo >= BRACKET_LIMITS[0])&&(personTwo <= BRACKET_LIMITS[1])) { var cal1= (personTwo-BRACKET_LIMITS[0]); var cal2= (cal1*TAX_RATES[0]); var totalTaxPaid2 = (cal2+MIN_TAX[0]); var taxBracketOfPeople3=0; alert(totalTaxPaid2); } if ((personTwo >= BRACKET_LIMITS[1])&&(personTwo <= BRACKET_LIMITS[2])) { var cal1= (personTwo-BRACKET_LIMITS[1]); var cal2= (cal1*TAX_RATES[1]); var totalTaxPaid2 = (cal2+MIN_TAX[1]); var taxBracketOfPeople3=1; alert(totalTaxPaid2); } if ((personTwo >= BRACKET_LIMITS[2])&&(personTwo <= BRACKET_LIMITS[3])) { var cal1= (personTwo-BRACKET_LIMITS[2]); var cal2= (cal1*TAX_RATES[2]); var totalTaxPaid2 = (cal2+MIN_TAX[2]); var taxBracketOfPeople3=2; alert(totalTaxPaid2); } if ((personTwo >= BRACKET_LIMITS[3])&&(personTwo <= BRACKET_LIMITS[4])) { var cal1= (personTwo-BRACKET_LIMITS[3]); var cal2= (cal1*TAX_RATES[3]); var totalTaxPaid2 = (cal2+MIN_TAX[3]); var taxBracketOfPeople3=3; alert(totalTaxPaid2); } if ((personTwo >= BRACKET_LIMITS[4])) { var cal1= (personTwo-BRACKET_LIMITS[4]); var cal2= (cal1*TAX_RATES[4]); var totalTaxPaid2 = (cal2+MIN_TAX[4]); var taxBracketOfPeople3=4; alert(totalTaxPaid2); } if ((personThree >= BRACKET_LIMITS[0])&&(personThree <= BRACKET_LIMITS[1])) { var cal1= (personThree-BRACKET_LIMITS[0]); var cal2= (cal1*TAX_RATES[0]); var totalTaxPaid3 = (cal2+MIN_TAX[0]); var taxBracketOfPeople4=0; alert(totalTaxPaid3); } if ((personThree >= BRACKET_LIMITS[1])&&(personThree <= BRACKET_LIMITS[2])) { var cal1= (personThree-BRACKET_LIMITS[1]); var cal2= (cal1*TAX_RATES[1]); var totalTaxPaid3 = (cal2+MIN_TAX[1]); var taxBracketOfPeople4=1; alert(totalTaxPaid3); } if ((personThree >= BRACKET_LIMITS[2])&&(personThree <= BRACKET_LIMITS[3])) { var cal1= (personThree-BRACKET_LIMITS[2]); var cal2= (cal1*TAX_RATES[2]); var totalTaxPaid3 = (cal2+MIN_TAX[2]); var taxBracketOfPeople4=2; alert(totalTaxPaid3); } if ((personThree >= BRACKET_LIMITS[3])&&(personThree <= BRACKET_LIMITS[4])) { var cal1= (personThree-BRACKET_LIMITS[3]); var cal2= (cal1*TAX_RATES[3]); var totalTaxPaid3 = (cal2+MIN_TAX[3]); var taxBracketOfPeople4=3; alert(totalTaxPaid3); } if ((personThree >= BRACKET_LIMITS[4])) { var cal1= (personThree-BRACKET_LIMITS[4]); var cal2= (cal1*TAX_RATES[4]); var totalTaxPaid3 = (cal2+MIN_TAX[4]); var taxBracketOfPeople4=4; alert(totalTaxPaid3); } if ((personFour >= BRACKET_LIMITS[0])&&(personFour <= BRACKET_LIMITS[1])) { var cal1= (personFour-BRACKET_LIMITS[0]); var cal2= (cal1*TAX_RATES[0]); var totalTaxPaid4 = (cal2+MIN_TAX[0]); var taxBracketOfPeople5=0; alert(totalTaxPaid4); } if ((personFour >= BRACKET_LIMITS[1])&&(personFour <= BRACKET_LIMITS[2])) { var cal1= (personFour-BRACKET_LIMITS[1]); var cal2= (cal1*TAX_RATES[1]); var totalTaxPaid4 = (cal2+MIN_TAX[1]); var taxBracketOfPeople5=1; alert(totalTaxPaid4); } if ((personFour >= BRACKET_LIMITS[2])&&(personFour <= BRACKET_LIMITS[3])) { var cal1= (personFour-BRACKET_LIMITS[2]); var cal2= (cal1*TAX_RATES[2]); var totalTaxPaid4 = (cal2+MIN_TAX[2]); var taxBracketOfPeople5=2; alert(totalTaxPaid4); } if ((personFour >= BRACKET_LIMITS[3])&&(personFour <= BRACKET_LIMITS[4])) { var cal1= (personFour-BRACKET_LIMITS[3]); var cal2= (cal1*TAX_RATES[3]); var totalTaxPaid4 = (cal2+MIN_TAX[3]); var taxBracketOfPeople5=3; alert(totalTaxPaid4); } if ((personFour >= BRACKET_LIMITS[4])) { var cal1= (personFour-BRACKET_LIMITS[4]); var cal2= (cal1*TAX_RATES[4]); var totalTaxPaid4 = (cal2+MIN_TAX[4]); var taxBracketOfPeople5=4; alert(totalTaxPaid4); } </script> </head> <body> <script> document.writeln ('<table border="2">'); document.writeln ('<tr>'); document.writeln ('<th>'+('Name')+'</th>'); document.writeln ('<th>'+('Income')+'</th>'); document.writeln ('<th>'+('Bracket')+'</th>'); document.writeln ('<th>'+('Tax')+'</th>'); document.writeln ('</tr>'); document.writeln ('<tr>'); document.writeln ('<td>'+(PEOPLE[0])+'</td>'); document.writeln ('<td>'+('$')+(personZero)+'</td>'); document.writeln ('<td>'+(taxBracketOfPeople1)+'</td>'); document.writeln ('<td>'+('$')+(totalTaxPaid)+'</td>'); document.writeln ('</tr>'); document.writeln ('<tr>'); document.writeln ('<td>'+(PEOPLE[1])+'</td>'); document.writeln ('<td>'+(personOne)+'</td>'); document.writeln ('<td>'+(taxBracketOfPeople2)+'</td>'); document.writeln ('<td>'+(totalTaxPaid1)+'</td>'); document.writeln ('</tr>'); document.writeln ('<tr>'); document.writeln ('<td>'+(PEOPLE[2])+'</td>'); document.writeln ('<td>'+(personTwo)+'</td>'); document.writeln ('<td>'+(taxBracketOfPeople3)+'</td>'); document.writeln ('<td>'+(totalTaxPaid2)+'</td>'); document.writeln ('</tr>'); document.writeln ('<tr>'); document.writeln ('<td>'+(PEOPLE[3])+'</td>'); document.writeln ('<td>'+(personThree)+'</td>'); document.writeln ('<td>'+(taxBracketOfPeople4)+'</td>'); document.writeln ('<td>'+(totalTaxPaid3)+'</td>'); document.writeln ('</tr>'); document.writeln ('<tr>'); document.writeln ('<td>'+(PEOPLE[4])+'</td>'); document.writeln ('<td>'+(personFour)+'</td>'); document.writeln ('<td>'+(taxBracketOfPeople5)+'</td>'); document.writeln ('<td>'+(totalTaxPaid4)+'</td>'); document.writeln ('</tr>'); document.writeln('</table>'); </script> </body> </html> Hope that wasnt to confusing Thanks heaps Shaynedarcy Hello. Is the any chance to increment IP address in Javascript ? For example 11.12.13.14 plus 1 will be 11.12.13.15 I've started to modify my old script: Code: var ipa = 10.11.12.13; var partsa = []; var tempa = ipa; for ( var p = 0; p < 3; ++p ) { var dot1t = tempa.indexOf("."); partsa[p] = tempa.substring(0,dot1t); tempa = tempa.substring(dot1t+1); } partsa[3] = tempa; But do not know how to display ip like: ( parts1[0].parts1[1].parts1[2].parts1[3]+1 ) Please help. Leos I have modified a free JS function from he http://www.tangorangers.com/examples...post/index.php To dynamically add text fields to the form. My work-in-progress version is he http://jimpix.co.uk/junk/test/6.html On the form, I have a hidden text field: Code: <input type="hidden" name="hiddenCount" value="" /> What I'd like to do is to increment the hiddenCount each time the "Add" fields button is clicked. This is the button: <input id="add_contact()" onclick="add_contact()" value="Add" type="button"> And this is the JS function: Code: var contact_counter = 0; function add_contact() { if (contact_counter < 9) { contact_counter++; var newFields = document.getElementById('add_contact').cloneNode(true); newFields.id = 'contact'; newFields.style.display = 'block'; var newField = newFields.childNodes; for (var i=0;i<newField.length;i++) { var theName = newField[i].name if (theName) newField[i].name = theName + contact_counter; } var insertHere = document.getElementById('add_contact'); insertHere.parentNode.insertBefore(newFields,insertHere); } } I'm new to JS. I could just about edit the JS function to slightly modify it from the tangorangers version (I only changed it v. slightly). To somehow increment the value in the hidden field each time the button is pressed is beyond me though! Any advice much appreciated. Thanks The following code results in the exact same output. Is there an advantage to using i++ over ++i (or visa-versa) in the loop? Code: <script type="text/javascript"> var tarr1 = []; for (var i=0; i<10; i++) { tarr1.push(i); } var tarr2 = []; for (var i=0; i<10; ++i) { tarr2.push(i); } alert(tarr1.join(',')+'\n'+tarr2.join(',')); </script> Similar question for the increment method in the following: Code: <script type="text/javascript"> var tarr1 = []; var i=0; do { tarr1.push(i); i++; } while (i<10); var tarr2 = []; var j=0; do { tarr2.push(j); ++j; } while (j<10); alert(tarr1.join(',')+'\n'+tarr2.join(',')); </script> Example of my problem: HERE The code is derived from a site offering some advice for javascript: HERE The example of mine tries to use an image as hyperlink... and use mouse events for certain actions. Aside from possibly being the worst javascript code humanly possible...once I slaughtered the code from the site mentioned above, I'm not getting how to arrange things so that a mouse over event switches an image , as does mousedn and mouseup, And (and this is the rub for me) repeating the setup in the same way for a list of quicktime video links. I've got it to work for one row in the table I'm using to attempt some kind of formatting. I'm told `css' is a better way for that but I'm completely ignorant about how to use `css'. So, for now I'm using a table to get at the javascript question. The idea is for viewer to see three red dots at the front of each item being offered. Mouseover is supposed to switch to a green arrow... mousedn is supposed to switch to 2 check marks. I wanted the check marks to persist, so for lack of knowing how to accomplish that... I let mouseup call the same image. (the check marks; Maybe just omitting any directive for mouseup would have the same effect?) About the `image persisting after being clicked' question: It is really a separate question so I will probably start a different thread for that. What I've done works for one list item... but fails for more than one. The only active member of the list (2 in my example) is the bottom one. mouse events on the top one are carried out on the bottom one. I tried to just change the name of all variables in the javascript, and the name given in the `img src=' section of the html code, for the second row... but clearly not what is needed. I changed the names shown below by incrementing the number in the names by 1. I've only posted one row's worth but the next row uses the same code with the variables incremented. And hopefully someone will look at the actual example (URL given above) and see the full code. The basic code I've put here for convience.: Code: <table> <tr> <td valign=top > <A href="./t2.html" onMouseOver="return changeImage()" onMouseOut= "return changeImageBack()" onMouseDown="return handleMDown()" onMouseUp="return handleMUp()" ><img name="jsbutton_0" src="./3dots.png" border="0" alt="javascript button"></A> some nice video <SCRIPT language="JavaScript"> var myimgobj_0 = document.images["jsbutton_0"]; function changeImage() { document.images["jsbutton_0"].src= "./aro1r-mo.png"; return true; } function changeImageBack() { document.images["jsbutton_0"].src = "./3dots.png"; return true; } function handleMDown() { document.images["jsbutton_0"].src = "./checks.png"; return true; } function handleMUp() { document.images["jsbutton_0"].src = "./checks.png"; return true; } </SCRIPT> </tr> </td> Hello just a quick problem with a seemingly difficult solution that I'm not aware throughout. What I'm attempting to do is increment a value when the mouse hovers over the element by using this move_right function: Code: function Move_Right( event, element, number) { number++; var elem = document.getElementById(element); elem.style.right = number + "px"; } inside the mouseover event trigger function which I figured out. The problem is it doesn't move incrementally only once every mouse hover no matter the technique of setInterval(); and or setTimeout(); also ontop of this problem I'm getting errors like : 2014-10-12 20:07:57.785Uncaught TypeError: Cannot read property 'style' of null even after the changes I made also after this original function call : This is the current code so far which is different to the previous code above "obviously" : Edit fiddle - JSFiddle Thanks if someone knows the issues here, I hope it makes sense . Hi all, I use a javascript to generate a checkbox list. It works well but all the <input type="checkbox"> generated have the same id. I would like to find a way to auto-implement the id (with a unique id). So if my javascript generates 10 checkboxes, I will get id from 1 to 10 or something similar. Code: // here I build the filter checkboxes based on all the class names $.each(arrayUniqueClasses, function() { $('<li><input class="styled" type="checkbox" checked="checked" name="1" value="'+this+'" id="1" /> <label class="check" for="1"></label> <label class="info" for="filterID'+this+'">'+this+'<\/label><\/li>').appendTo('ul.filters'); }); so I tried something but it doesn't work at all (I'm a beginner as you can guess) : Code: var getUniqueId = (function () { var id=0; return function() { if (arguments[0]==0) id=0; return id++; } } )(); Thanks for helping here the full script if needed : Code: function unique(a) { tmp = new Array(0); for(i=0;i<a.length;i++){ if(!contains(tmp, a[i])){ tmp.length+=1; tmp[tmp.length-1]=a[i]; } } return tmp; } function contains(a, e) { for(j=0;j<a.length;j++)if(a[j]==e)return true; return false; } function removeItems(array, item) { var i = 0; while (i < array.length) { if (array[i] == item) { array.splice(i, 1); } else { i++; } } return array; } $(document).ready(function () { if ($('.filterThis > li').length < 2) { return; } var stringOfClassNames = ''; $('.filterThis > li').each( function (i) { var thisClassString = $(this).attr('class'); stringOfClassNames = stringOfClassNames +' '+ thisClassString }); stringOfClassNames = jQuery.trim(stringOfClassNames); var arrayClasses = stringOfClassNames.split(' '); var arrayClasses = arrayClasses.sort(); totalNumberOfItemsToFilter = $('.filterThis > li').length; var result = new Object(); for (var filterClass in arrayClasses) { if (result[arrayClasses[filterClass]] === undefined) { result[arrayClasses[filterClass]] = 1; } else { result[arrayClasses[filterClass]]++; } } var resultsToRemoveFromFilters = new Array(); for (var item in result) { if (result[item] == totalNumberOfItemsToFilter) { resultsToRemoveFromFilters.push(item); } } arrayUniqueClasses = (unique(arrayClasses)); if (arrayUniqueClasses.length > 1) { $('<ul class="filters"><\/ul>').insertAfter('h3'); $.each(arrayUniqueClasses, function() { $('<li><input class="styled" type="checkbox" checked="checked" name="1" value="'+this+'" id="0" /><label class="check" for="0"></label><label class="info" for="filterID'+this+'">'+this+'<\/label><\/li>').appendTo('ul.filters'); }); var classesStringOfSin = new Array(); classesStringOfSalvation = arrayUniqueClasses; $('.filterThis > li').addClass('filterTriggerShown'); $('.filters input').click( function() { var value= $(this).val(); stringValue = '.filterThis > li.'+value; if ($(this).is(':checked')) { classesStringOfSalvation.push(value); classesStringOfSin = removeItems(classesStringOfSin, value); $(stringValue).removeClass('filterTriggerHidden').addClass('filterTriggerShown').slideDown(); } else { classesStringOfSin.push(value); classesStringOfSalvation = removeItems(classesStringOfSalvation, value); $(stringValue).removeClass('filterTriggerShown').addClass('filterTriggerHidden'); $.each(classesStringOfSalvation, function() { var newStringValue = stringValue+'.'+this; $(newStringValue).removeClass('filterTriggerHidden').addClass('filterTriggerShown'); }); $('.filterTriggerHidden').slideUp(); } }); } }); Hi, I am facing a problem in passing replace() function as an argument in user defined java function, can any one help me how to resolve it? intention is to pass a file path to my user defined function, but before passing the path i want to replace the character '\' to '\\' I am posting my javascript function he <a href="#" onclick="OpenDocPreview('<%# Eval("PATH")%>'.replace(/\\/g,"\\\\"), '<%# Eval("Filename")%>')"><%# Eval("DocTitle") %></a> function OpenDocPreview(url, docname) { alert('message from search base : ' + url + ' ' + docname); } thank you, I was working on a tutorial for some ajax uploading stuff and I ran across a new function syntax I don't recognize. I am not a Javascript pro, but I am not a newbie either. here is the code I am working on: Code: function handleFileSelect(e){ var files = e.target.files; var output = []; for(var i=0,f;f=files[i];i++){ if(f.type.match('image.*')){ var reader = new FileReader(); reader.onload = (function(theFile){ return function(e){ var span = document.createElement('span'); span.innerHTML = ['<img class="thumb" src="',e.target.result,'" title="',theFile.nbame,'" />'].join(''); document.getElementById('list').insertBefore(span,null); }; })(f); reader.readAsDataURL(f); } } document.getElementById('list').innerHTML = '<ul>'+output.join('')+'</ul>'; } document.getElementById('files').addEventListener('change',handleFileSelect,false); To be a little more clear, the code in question is that is the very middle. The syntax I don't understand is: Code: class.event = (function(arguments){ //stuff you put in a function... })(more Arguments?); I tried to customize a simple one to learn for myself and I wrote this: Code: var a = 'A'; var b = 'B'; test = (function(t){ alert(t); alert(b); })(b); test(a); The browser would alert 'B' and that's it. The console would tell me that 'test is not a function.' OK, so I am confused. The topmost code works. What I am wondering is what the syntax is called for creating a function (or event listener?) that way, and how it works. Although if I new what it was called I could just google how it works. i keep getting error Call to undefined function codeandurl() below is my code PHP Code: <?php $value= strip_tags(get_field('link',$post)); $resultid=get_field('resultid',$post); codeandurl($resultid,$value); ?> <div id="result"></div> <script type="text/javascript"> function codeandurl(resultid,url){ $( "#result" ).text(resultid); $( "#result" ).dialog({ modal: true, buttons: { Ok: function() { $( this ).dialog( "close" ); } } }); window.open(url); return false; } </script> Hi! I'm trying to toggle a class and one works and the other does not and I don't know why. I'm just getting my feet wet with jquery and javascript and I figured this was a pretty easy task to take on! Maybe. Link to the page: Franklin Township Soccer Club - Change Field Status My sad, sorry attempt =| Code: $( "li.open" ).click(function() { $( this ).toggleClass( "closed" ); }); $( "li.closed" ).click(function() { $( this ).toggleClass( "open" ); }); The first function works with open, so I figured I'd just use opposite on closed! Ha! I don't think so! In the end within those function there is an element in a form on that page it's hidden. I'd like to change the value from a 0 to 1 for vice versa. That' will be my next step. If you could give me a little nudge in the right direction I'd appreciate it! But first understanding why one works and the other does not, that is the primary mission! I do appreciate any help given! Dave Hi All, I'm trying to convert an anonymous function to a real function (nesting is getting out of hand), however the msg object becomes undefined after conversion. Here is the converted anonymous function which fails: https://gist.github.com/2587613 and here is the original anonymous function which works: https://gist.github.com/2587667 Any help would be greatly appriciated I found this script, and it works great: Code: <script type="text/javascript"> function disable(element) { var input = document.getElementById(element).getElementsByTagName("input"); for(var i = 0; i < input.length; i++) { input[i].setAttribute("disabled","true"); } } </script> I tried to make the inverse by simply reversing the setAttribute() like so: Code: <script type="text/javascript"> function enable(element) { var input = document.getElementById(element).getElementsByTagName("input"); for(var i = 0; i < input.length; i++) { input[i].setAttribute("disabled","false"); } } </script> But that didn't do it. Can someone show me why, and how to fix it? Here's the sample form which I'm trying to test it on: Code: <form> <input type="radio" name="test" onclick="disable('D1')" /> disable<br/> <input type="radio" name="test" onclick="enable('D1')" /> enable<br/> <fieldset id="D1"> <input class="" type="text" value="test value1" /><input class="" type="text" value="test value2" /><br/> <input class="" type="text" value="test value3" /><input class="" type="text" value="test value4" /><br/> <input class="" type="text" value="test value5" /><input class="" type="text" value="test value6" /><br/> </fieldset> </form> Edit: The ultimate goal which I'm working toward now (step by step =) is to have a form more like: Code: <form> <input type="radio" name="test" onclick="disable('D1')" /> <fieldset id="D1"> <input class="" type="text" value="test value1" /><input class="" type="text" value="test value2" /> </fieldset> <input type="radio" name="test" onclick="disable('D2')" /> <fieldset id="D2"> <input class="" type="text" value="test value3" /><input class="" type="text" value="test value4" /> </fieldset> <input type="radio" name="test" onclick="disable('D3')" /> <fieldset id="D3"> <input class="" type="text" value="test value5" /><input class="" type="text" value="test value6" /> </fieldset> </form> And have the fieldsets enable and disable according the selection of the radio buttons. Also, the fieldsets (and their ID's) will be dynamically generated via PHP Thanks-a-bunch, ~ Mo <p> <script type="text/javascript">// <![CDATA[ var metrics = { "mm" : 1, "cm" : 10, "m" : 1000, "inch" : 25.4, "foot" : 304.8 }; function convert(num, dec){ var val = document.getElementById("fromVal").value; if(isNaN(val)){ return } function roundNumber(num, dec) { var result = Math.round( Math.round( num * Math.pow( 10, dec + 1 ) ) / Math.pow( 10, 1 ) ) / Math.pow(10,dec); return result; } document.getElementById("toVal").value = val * metrics[document.getElementById("fromSystem").value]/ metrics[document.getElementById("toSystem").value]; } var interval = null; function watchChanges(){ interval == null ? setInterval("convert()", 500) : clearInterval(interval); } // ]]></script> </p> <table> <tbody> <tr> <td><input id="fromVal" style="width: 100px;" onfocus="watchChanges()" onblur="watchChanges()" type="text" /><select id="fromSystem" onchange="convert()"> <option value="mm">millimeters</option> <option selected="selected" value="cm">centimeters</option> <option value="m">meters</option> <option value="foot">feet</option> <option value="inch">inches</option> </select></td> </tr> <tr> <td colspan="1" align="center">=</td> </tr> <tr> <td><input id="toVal" style="width: 100px;" type="text" disabled="disabled" /><select id="toSystem" onchange="convert()"> <option value="mm">millimeters</option> <option value="cm">centimeters</option> <option value="m">meters</option> <option selected="selected" value="foot">feet</option> <option value="inch">inches</option> </select></td> |