StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
primarykey
Id
20007176
data
AcceptedAnswerId
0
AnswerCount
0
ClosedDate
CommentCount
0
CommunityOwnedDate
CreationDate
2013-11-15T17:34:48.307
FavoriteCount
0
LastActivityDate
2013-11-15T17:34:48.307
LastEditDate
LastEditorUserId
0
OwnerUserId
322395
ParentId
20005689
PostTypeId
2
Score
1
ViewCount
0
LastEditorDisplayName
text
Body
Alright first off this is in no way the best way to do this. I took a lot of liberties with the answer and hard coded the values. <a href="http://jsfiddle.net/loktar/EfYev/7/" rel="nofollow">Live Demo</a> I cleaned up the html a little bit, but mainly only made changes to the JavaScript. First thing I did was like I said hard code the values. <pre><code>var fruits = { apple: { apple: 1, banana: 0.5, pineapple: 8 }, banana: { apple: 2, banana: 1, pineapple: 16 }, pineapple: { apple: 0.125, banana: 0.0625, pineapple: 1 } }; </code></pre> Now personally I would make your HTML easier to read and iterate via JS to create the object dynamically. That is of course if you are expecting different values from the server and the only way to get them for some reason is via the HTML data attributes. The next thing I did was change your click event to the following. <pre><code> var vals = { apple: 0, banana: 0, pineapple: 0 }; $('.dropdown').each(function () { var fruitVal = $(this).prev('.number').val(); if (fruits[$(this).val()]) { vals.apple += fruitVal * fruits[$(this).val()].apple; vals.banana += fruitVal * fruits[$(this).val()].banana; vals.pineapple += fruitVal * fruits[$(this).val()].pineapple; } }); $('.apple').text(vals.apple); $('.banana').text(vals.banana); $('.pineapple').text(vals.pineapple); </code></pre> Again I would have dynamically made the <code>vals</code> object based on the data received earlier. I would have iterated the top properties from the fruits object to create it. In my opinion its weird to have two calculate buttons. Also I hate using prev to get a value, but you had no class assigned to the inputs so basically no way to reference what input belonged to what drop down. Anyway once you get the values it just comes down to basic math. If you have any questions feel free to ask. 
Tags
Title
singulars
PostAcceptedAnswerId
1. This table or related slice is empty.
PostParentId
1. POUpgrade single dropdown calculator to multiple dropdown
 singulars
 PostTypePostTypeId
 PTQuestion
PostTypePostTypeId
1. PTAnswer
UserLastEditorUserId
1. This table or related slice is empty.
UserOwnerUserId
1. USLoktar
plurals
PostLinksPostIdRelatedPostId
1. This table or related slice is empty.
PostLinksRelatedPostIdPostId
1. This table or related slice is empty.
PostsAcceptedAnswerId
1. POUpgrade single dropdown calculator to multiple dropdown
 singulars
 PostTypePostTypeId
 PTQuestion
PostsParentIdCreationDate
1. This table or related slice is empty.
VotesPostIdCreationDate
1. VO
 singulars
 PostPostId
 PO
 UserUserId
 This table or related slice is empty.
 VoteTypeVoteTypeId
 VTAcceptedByOriginator
2. VO
 singulars
 PostPostId
 PO
 UserUserId
 This table or related slice is empty.
 VoteTypeVoteTypeId
 VTUpMod
CommentsPostId
1. This table or related slice is empty.

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.