0

I'm trying to implement a search box that uses my CartoDb data? My current code does not work.

Html:

<link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/3.15/themes/css/cartodb.css" />
<script src="http://libs.cartocdn.com/cartodb.js/v3/3.15/cartodb.js"></script>
<div class="panel" style="height:700px">
  <div class="bar">
    <h2 class="beta">My Map</h2>
  </div>
<div id="map"></div>
 <form>
   <input type="Text" name="userInput" id="select-place" class="select-place"> 
   <input type="submit" value="Submit" onclick="processFormData();" />
 </form>
</div>

Js:

function processFormData() {
  var input = document.getElementById("select-place").value;
  return input;
}   

function main() {
  cartodb.createVis('map', 'https://testuser.cartodb.com/api/v2/viz/123456789/viz.json', {
   title: false,
   description: false,
   tiles_loader: false
  })
  .done(function(vis, layers) {

  var userInput = processFormData();
  var sql = new cartodb.SQL({ user: 'testuser' });
    sql.getBounds("select * from testdb where name like ='%userInput%'").done(function(bounds) {
   map.fitBounds(bounds)
   });

var subLayer = layers[1].getSubLayer(0);
createSelector(subLayer);
 })
 .error(function(err) {
  console.log(err);
 })
 }
 window.onload = main;
1

That code can't work, you need to put the logic on using the SQL API on the function called by the submit button (processFormData) and that createSelector call is not defined anywhere.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.