469,947 Members | 2,427 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,947 developers. It's quick & easy.

How to build ajax function?

Hello,

I am trying to update data on my webpage using AJAX. The idea is when a user clicks a checkbox the data will be updated.

This is the code that I have so far:
Expand|Select|Wrap|Line Numbers
  1. <script type="text/javascript">
  2. var refreshData = function() {
  3. asdf
  4. };
  5. $('input[type=checkbox]').live( 'click', refreshData );
  6. </script>
  7.   <input type="checkbox" id="checkbox_<?= $statistic_id; ?>" <?= $i==0 ? 'checked="checked"' : null; ?> onclick="refreshData()" />
  8.  
I am having trouble building the refreshData function because I am very unfamiliar with AJAX. The AJAX function would primarily consist of building the ajax query and then executing the ajax query and then taking the returned data and displaying it

For your reference, I am pulling data from this source: http://tyrone.pae.me/pulldata.php?p=1&s=40 where p is a player id number and s is a statistic associated with the player. You'll notice that I reference a statistic_id in the id of the checkbox. Not sure if that is helpful or not.

If you have any ideas on how this can be achieved or need more information, please reply to this thread. Thanks!
Oct 16 '10 #1
4 1422
gits
5,390 Expert Mod 4TB
so basically your question is: how to use the jQuery ajax methods in your case?
Oct 17 '10 #2
Yes, I'm just unsure as to which ones are most pertinent in my situation. Could you advise further on which methods you would recommend for my situation?
Oct 18 '10 #3
gits
5,390 Expert Mod 4TB
??? ... what is your situation? basically to retrieve the data seems quite simple with jQuery ... and then you would just need to have your response-handling-callback to update the corresponding nodes.

if you use such a json structure as you did in your example-link then you would need to eval it and just process the JavaScript structure. you could even prepare that more by creating html-fragments serverside that would replace some current nodes in your document ... which could avoid expensive DOM manipulation with JavaScript etc. ...

@the moment i think that i just don't get the real point of your question?
Oct 19 '10 #4
Okay, to update you on where I am currently, I have written the following code:
Expand|Select|Wrap|Line Numbers
  1. <script>
  2.          var drawLineOnGraph = function ( array ) {
  3.  
  4.             line = new RGraph.Line('myLine', array );
  5.             line.Draw();
  6.  
  7. }
  8.  
  9.    function refreshData() {
  10.    var url = "/pulldata.php?p=" + pid + "&s=" + statistic_id + "";
  11.    $.getJSON( url,
  12.    function(data){
  13.      for ( pid in data ) {
  14.        for ( statistic_id in data[ pid ] ) {
  15.          console.log( data[ pid ][ statistic_id ] );
  16.          drawLineOnGraph( data[pid][statistic_id] );
  17.       }
  18.     }
  19.    } );
  20. </script>
  21.  
This is the part of my code where I am trying to pull data using AJAX and then I write the values on a graph that I am building. A secondary component of the process is that the redrawing of the line is initiated by selecting a check box. Here is the code I have for the checkbox:

Expand|Select|Wrap|Line Numbers
  1. <script type="text/javascript">
  2. $('input[type=checkbox]').live( 'click', refreshData );
  3. </script>
  4. <div id="playerstats">
  5. <table width="265px" border="0" >
  6. <? $i = 0; foreach ($combine as $statistic_id => $stat_values): ?>
  7. <tr>
  8. <td NOWRAP style="vertical-align:middle; font-size : 11px;">
  9.   <input type="checkbox"  id="checkbox_<?= $statistic_id; ?>" <?= $i==0 ? 'checked="checked"' : null; ?> />
  10.   <label for="checkbox_<?= $statistic_id; ?>"><?= getStatisticFromId ( $statistic_id ); ?></label>
  11. </td>
  12. </tr>
  13. <? $i++; endforeach; ?>
  14. </table>
  15. </div>
  16.  
The idea is to redraw the line on my graph (I am using RGraphs) when a checkbox is selected. I hope that clarifies a little better.
Oct 19 '10 #5

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

3 posts views Thread by Sandman | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.