Mrco Posted October 26, 2012 Share Posted October 26, 2012 Hi, I have code below, a text input box with four increment / decrement buttons. Two for change the value by one step, two for change the value by 10. Three of them are working fine, but the +10 button changes the value to 1010, not 20 when the starting value is 10. I don't get it.. Why -10 works and not the +10... rows are almost identical.. <INPUT TYPE="TEXT" NAME="quantity" SIZE="5" MAXLENGTH="6" VALUE="10" CLASS="norm" id="quantity" onkeypress='return event.keyCode!=13'> <input type="button" value="-" onmouseover="this.style.border='1px solid '; this.style.padding='0px';" onmouseout="this.style.border='0px'; this.style.padding='1px';" onclick='var d=document.getElementById("quantity"); if (d.value>-99999) { d.value--; } else { d.value=-99999;};'> <input type="button" value="+" onmouseover="this.style.border='1px solid '; this.style.padding='0px';" onmouseout="this.style.border='0px'; this.style.padding='1px';" onclick='var d=document.getElementById("quantity"); if (d.value<999999) { d.value++; } else { d.value=999999;};'> <input type="button" value="-10" onmouseover="this.style.border='1px solid '; this.style.padding='0px';" onmouseout="this.style.border='0px'; this.style.padding='1px';" onclick='var d=document.getElementById("quantity"); if (d.value>-99990) { d.value=d.value-10; } else { d.value=d.value;};'> <input type="button" value="+10" onmouseover="this.style.border='1px solid '; this.style.padding='0px';" onmouseout="this.style.border='0px'; this.style.padding='1px';" onclick='var d=document.getElementById("quantity"); if (d.value<999990) { d.value=d.value+10; } else { d.value=d.value;};'> <FORM ACTION="form.php" METHOD="POST" style="display: inline;" ID="formi" name="formi"> </FORM> Link to comment https://forums.phpfreaks.com/topic/269931-increment-value-problem-with-a-button/ Share on other sites More sharing options...
codefossa Posted October 26, 2012 Share Posted October 26, 2012 Probably having to do with the way the string is parsed. You may have to parse the string in order to do it, but there is a much better way than this. I used jQuery because it's most often shorter than plain JS by a long shot, but I can do an example in plain JS if you wish. Example: http://xaotique.no-ip.org/tmp/11/ index.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Xaotique</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> <script type="text/javascript" src="script.js"></script> </head> <body> <input type="text" value="0" id="result" /> <input type="button" class="modify" value="-10" /> <input type="button" class="modify" value="-1" /> <input type="button" class="modify" value="1" /> <input type="button" class="modify" value="10" /> </body> </html> script.js $(document).ready(function() { $(".modify").click(function() { $("#result").val(parseInt($("#result").val()) + parseInt($(this).val())); }); }); Link to comment https://forums.phpfreaks.com/topic/269931-increment-value-problem-with-a-button/#findComment-1387862 Share on other sites More sharing options...
Mrco Posted October 26, 2012 Author Share Posted October 26, 2012 Thanks for the example. And you were right, it was about parsing the string. Still don't understand why -10 was ok and +10 was not.. Anyway, here's my new code: <input type="button" value="-" onclick='var d=document.getElementById("quantity").value; if (d>-99999) { document.getElementById("quantity").value=parseInt(d)-1;};'> <input type="button" value="+" onclick='var d=document.getElementById("quantity").value; if (d<999999) { document.getElementById("quantity").value=parseInt(d)+1};'> <input type="button" value="-10" onclick='var d=document.getElementById("quantity").value; if (d>-99990) { document.getElementById("quantity").value=parseInt(d)-10;};'> <input type="button" value="+10" onclick='var d=document.getElementById("quantity").value; if (d<999990) { document.getElementById("quantity").value=parseInt(d)+10;};'> Need to use javascript because there's more related boring 'stuff' in which I don't have the time/interest to change So thanks again for the help! Link to comment https://forums.phpfreaks.com/topic/269931-increment-value-problem-with-a-button/#findComment-1387889 Share on other sites More sharing options...
Christian F. Posted October 26, 2012 Share Posted October 26, 2012 The reason - worked and not +, is that + is either an addition or a concatenation operator in JS, depending upon the context. With strings it concatenates (just like . in PHP), and with numbers it adds. Link to comment https://forums.phpfreaks.com/topic/269931-increment-value-problem-with-a-button/#findComment-1387895 Share on other sites More sharing options...
codefossa Posted October 26, 2012 Share Posted October 26, 2012 Still a lot more JS than you need for this, but glad it works. Link to comment https://forums.phpfreaks.com/topic/269931-increment-value-problem-with-a-button/#findComment-1387903 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.