title: Using javascript function to load a view
body: <p>I trying to load a view into my div #teste with this.id through JavaScript without success. What's wrong on my function?</p>
  
  <p>JavaScript function below</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  
  var baseurl = '&lt;?php site_url(); ?&gt;'; //raiz do website
  
  function navbutton(id) {
  
      $.ajax({
          type: 'GET',
          url: baseurl+'main/'+id,
          dataType: 'html',
          success: function(html) {
              $('#teste').html(html);
          }
      });
      }
  </code></pre>
  
  <p></p>
  
  <p>HTML button</p>
  
  <pre><code>&lt;li&gt;&lt;a href="javascript:void(0)" id="contato" onclick="navbutton(this.id)"&gt;Contato&lt;/a&gt;&lt;/li&gt;
  </code></pre>
  
  <p>My main Controller (one function to call all others views)</p>
  
  <pre><code>class Main extends CI_Controller {
  
  var $_data = array();
  
  public function index()
  {
      if (!$this-&gt;uri-&gt;segment(1) &amp;&amp; !$this-&gt;uri-&gt;segment(2)) {
          $view = 'inicio';
      }
      if ($this-&gt;uri-&gt;segment(1) &amp;&amp; !$this-&gt;uri-&gt;segment(2)) {
          $view = $this-&gt;uri-&gt;segment(1, 'inicio');
      }
      if ($this-&gt;uri-&gt;segment(1) &amp;&amp; $this-&gt;uri-&gt;segment(2)) {
          $view = $this-&gt;uri-&gt;segment(1, 'inicio') . '/' . $this-&gt;uri-&gt;segment(2, '');
      }
      if (!file_exists(APPPATH . 'views/' . $view . EXT)) {
          $view = "404";
          header("HTTP/1.0 404 Not Found");
      }
  
      $this-&gt;load-&gt;view('templates/header');
      $this-&gt;load-&gt;view($view, $this-&gt;_data);
      $this-&gt;load-&gt;view('templates/footer');
  
  }
  </code></pre>