Jump to content
Sign in to follow this  
samerhannoun

Volume Calculator Script -- Please Help

Recommended Posts

Hi guys,,,, I am into developing something like the following:http://www.flexistore.co.uk/vault-estimator/ this page contains volume calculator at this page its developed using flash,,, but I want it Jquery.. I do the following as a test,, but is this logical work or are there any ideas,,,,

html><head><script src="http://code.jquery.com/jquery-1.5.js"></script><style></style></head><body><div id="cont1"><img id="chair" src="chair.gif"><img id="bed" src="bed.gif"></div><br><span id="value">0</span><span id="box"></span><br>what you select:<br><span id="type"></span><script>//desclaring global variables// n = the value of volum.//then perform jquery action on click on the image invoke update function with 2 paramaters value of volum and type of objectvar chairCount=0;var bedCount=0;var c='';$("img#chair").click(function () {update($("span#value"),"chair");});$("img#bed").click(function () {update($("span#value"),"bed");});//update function for effect after user click on an image(parasing value span, check object type, assign the value, update the spans).function update(j,c) {var n = parseInt(j.text(), 10);if(c=="chair"){j.text(n + 50);chairCount=chairCount+1;if(chairCount==1){$("span#type").after("<span id='ch'>"+chairCount+c+" "+"<a href='#' onclick='a(1);'>Decrease 1</a>"+"</span>"+"<br>");}else{$("span#ch").html(chairCount+c+" "+"<a href='#'>Decrease 1</a>");}}if(c=="bed"){j.text(n + 25);bedCount=bedCount+1;if(bedCount==1){$("span#type").after("<span id='b'>"+bedCount+c+" "+"<a href='#'>Decrease 1</a>"+"</span>"+"<br>");}else{$("span#b").html(bedCount+c+" "+"<a href='#'>Decrease 1</a>");}}if((n)>=150){$("span#box").html("You need 2 boxes");}if((n)>=300){$("span#box").html("You need 3 boxes");}}function a(c){var j=$('span#value');var n = parseInt(j.text(), 10);j.text(n - 50);chairCount=chairCount-1;$("span#type").after("<span id='ch'>"+chairCount+c+" "+"</span>"+"<br>");}</script>

Best Wishes

Share this post


Link to post
Share on other sites

what's the result of your efforts? Does it work? Are there errors? What exactly are you having problems with?

Edited by thescientist

Share this post


Link to post
Share on other sites
what's the result of your efforts? Does it work? Are there errors? What exactly are you having problems with?
the code I post is working as a demo for 2 images,, in my case there are over 50 image, so I will write a huge amount of code !!!! I think my code is solution but this is a bad solution and I believe there is a better way to enhance my code and reduce the amount of hard coded,,,In more depth if I have 50 image I will repeat this part of code 50 times$("img#chair").click(function () {update($("span#value"),"chair");});and not less 60-70 if statement is this logical?????? I was thinking about using class for html selector,,, but the image not completed in my mind cause I will send a different parameter with each selector?this is my problem.and thanks a lot for you time and consideration.Best Wisthes

Share this post


Link to post
Share on other sites

You could give all of those images a certain class and do something like

$("img.theClass").click(function()  {	update($("span#value"), $(this).attr("id"));  });

Disclaimer: I just whipped that up. Hopefully is gets the point across, but I don't know if it'll actually work for your case.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...