I am looking to create a simple HTML website with the data from my iOS app displayed in tables. I use Parse for my mobile data, and I will be using Javascript to display it on the website.

I have developed a JSP-based website before, but this time I am using a Javascript plugin for Wordpress, so I cannot use JSP files. Therefore I will need to handle everything in HTML code.

Is there a way to get the following Parse query into a HTML table?

var GameScore = Parse.Object.extend("GameScore");
var query = new Parse.Query(GameScore);
query.equalTo("playerName", "Dan Stemkoski");
query.find({
  success: function(results) {
    alert("Successfully retrieved " + results.length + " scores.");
    // Do something with the returned Parse.Object values
    for (var i = 0; i < results.length; i++) { 
      var object = results[i];
      alert(object.id + ' - ' + object.get('playerName'));
    }
  },
  error: function(error) {
    alert("Error: " + error.code + " " + error.message);
  }
});

I am looking to create a simple HTML website with the data from my iOS app displayed in tables. I use Parse. for my mobile data, and I will be using Javascript to display it on the website.

I have developed a JSP-based website before, but this time I am using a Javascript plugin for Wordpress, so I cannot use JSP files. Therefore I will need to handle everything in HTML code.

Is there a way to get the following Parse. query into a HTML table?

var GameScore = Parse.Object.extend("GameScore");
var query = new Parse.Query(GameScore);
query.equalTo("playerName", "Dan Stemkoski");
query.find({
  success: function(results) {
    alert("Successfully retrieved " + results.length + " scores.");
    // Do something with the returned Parse.Object values
    for (var i = 0; i < results.length; i++) { 
      var object = results[i];
      alert(object.id + ' - ' + object.get('playerName'));
    }
  },
  error: function(error) {
    alert("Error: " + error.code + " " + error.message);
  }
});

• javascript
• html
• parse-platform

Share Improve this question Follow asked May 2, 2014 at 8:56 nickjf89nickjf89 46811 gold badge77 silver badges1818 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 8

Create a custom page template for the page you want to show this data on. e.g. create a page called 'score-table' in Wordpress Admin and then create a page template in your theme called 'page-score-table.php'.

Include the parse library scripts in the page and jQuery if you need to (though this should be loaded by Wordpress anyway) and then use something like this.

<table id="results-table">
<tr>
  <th>User Name</th>
  <th>Score</th>
</tr>
</table>

...

<script>
Parse.initialize("Your", "Credentials");

var GameScore = Parse.Object.extend("GameScore");
var query = new Parse.Query(GameScore);
query.equalTo("playerName", "Dan Stemkoski");
query.find({
    success: function(results) {
       for (var i = 0; i < results.length; i++) { 
           var object = results[i];
               (function($) {
                   $('#results-table').append('<tr><td>' + object.get('playerName') + '</td><td>' + object.get('score') + '</td></tr>');
               })(jQuery);
       }
    },
    error: function(error) {
        alert("Error: " + error.code + " " + error.message);
    }
});
</script>

Fiddle showing it HERE, set up a dummy Parse table to show you.

Actually replace the success function with this, I believe append is quite expensive if you have a lot of rows...

...
///before query.find();
var myScores='';
...
success: function(results) {
for (var i = 0; i < results.length; i++) { 
  var object = results[i];
  myScores+='<tr><td>' + object.get('playerName') + '</td><td>' + object.get('score') + '</td></tr>';
}
  (function($) {
      $('#results-table').append(myScores);
  })(jQuery);
}