title: Codeigniter - Add a marker to a Google map using a html form and store in a database
body: <p>Hi I am trying to build an application that uses Codeigniter and Google maps. I am new to both and I am trying to allow a user to add a marker to a map using a HTML form and then store it in a database. </p>
  
  <p>I am using Codeigniter and a Google Maps library from <a href="http://biostall.com/codeigniter-google-maps-v3-api-library" rel="nofollow">here</a></p>
  
  <p>I generate a map using a Maps function in my controller </p>
  
  <pre><code>public function maps()
   {
  
     $data['title']= 'Maps';
  
     $config['center'] = $_GET['venue_lat'].",". $_GET['venue_long'];
     $config['height'] = '450px';
     $config['width'] = '100%';
     $config['zoom'] = '15';
     $config['trafficOverlay'] = TRUE;
     $config['places'] = TRUE;
     $config['placesLocation'] = $_GET['venue_lat'].",". $_GET['venue_long'];
     $config['placesRadius'] = 3000;
     $config['placesName'] = "church";
  
     $this-&gt;googlemaps-&gt;initialize($config);
  
     $marker = array();
     $marker['position'] = $_GET['venue_lat'].",". $_GET['venue_long'];
     $marker['infowindow_content'] = $_GET['venue_name'];
     $marker['icon'] = 'http://chart.apis.google.com/chart?  chst=d_map_pin_letter&amp;chld=A|9999FF|000000';
     $marker['title'] = $_GET['venue_name'];
  
     $this-&gt;googlemaps-&gt;add_marker($marker);
  
     $data['map'] = $this-&gt;googlemaps-&gt;create_map();
  
     $this-&gt;load-&gt;view('include/reviews_header',$data);
     $this-&gt;load-&gt;view('pages/reviews_view.php', $data);
     $this-&gt;load-&gt;view('include/footer',$data);
  </code></pre>
  
  <p>}</p>
  
  <p>Controller function to add a service</p>
  
  <pre><code>public function services()
  
   {
  
    $data['title']= 'Services';
    $this-&gt;load-&gt;model('addService_model');
    $this-&gt;load-&gt;helper(array('form', 'url'));
  
    $this-&gt;addService_model-&gt;new_services();
  
  }
  </code></pre>
  
  <p>In my Header I have </p>
  
  <pre><code> &lt;?php 
    echo $map['js']; 
   ?&gt;
  </code></pre>
  
  <p>And my Maps view</p>
  
  <pre><code>  &lt;?php
    echo '&lt;div id="map_canvas"&gt;';
     echo $map['html']; 
    echo '&lt;/div&gt;';
    ?&gt;
  </code></pre>
  
  <p>This all works fine and I am able to dynamically create a map centring it using the coordinates based on the location set by the $_GET variables received from a drop down menu.</p>
  
  <p>I am now trying to allow users to add a marker to the map using a html form and I am unsure of how to go about it.I have a form on in the same view that the map is displayed in.</p>
  
  <p>Form - the action goes to a Services function in my controller</p>
  
  <pre><code> &lt;form id="add_marker" action='&lt;?php echo site_url("user/services") ?&gt;' method="POST"&gt;
  
       &lt;fieldset&gt;
  
          &lt;legend&gt;Add New Marker to Map&lt;/legend&gt;
  
                  &lt;div class="input"&gt;
                      &lt;label for="name"&gt;Service Name&lt;/label&gt;
                      &lt;input type="text" name="service_name"id="name"&gt;
                  &lt;/div&gt;
  
                  &lt;div class="input"&gt;
                      &lt;label for="address"&gt;Service Town&lt;/label&gt;
                      &lt;input type="text" name="service_location"id="address"&gt;
                  &lt;/div&gt;
  
                  &lt;div class="input"&gt;
                    &lt;label for="address"&gt;Service Type&lt;/label&gt;
                    &lt;input type="text" name="service_type"id="type"&gt;
                  &lt;/div&gt;
  
                  &lt;div class="input"&gt;
                    &lt;label for="address"&gt;Service latitude&lt;/label&gt;
                    &lt;input type="text" name="service_lat"id="lat" value="document.getElementById('displayLat').value;"&gt;
                  &lt;/div&gt;
  
                  &lt;div class="input"&gt;
                    &lt;label for="address"&gt;Service longitude&lt;/label&gt;
                    &lt;input type="text"name="service_long"id="long"&gt;
                  &lt;/div&gt;
  
                   &lt;button type="submit" id="submit_btn"&gt;Add Marker&lt;/button&gt;
      &lt;/fieldset&gt;
   &lt;/form&gt;
  </code></pre>
  
  <p>The Services function calls up my AddService model which sets up the connection to my database for inserting the data from my form</p>
  
  <pre><code>&lt;?php  
  class AddService_model extends CI_Model {  
  
  
    public function __construct()
     {
       parent::__construct();
     }
  
         function new_services() 
  
          {
  
          $service_data = array(
          'service_name' =&gt; $this-&gt;input-&gt;post('service_name'),
          'service_location' =&gt; $this-&gt;input-&gt;post('service_location'),
          'service_lat' =&gt; $this-&gt;input-&gt;post('service_lat'),
          'service_long' =&gt; $this-&gt;input-&gt;post('service_long'),
          'service_type' =&gt; $this-&gt;input-&gt;post('service_type')
           );
  
          $this-&gt;db-&gt;insert('service', $service_data);
  
         } 
  /*End of file fixture_model.php*/
  /*Location .application/models/fixture_model.php*/ 
  ?&gt; 
  </code></pre>
  
  <p>I am stuck on a couple of points and am confused as to what to do.</p>
  
  <p>I need to allow a user to add a marker using the form but don't know how to get the lat/long coordinates into the form. I can add a marker to the map using the library which also allows me to get the coordinates using an alert but I want to get these into the latitude and longitude inputs on my form.</p>
  
  <p>This code is in my controller and puts a marker on the map</p>
  
  <pre><code>$config['onclick'] = 'createMarker_map({ map: map, position:event.latLng });  alert(event.latLng.toString());';
  </code></pre>
  
  <p>I then need to submit the form and insert the values into the Service table in my database.</p>
  
  <p>The second issue I am unsure about is how to achieve this without refreshing the page I am on because I dont want to reset the $_Get variables. If these variables reset I get unknown variable errors.</p>
  
  <p>This is the first time I have used Codeigniter, Google Maps Library or the Google Maps API V3 and I don't know how to approach this across an MVC platform. Any help greatly appreciated.</p>