title: Is there a method to dynamically change content in Twig blocks without refreshing the page?
body: <p>I'm not sure if my title is accurate, so I'll do my best to explain here.</p>
  
  <p>What I'm trying to attempt to do is to call my controller with Ajax and have it change the content on the page without reloading (The content being defined by blocks). So for a loose example, on arrival of the homepage, the homepage's content would be:</p>
  
  <pre><code># routing.yml
  StackQuestionBundle_osgs_home:
      pattern:  /
      defaults: { _controller: StackQuestionBundle:Pages:index }
      options:
          expose: true
  
  StackQuestionBundle_osgs_page:
      pattern:  /page
      defaults: { _controller: StackQuestionBundle:Pages:page }
      options:
          expose: true
  </code></pre>
  
  <hr>
  
  <pre><code>&lt;!-- @StackQuestionBundle:Pages:index.html.twig --&gt;
  &lt;header&gt;
       {% block title %} &lt;!-- Title --&gt; {% endblock %}
       &lt;nav&gt; &lt;/nav&gt;
  &lt;/header&gt;
  
  &lt;main&gt;
      &lt;aside&gt; &lt;!-- Sidebar --&gt; &lt;/aside&gt;
      &lt;section&gt;        
           {% block content %} &lt;!-- Main Content --&gt;{% endblock %}
      &lt;/section&gt;
  &lt;/main&gt;
  
  
  &lt;footer&gt;
      {% block footer %} &lt;!-- content --&gt; {% endblock %}
      &lt;nav&gt; &lt;/nav&gt;
  &lt;/footer&gt;
  </code></pre>
  
  <hr>
  
  <pre><code>// JS
  $('nav button.test').click(function() {
      $.ajax({
          url: "{{ path('OSGSBundle_osgs_page') }}",
          type: "POST",
          success: function(data) {
              //Change the content in the blocks!
              //alert("It worked!")
          }
      });
  });
  </code></pre>
  
  <hr>
  
  <pre><code> # PagesController.php
  
  namespace MyNameSpace\StackQuestionBundle\Controller;
  use Symfony\Bundle\FrameworkBundle\Controller\Controller;
  use Symfony\Component\HttpFoundation\Request;
  
  class PagesController extends Controller
  {
      public function indexAction()
      {
          return $this-&gt;render('OSGSBundle:Pages:index.html.twig');
      }
      public function pageAction(Request $request)
      {
          $isAjax = $this-&gt;get('Request')-&gt;isXMLHttpRequest();
          if ($isAjax)
          {
              // Replace/Append the content in index.html.twig with the content from page.html.twig
          }
          else
          {
              // Load page normally if navigated to http://localhost/page
              return $this-&gt;render('OSGSBundle:Pages:page.html.twig');
          }
      }
  }
  </code></pre>
  
  <hr>
  
  <p>This is what my current code looks like. So far, I've managed to replace data according to DOM elements only. So, I'd replace all the information in my <code>&lt;main&gt;</code> tag for instance. I ONLY want to replace content in my Twig block tags. Side note: I'm using FOSJSRoutingBundle to change the URLs.</p>
  
  <p>Thanks in advance, I appreciate the help/advice. I hope this wasn't too confusing.</p>