# Displaying the sum

**URL:** <https://www.ruby-forum.com/t/displaying-the-sum/192018>\
**Category:** Rails\
**Created:** [July 22, 2010, 1:41pm UTC](https://www.ruby-forum.com/t/displaying-the-sum/192018 "2010-07-22T13:41:22Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![swengineer](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/97f17d/32.png) [@swengineer](https://www.ruby-forum.com/u/swengineer)\
**Post date:** [July 22, 2010, 1:41pm UTC](https://www.ruby-forum.com/t/displaying-the-sum/192018/1 "2010-07-22T13:41:22Z")

</div>

I’m creating a very simple Rails application where I enter “First  
number” and then “Second number” and get the result in the “Sum”.

Those are some files:

show.html.erb: [http://pastie.org/private/1cydign77xnijlrb7mjvng](http://pastie.org/private/1cydign77xnijlrb7mjvng)  
\_form.html.erb: [http://pastie.org/private/narsz5oeuafahclqtvmwq](http://pastie.org/private/narsz5oeuafahclqtvmwq)

What do I want?

I just want the Sum to be DISPLAY the summation result automatically  
after entering the first and second numbers, without having a text box  
beside some.

I think it may be a HRML/CSS touch?

What should I do here?

Thanks.

---

<div class="post-metadata">

**Author:** ![swengineer](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/97f17d/32.png) [@swengineer](https://www.ruby-forum.com/u/swengineer)\
**Post date:** [July 22, 2010, 1:53pm UTC](https://www.ruby-forum.com/t/displaying-the-sum/192018/2 "2010-07-22T13:53:11Z")

</div>

Abder-Rahman A. wrote:

> I’m creating a very simple Rails application where I enter “First  
> number” and then “Second number” and get the result in the “Sum”.
> 
> Those are some files:
> 
> show.html.erb: [http://pastie.org/private/1cydign77xnijlrb7mjvng](http://pastie.org/private/1cydign77xnijlrb7mjvng)  
> \_form.html.erb: [http://pastie.org/private/narsz5oeuafahclqtvmwq](http://pastie.org/private/narsz5oeuafahclqtvmwq)
> 
> What do I want?
> 
> I just want the Sum to be DISPLAY the summation result automatically  
> after entering the first and second numbers, without having a text box  
> beside some.
> 
> I think it may be a HRML/CSS touch?
> 
> What should I do here?
> 
> Thanks.

If you want to populate the sum field with the result of first number +  
second number, consider JavaScript.

---

<div class="post-metadata">

**Author:** ![swengineer](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/97f17d/32.png) [@swengineer](https://www.ruby-forum.com/u/swengineer)\
**Post date:** [July 22, 2010, 1:57pm UTC](https://www.ruby-forum.com/t/displaying-the-sum/192018/3 "2010-07-22T13:57:50Z")

</div>

Thanks Pale, cannot I use CSS for that. I’m actually not aware of  
Javascript.

---

<div class="post-metadata">

**Author:** ![swengineer](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/97f17d/32.png) [@swengineer](https://www.ruby-forum.com/u/swengineer)\
**Post date:** [July 22, 2010, 2:10pm UTC](https://www.ruby-forum.com/t/displaying-the-sum/192018/4 "2010-07-22T14:10:03Z")

</div>

Abder-Rahman A. wrote:

> Thanks Pale, cannot I use CSS for that. I’m actually not aware of  
> Javascript.

Do no not use CSS for this; CSS is for styling your page. If you’re not  
familiar with JavaScript, can I suggest you start here:

> **[JavaScript Tutorial](https://www.w3schools.com/js/default.asp)**
>
> W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

---

<div class="post-metadata">

**Author:** ![swengineer](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/97f17d/32.png) [@swengineer](https://www.ruby-forum.com/u/swengineer)\
**Post date:** [July 22, 2010, 2:23pm UTC](https://www.ruby-forum.com/t/displaying-the-sum/192018/5 "2010-07-22T14:23:11Z")

</div>

Pale H. wrote:

> Abder-Rahman A. wrote:
> 
> > Thanks Pale, cannot I use CSS for that. I’m actually not aware of  
> > Javascript.
> 
> Do no not use CSS for this; CSS is for styling your page. If you’re not  
> familiar with JavaScript, can I suggest you start here:  
> [JavaScript Tutorial](http://w3schools.com/js/default.asp)

Got you Pale.

So, you mean that even I have the result, I cannot display it using CSS  
since it is for styling?

I’ll check Javascript then.

Thanks a lot.

---

<div class="post-metadata">

**Author:** ![swengineer](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/97f17d/32.png) [@swengineer](https://www.ruby-forum.com/u/swengineer)\
**Post date:** [July 22, 2010, 7:58pm UTC](https://www.ruby-forum.com/t/displaying-the-sum/192018/6 "2010-07-22T19:58:36Z")

</div>

Thanks a lot Marnen for your nice recommendations and advice.

---

<div class="post-metadata">

**Author:** ![swengineer](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/97f17d/32.png) [@swengineer](https://www.ruby-forum.com/u/swengineer)\
**Post date:** [July 22, 2010, 7:45pm UTC](https://www.ruby-forum.com/t/displaying-the-sum/192018/7 "2010-07-22T19:45:32Z")

</div>

Abder-Rahman A. wrote:

> Pale H. wrote:
> 
> > Abder-Rahman A. wrote:
> > 
> > > Thanks Pale, cannot I use CSS for that. I’m actually not aware of  
> > > Javascript.
> > 
> > Do no not use CSS for this; CSS is for styling your page. If you’re not  
> > familiar with JavaScript, can I suggest you start here:  
> > [JavaScript Tutorial](http://w3schools.com/js/default.asp)
> 
> Got you Pale.
> 
> So, you mean that even I have the result, I cannot display it using CSS  
> since it is for styling?

Right. Basically, if you want dynamic behavior on the client side, you  
need JavaScript. Remember to provide an alternative for those without  
JavaScript! (Look up “progressive enhancement” for a good way to do  
this.)

> I’ll check Javascript then.

Your first stop should be Doug Crockford’s website (  
[http://www.crockford.com](http://www.crockford.com) ). In particular, note and follow his  
recommendation to put JavaScript in separate files rather than mixing it  
in with HTML. If you want a book, I recommend David Flanagan’s  
JavaScript: The Definitive Guide; Doug Crockford’s JavaScript: The Good  
Parts seems good also. [http://www.javascriptkit.com](http://www.javascriptkit.com) is a good basic  
language reference.

> Thanks a lot.

## Best,

Marnen Laibow-Koser  
[http://www.marnen.org](http://www.marnen.org)  
removed\_email\_address@domain.invalid
