How do I create a calculator?

[Gobbledegeek]

I would like to implement fairly simple calculator on a website that will calculate the area of a garden and multiply it by one or four prices.

I really don't have a clue where to start. Any help appreciated.

 

[AHarvey]

You need to create 2 html text boxes, one for width and one for length, look up html forms for info on how to do it.

Then create 2 php variables $width and $length and pull the info from each text box and assign it to the corresponding variable.

Then declare a new variable called $area and set it as $area = $width * $length;

Now I think that you have 4 pricing structures but as I am not sure what you want to apply I am going to guess you want the user to choose. Personally, I would add radio buttons in to the html form and the user just chooses one.

Then you just need to assign the chosen radio button to another php variable called $price and simply work out the total and print to screen:

$sum_total = $area * $price;
print ($sum_total);

Does that help?

Tried to leave it so you can go off and google what you need but provide enough info to help out. If you still struggle, post and i'll try and post something.

 

[Gobbledegeek]

Thanks for that.

Unfortunately, you lost me at "create 2 php variables". I am familiar with Wordpress and given my absence of any coding skills, it's probably a good thing the site uses it.

I sent you an email.

 

[AHarvey]

I have some basic code that will do the trick in PHP & HTML however the issue is wordpress.

I don't know enough about programming to work with it. I imagine it would be best to run this as a plugin in the side bar so that users can play with it there however I have no idea where to start and despite spending the last 90 mins playing about I can't get it to work properly. I'll keep trying but hopefully someone else with more skill will be able to help

 

[mp3duck]

why not use JavaScript?

 

[AHarvey]

why not use JavaScript?

If I knew enough about it I would

Creating a wordpress plugin seems to be beyond my skill.

No matter what I try, it just shows the HTML above the page and messes everything up. Tried it in a page and installed a plugin that allows PHP in the post, it kind of works but echo's the answer to a blank screen and not the wordpress page.

I'll keep playing for you OP, but I may not be able to do it.

 

[rickh]

<script>

function updateQuote(area){

var area = parseInt(document.getElementById('gardenArea').value);
var pricePlan = parseInt(document.getElementById('priceOption').value);

var quote = area * pricePlan;
document.getElementById('quoteResult').innerHTML = quote;

}

</script>

Garden Area: <input type="text" name="gardenArea" id="gardenArea" onKeyUp="updateQuote();" style="width:40px;"> (square meters),
Price Plan:
<select name="priceOption" id="priceOption" onChange="updateQuote();">
<option value="10">Cheapest</option>
<option value="20">Cheap</option>
<option value="30">Expensive</option>
<option value="40">Most Expensive</option>
</select>
<br/>
Quote: &pound;<span id="quoteResult">0</span>

 

[Gobbledegeek]

If I knew enough about it I would

Creating a wordpress plugin seems to be beyond my skill.

No matter what I try, it just shows the HTML above the page and messes everything up. Tried it in a page and installed a plugin that allows PHP in the post, it kind of works but echo's the answer to a blank screen and not the wordpress page.

I'll keep playing for you OP, but I may not be able to do it.

I appreciate your efforts.

I have seen dozens of calculators of varying degrees of complexity, on similar turf/garden related websites but view source may as well be in Aramaic.

<script>

function updateQuote(area){

var area = parseInt(document.getElementById('gardenArea').value);
var pricePlan = parseInt(document.getElementById('priceOption').value);

var quote = area * pricePlan;
document.getElementById('quoteResult').innerHTML = quote;

}

</script>

Garden Area: <input type="text" name="gardenArea" id="gardenArea" onKeyUp="updateQuote();" style="width:40px;"> (square meters),
Price Plan:
<select name="priceOption" id="priceOption" onChange="updateQuote();">
<option value="10">Cheapest</option>
<option value="20">Cheap</option>
<option value="30">Expensive</option>
<option value="40">Most Expensive</option>
</select>
<br/>
Quote: &pound;<span id="quoteResult">0</span>

Thanks for the suggestion. Unfortunately, I get four individual drop-down boxes which don't seem to influence or effect any calculation when chosen.

 

[Mr^B]

The net answer from all this is:

"You can, but you have to learn how to code in php/javascript first"

The code above has been mangled by the forum parser, so ignore it. If you want something like that, get a "my first php/wordpress site" book and start from there.

 

[rickh]

I appreciate your efforts.

I have seen dozens of calculators of varying degrees of complexity, on similar turf/garden related websites but view source may as well be in Aramaic.




Thanks for the suggestion. Unfortunately, I get four individual drop-down boxes which don't seem to influence or effect any calculation when chosen.

The code works fine, as said above, the forum has messed with the formatting.

If you can't make the above code work by looking for what's wrong, you really need to start at the very basics.
I would fix it and put it on pastebin, but it's so easy to fix I'm not going to bother.