8 Replies - 785 Views - Last Post: 21 March 2013 - 02:26 AM

#1 bartekWojcik  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 5
  • Joined: 25-November 12

Simple calculator - function and syntax

Posted 20 March 2013 - 02:08 PM

Hi, i'm quite a newbie and i have got problem with this:
<html>
<head>
    <script type="text/javascript">
        function wyswietl(n) {
            wysw = document.getElementById("wyswietlacz");

            wysw.value = wysw.value + n;

        }

        
        function wypisz(i) {
            for (var j = 0; j <= i; j++) {
                document.write("<input type='button' NAME='" + j + "' value='" + j + "' onclick=wyswietl('" + j + "')/>");
            }
        }



    </script>
</head>
<body>
    <input type='text' id='wyswietlacz' value=' ' />
    <input type='button' id='rownasie' value='=' />
    <input type='button' id='dodaj' value=' + ' onclick='wyswietl("+")' />
    <input type='button' id='odejmij' value=' - ' onclick='wyswietl("-")' />
    <form action="" method="get">
    <script type="text/javascript">
        wypisz(9);
    </script>
    </form>
</body>
<!--onclick = wyswietl(getElementById('dodaj').value)-->
<!--//onclick = wyswietl(getElementById('odejmij').value)-->
</html>




The exact problem is following: when i press "+" or "-" button is works, i mean it is shown in textbox, but digits dont want to work like this. The output in my chrome is following:
<input type="button" name="0" value="0" onclick="wyswietl('0')/">



so i think the problem is with quotation marks in this piece of code
 onclick=wyswietl('" + j + "')/>");
but i cant figure out how should it looks like.

thanks in advance.

Is This A Good Question/Topic? 0
  • +

Replies To: Simple calculator - function and syntax

#2 Dormilich  Icon User is online

  • 痛覚残留
  • member icon

Reputation: 3486
  • View blog
  • Posts: 10,055
  • Joined: 08-June 10

Re: Simple calculator - function and syntax

Posted 20 March 2013 - 02:29 PM

Im not sure I understand the problem does the concatenation does not work or do you expect addition when there is concatenation?

just to explain that a little more, in JS the + operator does two completely different things:
- concatenation
- addition
how does JS know when to do one or the other? addition is done when *both* operands are numbers (i.e. of the type number (when typeof op === "number")) otherwise (if either or both operands are strings) it does concatenation. and when you ask for the value of an input element, you *always* get a string back.
Was This Post Helpful? 0
  • +
  • -

#3 bartekWojcik  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 5
  • Joined: 25-November 12

Re: Simple calculator - function and syntax

Posted 20 March 2013 - 02:33 PM

The problem is that function onclick is now working for digits - they do not appear in textbox while "+" and "-" do. My idea is to use function 'eval' after this to get a solution from equation but i cant do this before solving this problem.
Was This Post Helpful? 0
  • +
  • -

#4 Dormilich  Icon User is online

  • 痛覚残留
  • member icon

Reputation: 3486
  • View blog
  • Posts: 10,055
  • Joined: 08-June 10

Re: Simple calculator - function and syntax

Posted 20 March 2013 - 02:37 PM

then why dont you hard code the number buttons like the + and button (and be it just for testing)?

events (like onclick) should be defined in JS, not as HTML attribute, after all.
Was This Post Helpful? 0
  • +
  • -

#5 bartekWojcik  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 5
  • Joined: 25-November 12

Re: Simple calculator - function and syntax

Posted 20 March 2013 - 02:44 PM

well, i can hardcode them but i would like to do this as smoothly as i can and i'm wondering why this is not working while it should.
Was This Post Helpful? 0
  • +
  • -

#6 Dormilich  Icon User is online

  • 痛覚残留
  • member icon

Reputation: 3486
  • View blog
  • Posts: 10,055
  • Joined: 08-June 10

Re: Simple calculator - function and syntax

Posted 20 March 2013 - 02:47 PM

it might have something to do with the onclick attributes.
Was This Post Helpful? 0
  • +
  • -

#7 andrewsw  Icon User is offline

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3227
  • View blog
  • Posts: 10,837
  • Joined: 12-December 12

Re: Simple calculator - function and syntax

Posted 20 March 2013 - 03:03 PM

document.write("<input type='button' NAME='" + j + "' value='" + j + "' onclick=wyswietl('" + j + "')/>");

You are including / within the onclick event. It ends up like this in Firefox:

<input type="button" onclick="wyswietl('0')/" value="0" name="0">

This post has been edited by andrewsw: 20 March 2013 - 03:07 PM

Was This Post Helpful? 0
  • +
  • -

#8 bartekWojcik  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 5
  • Joined: 25-November 12

Re: Simple calculator - function and syntax

Posted 21 March 2013 - 02:10 AM

Yes, but quotation marks in code look fine to me, they start and end in right places and i dont know why '/' is included into onclick event.
Was This Post Helpful? 0
  • +
  • -

#9 andrewsw  Icon User is offline

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3227
  • View blog
  • Posts: 10,837
  • Joined: 12-December 12

Re: Simple calculator - function and syntax

Posted 21 March 2013 - 02:26 AM

View PostbartekWojcik, on 21 March 2013 - 09:10 AM, said:

Yes, but quotation marks in code look fine to me, they start and end in right places and i dont know why '/' is included into onclick event.

I recommend that you drop your use of document.write() altogether. Create the elements as normal and use addEventListener to attach the click events - you might as well learn to do it properly..
Was This Post Helpful? 1
  • +
  • -

Page 1 of 1