How to update prices in jQuery calculator via PHP - php

I am creating a "budget calculator" to manage money at festivals.
Can anyone tell me how you would include a PHP script within the JQuery?
So far I have the form calculating how much you may spend given your habits in different categories per day, then times it by 3 for the weekend.
I want to be able to update these prices as I go in order to make sure the price is as always as up to date as possible. So I created a mysql database and query that calculates the medium price and then returns it back to the page via a php script.
This is a JSfiddle to give you an idea of what it looks like at the moment - although it's not working on the site but you can see the set up.
JSfiddle
Here is a screen shot of what the form actually looks like. As you can see the price beside the title of each input is displayed via the php include. The button on the right leads to the "update" form that allows you to enter a new price.
This is an example of the query that is used to display calculate the medium:
PHP:
<?php
include 'connect.php';
$query = "SELECT x.price FROM price_pints x, price_pints y GROUP BY x.price HAVING SUM( SIGN( 1 - SIGN( y.price - x.price ) ) ) / COUNT( * ) > .5 LIMIT 1";
$result = mysql_query($query) or die(mysql_error());
while($row = mysql_fetch_array($result)){
echo "£".$row['price'];
}
?>
What I'm trying to do is get this same php include to work within the "data-unit-price" tag.. Any ideas?
Thanks.

DISCLAIMER: this is the EASIEST way i come up with, i'm trying to avoid more advanced things like dynamically generated javascript or ajax
When you build the page (PHP, server-side), load the 3 prices in three variables and then have 3 hidden inputs like this
<input type="hidden" id="pint_price" value="<?php echo $pint_price; ?>">
your script should look at the hidden input's values to initialize the calculator.
NOTE: if the prices change while the page has already been loaded, the user does not see the update. you may want to consider putting a disclaimer somewhere.
The BEST solution would be to have an ajax request every time the user inserts a new value (if bandwith is not an issue, either for your server and for the user) or every X minutes.
See jQuery get docs for reference and examples.
On an unrelated note, you really shouldn't be using mysql_* for interact with (MySQL) databases. Make a little effort and learn to use PDO. I really recommend it.

Related

Notification System that loops through first ten database entries

I have looked for days now and cannot seem to find any direct examples of what I am trying to accomplish, that I can reference.
I am trying to create a simple, elegant notification system, that pulls a persons image, name (in text format), and a predefined message (selected from drop down menu), from a database, and then displays the info in an elegant little "profile like" layout, on a webpage or smartphone. The only feature that I want the app to have is an auto refresh setup (using AJAX maybe?) that cycles through the latest ten entries into the database, in a continual loop.
I already have the MySql database set up, as well as the form which supplies the information that I want show, into the database -- but I can't for the life of me figure out how to pull that info into a nice little alert, and get it to cycle through the latest ten database entries.
Thank you so much, in advance, for any assistance you can provide. I'm ok with databases, and Php, but I'm racking my brain trying to figure out how to get it to display and cycle through the first ten entries.
Thanks again!
If you have an id column or some sort of timestamp column, you can use ORDER BY and LIMIT in MySql to extract only the last X recrods.
For example:
SELECT * FROM profiles ORDER BY id DESC LIMIT 10
That will extract the top 10 id's, where in a standard id column, that will be the last 10 records.
As for formating the display - that is way to wide, and there are a lot of ways to do so.
I think you should have PHP file with SQL query SELECT ... ORDER BY id LIMIT 10, and use json_encode to JSON encode the returned array. JSON is easy to use with AJAX with JavaScript.
And about AJAX - I would use jQuery and use jQuery.getJson from PHP file do sleep and loop it
EDIT: On refresh you will do a new JSON parse, and remove last elements of container with cards, and use new elements

Multiple result sites (pagenumber buttons)

I have a website were the user types in a city (f.e.: Washington), presses search and via ajax json it gets the entries from my database. I never know how many entries it got, so let's say this time I have 40 entries in my database where it says "Washington". Now a function appends all 40 entries on the site.
How do I get it to show only 4 entries and then add number buttons where the user can go to page "X" to see another 4 entries and so on?
second question:
And how do I tell the script to just add a specific amount of number buttons ( In this case just 10, since 10*4=40 already )?
I don't necessarily need a full code example, just a good explanation on how I can do this (without a plugin).
Here a simple drawing to clarify this:
Thank you very much in advance for any answer.
There is an excellent tutorial on tutsplus covering the kind of pagination as seen on your image. You would just need to modify the sql query in the script to match your requirements, point your ajax url to this pagination script, and ensure the results are returned as json. Hope this helps!
To setup the pagination you would need to use mysql LIMIT & OFFSET, also counting the total number of results and returning that in the JSON to set the correct number of pages in the pagination.
You would also need to pass the page number in the ajax call through a GET parameter so you can set the OFFSET correctly and return the correct page.
I tried some jQuery pagination plugins but they were a little buggy. So I chose pure PHP and made a really simple one myself, since the tutorials seemed a bit too overloaded to me.
I just pass pagenr via GET and in my script a set a specific amour of results to be displayed via Limit $start(=0 if pagenr=1), 10
If the pagenr is bigger then "1" it undergoes a for loop which adds up "10" to "$start" every time.
And with these values and COUNT(*) I do the pagination with for and if loops.

Creating Interactive Poll With Results Page

I'm looking to create a poll/form that will allow the user to select a starting 11 for a football game (or soccer if you're American), and then submit it and then see an image of the most popular team selection among the fans (maybe most popular for each position instead of most popular team selection all together).
Ideally I would like the form to have options for formation (4-4-2, 4-3-3, 4-5-1 etc) that would change the layout/inputs on the form (but this is definitely not essential, would just be a nice touch - I would just stick with 4-4-2 otherwise).
My dream idea is that there will be a dashboard on the bottom that had player profile pictures that can be dragged and dropped into their positions; However having simple drop down boxes would work too (as long as a player cant be used twice - which is another stumbling block because you don't want the same player to be in both CB positions.)
Design Concept (Results page would basically be the same just without the bottom dashboard):
I have absolutely no idea how to approach this as it is way more complex than anything I have attempted in the past. (Forgot to mention I would like to be able to reset the results every week or so if possible)
So if someone could let me know if its do-able, and if it is, take me through how to do it step by step or even mock one up for me it would be much appreciated.
Thanks.
It doesn't have to be a form.
Here how you do it:
Create the divs for the squares on the field.
Assign each of them a unique id e.g.
id="square-1"
and give them a common class e.g class="field-square"
Create the divs for the squares outside the field. Give them a common class, and a unique id for each.
When you drop the squares, have a function that extracts the ids when they are dropped.
Then simply post them to your PHP site with jQuery.post()
Update
To extract the ids, in your callback (after you have dropped the square) do something like this:
square_id = square_id.replace('square-', '');
Since you've not assigned number ids (which you should, so that you can easily change the players in future by getting them from a database), you can simply get the ids using $(this).attr('id') in your callback.
Also look up http://api.jquery.com/jQuery.post/
I wouldn't even think about dragging and dropping at this point. Outline what the minimal viable product would be and come up with a set of steps to do that.
Going off the data you provided I would suggest something like this...
1) Build an html form that list simply a list of all the positions and a dropdown of all the possible players that can fill that position.
2) Fill out the form (select the players) and on form submit get the data echo'd as an array.
3) Create the graphic...I see two approaches....(1) server side (GD or Imagick are probably what you are going to want to use) or (2) CSS/html images
Either one will a fine approach....this step should probably be broken into little steps...start with simply displaying a list and an image of the player next to it...
HTML would be
echo "<img src='/images/players".$_POST["position1"]."' alt=''/>";
//(NOTE YOU HAVE TO CLEAN ANY DATA YOU ARE OUTPUTTING PROPERLY)
Imagick would be something like..
$bg = new Imagick("/images/bg.jpg");
$position = new Imagick("/images/players".$_POST["position1"]);
//Second image is put on top of the first
$bg->compositeImage($position, $position->getImageCompose(), 5, 5);
//new image is saved as final.jpg
$bg->writeImage('final.jpg');

Saving a value to a database then appending a value to it

So im doing a project and i have made a webpage, on this page i have a total value which is a float inside of a div called total. What i want to do is save this value to a database on my webspace (im hosted by 123 reg) so each user saves the total that they get and then the total in the database in the website is constantly updated and displayed again on the website as a "Global total".
I have no idea about how i would go about doing this any takers?
Ok so basically you might want to take a look at Javascript, especially how to submit a form using javascript:
http://www.javascript-coder.com/javascript-form/javascript-form-submit.phtml
Then you want to take a look on how to process this data in PHP.
The data should come in within the $_GET or $_POST variables.
And you might want to learn about SQL INSERT statements.
http://www.ntchosting.com/mysql/insert-data-into-table.html (somewhere around the bottom)
And then you might want to learn about using the MySQL SELECT-Statement. With that you can use a summation operation to get the sum of all totals and then using PHP echo that into the page again.
Or using AJAX you could load it into the page in a somewhat "live" action.

how can i make a dynamic drop down box in php?

i need in an php file three drop down boxes or multiple select boxes.
the entries from these boxes are in a mysql database.
the single problem is that the entries in the thrid box depend on the second, and the entries in the second depend on the first.
can someone help? know any examples?
There are basically 3 ways to achieve this:
Use JavaScript to submit() the form to the server side during onchange of the dropdown and let PHP load the options and render the child dropdown accordingly based on the selected dropdown value. Technically the simplest way, but also the least user friendly way. You probably also want to revive all other input values of the form.
Let PHP populate all possible child dropdown values in a JavaScript array and use a JavaScript function to fill and display the child dropdown. A little bit trickier, certainly if you don't know JavaScript yet, but this is more user friendly. Only caveat is that this is bandwidth and memory inefficient when you have relatively a lot of dropdown items. Imagine three dropdowns which can each hold 100 items, that would mean a JS array of 100 * 100 * 100 = 1 million items. The page might then grow over 1MB in size.
Let JavaScript fire an asynchronous (ajaxical) HTTP request to the server side and fill and display the child dropdown accordingly. Combines the best of options 1 and 2. Efficient and user friendly. jQuery is extremely helpful in this since it removes the concerns about crossbrowser compatibility with regard to firing ajaxical requests and traversing the HTML DOM tree. You would otherwise end up with double, triple or even much more of code needed to achieve this.
If you let know in a comment or an update of your question which way you would prefer and where exactly you're stucking while implementing the solution, then I'll maybe update the answer to include a basic kickoff example.
I'm from Portugal, so, what we do it's based on Portuguese language, never the less, we've made many working websites and platform's with what you want, please check this link...
if this is what you want, I can send you the code:
http://www.medipedia.pt/home/home.php?module=farmacia

Categories