Help how to print query to html

This my First time using FaunaDB i have trying looking for solution, to print query to html page using javascript, but almost no info about it. hope some guru can show the right way. with some example. tq

in here my code
var faunadb = window.faunadb

var q = faunadb.query

var client = new faunadb.Client({

secret: ‘45645435643535’, //faceksecretkey

domain: ‘db.fauna.com’,

scheme: ‘https’

})

var createP = client.query(

q.Get(q.Ref(q.Collection(‘latnlong’), ‘302063485141910023’))

)

.then((ret) => console.log(ret))

.catch((err) => console.error(‘Error: %s’, err))

Note that you don’t need to specify domain: 'db.fauna.com', or scheme: 'https' when you create the client connection object: those are default values.

In the line:

.then((ret) => console.log(ret))

The console.log function call is what makes the query result display in the developer console.

If you want to include the result somewhere on your page, create an element with a known id, perhaps:

<pre id="result"></pre>

and then you could do:

.then((ret) => {
  var pre = document.getElementById("result")
  pre.innerHTML = JSON.stringify(ret.data)
})

If there are specific fields to report, then you would handle them in similar fashion. Based on your query, I’m assuming that the result would include lat and long field. So if your HTML contains:

<p>
  Latitude: <span id="lat"></span>,
  Longitude: <span id="long"></span>
</p>

Then you might do this:

.then((ret) => {
  var lat = document.getElementById("lat")
  lat.innerHTML = ret.data.lat
  var long = document.getElementById("long")
  long.innerHTML = ret.data.long
})

You could also use a helper library like jQuery to make it simpler to manipulate your HTML. Or you could try using an app framework like React or Vue.js to coordinate the database queries with presentation updates.

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.