now showing spa

spa/server.py

@@ -10,18 +10,18 @@ from flask import request
 
 app = Flask(__name__)
 
-@app.route('/traditional')
+@app.route('/traditional/')
 def traditional():
     contador = request.values.get('contador', 0)
     contador = int(contador) + 1
     return render_template('traditional.html',
                            contador=contador)
 
-@app.route('/spa')
+@app.route('/spa/')
 def spa():
-    return render_template('spa.html')
+    return render_template('spa.html', contador=1)
 
-@app.route('/spa/counter')
+@app.route('/spa/counter/')
 def spa_counter():
     contador = request.values.get('contador', 1)
     contador = int(contador) + 1

spa/templates/spa-counter.html

@@ -0,0 +1,15 @@
+<div class='row'>
+	<div class='small-12 columns'>
+		<p class='text-center'>
+			Contador: {{ contador }}
+		</p>
+	</div>
+
+	<div class='row'>
+		<div class='small-12 columns'>
+			<p class='text-center'>
+				<a id='contador' href='{{ url_for('spa_counter', contador=contador) }}' class='button radius small'>Incrementar</a>
+			</p>
+		</div>
+	</div>
+</div>

spa/templates/spa.html

@@ -0,0 +1,28 @@
+{% extends "base.html" %}
+
+{% block content %}
+	<div id='contador-part'>
+		{% include "spa-counter.html" ignore missing with context %}
+	</div>
+{% endblock content %}
+
+{% block scripts %}
+<script>
+	$(function() {
+		$('#contador-part').on('click', '#contador', function (ev) {
+			ev.preventDefault();
+			ev.stopPropagation();
+
+			console.log('click');
+			$.ajax({
+				url: $(this).attr('href'),
+				success: function (response) {
+					console.log(response);
+					$('#contador-part').html(response);
+					$('#contador')[0].click();
+				}
+			})
+		});
+	});
+</script>
+{% endblock scripts %}