iriberri · September 8, 2015 12:58
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html>
  <head>
    <title>Change marker example | CartoDB.js</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <link rel="shortcut icon" href="http://cartodb.com/assets/favicon.ico" />
    <style>
    html, body, #map {
    height: 95%;
    padding: 0;
    margin: 0;
  }
    </style>

    <link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/3.15/themes/css/cartodb.css" />
  </head>
  <body>
    <div id="map"></div>

    <div>
    <p>Hi, this is your data</p>
      Latitude: <input id="latitude" type="text" name="lat">    
      Longitude: <input id="longitude" type="text" name="long">    
      Name: <input id="name" type="text" name="the_name"> 
      <input type="button" value="Send data" id="send" onclick="send();"/>
   



    <!-- include cartodb.js library -->
    <script src="http://libs.cartocdn.com/cartodb.js/v3/3.15/cartodb.js"></script>

    <script>

      var my_layer;

   function main() {

    var lat;
    var lon;
    var name;

        // create leaflet map
        var map = L.map('map', { 
          zoomControl: false,
          center: [43, 0],
          zoom: 3
        })

        // add a base layer
        L.tileLayer('http://tile.stamen.com/toner/{z}/{x}/{y}.png', {
          attribution: 'Map tiles by Stament. CartoDB attribution.'
        }).addTo(map);

        cartodb.createLayer(map, {
          user_name: 'iriberri',
          type: 'cartodb',
          sublayers: [{
            sql: "SELECT * FROM test_public_data_example",
            cartocss: '#test_public_data_example{  marker-fill-opacity: 0.9; marker-line-color: #FFF;  marker-line-width: 1;  marker-line-opacity: 1;  marker-placement: point;  marker-type: ellipse;  marker-width: 10;  marker-fill: #FF6600;  marker-allow-overlap: true;}'
         }]
          })
          .addTo(map)
          .done(function(layer) {
              my_layer = layer;
          });

       
       map.on('click', function(e) {

           $("#latitude").val(e.latlng.lat);
           $("#longitude").val(e.latlng.lng);


          });

      

      }

       function send(){
 
        lat = document.getElementById("latitude").value;
        lon = document.getElementById("longitude").value;
        name = document.getElementById("name").value;

         var sql = new cartodb.SQL({ user: 'iriberri' });


            //You need to retrieve the value you're interested in
           sql.execute("INSERT INTO test_public_data_example (latitude, longitude, name, the_geom) VALUES (" + lat +", "+lon+", '"+name+"', ST_SetSRID(ST_MakePoint(" + lon +", "+lat+"), 4326))");

           my_layer.redraw();
        }

      // you could use $(window).load(main);
      window.onload = main; 
    </script>
  </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>Change marker example \| CartoDB.js</title>
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
	<link rel="shortcut icon" href="http://cartodb.com/assets/favicon.ico" />
	<style>
	html, body, #map {
	height: 95%;
	padding: 0;
	margin: 0;
	}
	</style>

	<link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/3.15/themes/css/cartodb.css" />
	</head>
	<body>
	<div id="map"></div>

	<div>
	<p>Hi, this is your data</p>
	Latitude: <input id="latitude" type="text" name="lat">
	Longitude: <input id="longitude" type="text" name="long">
	Name: <input id="name" type="text" name="the_name">
	<input type="button" value="Send data" id="send" onclick="send();"/>




	<!-- include cartodb.js library -->
	<script src="http://libs.cartocdn.com/cartodb.js/v3/3.15/cartodb.js"></script>

	<script>

	var my_layer;

	function main() {

	var lat;
	var lon;
	var name;

	// create leaflet map
	var map = L.map('map', {
	zoomControl: false,
	center: [43, 0],
	zoom: 3
	})

	// add a base layer
	L.tileLayer('http://tile.stamen.com/toner/{z}/{x}/{y}.png', {
	attribution: 'Map tiles by Stament. CartoDB attribution.'
	}).addTo(map);

	cartodb.createLayer(map, {
	user_name: 'iriberri',
	type: 'cartodb',
	sublayers: [{
	sql: "SELECT * FROM test_public_data_example",
	cartocss: '#test_public_data_example{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 1; marker-line-opacity: 1; marker-placement: point; marker-type: ellipse; marker-width: 10; marker-fill: #FF6600; marker-allow-overlap: true;}'
	}]
	})
	.addTo(map)
	.done(function(layer) {
	my_layer = layer;
	});


	map.on('click', function(e) {

	$("#latitude").val(e.latlng.lat);
	$("#longitude").val(e.latlng.lng);


	});



	}

	function send(){

	lat = document.getElementById("latitude").value;
	lon = document.getElementById("longitude").value;
	name = document.getElementById("name").value;

	var sql = new cartodb.SQL({ user: 'iriberri' });


	//You need to retrieve the value you're interested in
	sql.execute("INSERT INTO test_public_data_example (latitude, longitude, name, the_geom) VALUES (" + lat +", "+lon+", '"+name+"', ST_SetSRID(ST_MakePoint(" + lon +", "+lat+"), 4326))");

	my_layer.redraw();
	}

	// you could use $(window).load(main);
	window.onload = main;
	</script>
	</body>
	</html>