Update HTML block content via ajax
<p>I have a main <code>index.html</code> file and want to update only a certain block of that template via ajax.</p>

<p>As, I am already using <code>swig</code> on server side I decided to leverage that on my client side also.</p>

<p>I have a below ajax call and on success I want to update an HTML block.</p>

<pre><code>$(function(){

    $('#category_nav').click(function(e){
        e.preventDefault();
        var obj = {};
        obj.cgid = $(this).attr("href");
        $.ajax({
            type : 'GET',
            contentType: 'application/json',
            dataType : 'json',
            data: obj,
            url : '/SearchShow',
            success : function(data) {
                console.log(data);

            },
            error : function(){
                console.log("error");
            }
        });
    });
});
</code></pre>

<p>HTML snippet of <code>index.html</code></p>

<pre><code>           &lt;div class="col_1_of_3 span_1_of_3"&gt;
           {% for product in products %}
                 &lt;div class="view view-first"&gt;
                      &lt;a href="{{product.link}}"&gt;
                       &lt;div class="inner_content clearfix"&gt;
                        &lt;div class="product_image"&gt;
                            &lt;img src="{{product.imageSrc}}" class="img-responsive" alt=""/&gt;
                            &lt;div class="product_container"&gt;
                               &lt;div class="cart-left"&gt;
                                 &lt;p class="title"&gt;{{product.name}}&lt;/p&gt;
                               &lt;/div&gt;
                               &lt;div class="price"&gt;{{product.price}}&lt;/div&gt;
                               &lt;div class="clearfix"&gt;&lt;/div&gt;
                             &lt;/div&gt;
                        &lt;/div&gt;
                       &lt;/div&gt;
                     &lt;/a&gt;
                   &lt;/div&gt;
            {% endfor %}
            &lt;/div&gt;
</code></pre>

<p><code>router</code></p>

<pre><code>app.get('/SearchShow', function(req, res){
    console.log(req.query);

    var cgid =  req.query.cgid;
    console.log("cgid: " + cgid);
    category.getProductsAssignedToCategory(cgid, function(productHits){
        res.send({
            "products" : productHits
        });
    });
});
</code></pre>

<p>On server side I use <code>res.render</code> to render the HTML but I couldn't find a way to update only a particular section of template via ajax &amp; using swig template engine</p>