amiceli/index.html

## index.html
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Update part view backbone</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>

    <div id="my-view">

    </div>

    <script id="my-view-template" type="text/template">
        <h2 id="name-part">
            Name : <%= name %>
        </h2>
        <h3 id="counter">
            1
        </h3>
        <br>
        <form id="my-form">
            <input type="text" id="name" value="<%= name %>" />
            <button id="update" type="button">
                Update
            </button>
        </form>
    </script>

    <!--<script src="bower_components/jquery/dist/jquery.min.js"></script>-->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>
    <!--<script src="bower_components/underscore/underscore-min.js"></script>-->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
    <!--<script src="bower_components/backbone/backbone-min.js"></script>-->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.2.3/backbone-min.js"></script>

    <script src="main.js"></script>
</body>
</html>

## main.js
$(document).ready(function () {

    var MyModel = Backbone.Model.extend({
        defaults: {
            name : ''
        }
    });

    var MyView = Backbone.View.extend({

        events: {
            'click #update' : 'updateName'
        },

        updateName : function() {
            var name = this.$el.find('input').val();
            this.model.set('name', name);

            var compiler = this.template(this.model.toJSON());
            var elements = $('<div>' + compiler + '</div>');
            var found = $('h2', elements);

            this.$el.find('h2').html( found.html() );
        },

        initialize:function() {
            _.bindAll(this, 'template', 'updateName');
        },

        template : _.template($("#my-view-template").html()),

        render: function(){
            this.$el.html( this.template(this.model.toJSON()));

            var interval = setInterval(_.bind(function() {
                var i = parseInt(this.$el.find('#counter').html());

                this.$el.find('#counter').html(i + 1);
            }, this), 1000);
        }
    });

    var view = new MyView({
        el: $("#my-view"),
        model : new MyModel({
            name : 'toni'
        })
    });

    view.render();

});

## styles.css
html, body {
  margin : 0;
  padding: 0;
  width  : 100%;
  height : 100%;
}

#my-view {
  padding: 50px 10px;
  width: 300px;
  background: #eee;
  margin: 50px auto;
  text-align: center;
}
	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Update part view backbone</title>
	<link rel="stylesheet" href="styles.css">
	</head>
	<body>

	<div id="my-view">

	</div>

	<script id="my-view-template" type="text/template">
	<h2 id="name-part">
	Name : <%= name %>
	</h2>
	<h3 id="counter">
	1
	</h3>
	<br>
	<form id="my-form">
	<input type="text" id="name" value="<%= name %>" />
	<button id="update" type="button">
	Update
	</button>
	</form>
	</script>

	<!--<script src="bower_components/jquery/dist/jquery.min.js"></script>-->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>
	<!--<script src="bower_components/underscore/underscore-min.js"></script>-->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
	<!--<script src="bower_components/backbone/backbone-min.js"></script>-->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.2.3/backbone-min.js"></script>

	<script src="main.js"></script>
	</body>
	</html>
	$(document).ready(function () {

	var MyModel = Backbone.Model.extend({
	defaults: {
	name : ''
	}
	});

	var MyView = Backbone.View.extend({

	events: {
	'click #update' : 'updateName'
	},

	updateName : function() {
	var name = this.$el.find('input').val();
	this.model.set('name', name);

	var compiler = this.template(this.model.toJSON());
	var elements = $('<div>' + compiler + '</div>');
	var found = $('h2', elements);

	this.$el.find('h2').html( found.html() );
	},

	initialize:function() {
	_.bindAll(this, 'template', 'updateName');
	},

	template : _.template($("#my-view-template").html()),

	render: function(){
	this.$el.html( this.template(this.model.toJSON()));

	var interval = setInterval(_.bind(function() {
	var i = parseInt(this.$el.find('#counter').html());

	this.$el.find('#counter').html(i + 1);
	}, this), 1000);
	}
	});

	var view = new MyView({
	el: $("#my-view"),
	model : new MyModel({
	name : 'toni'
	})
	});

	view.render();

	});
	html, body {
	margin : 0;
	padding: 0;
	width : 100%;
	height : 100%;
	}

	#my-view {
	padding: 50px 10px;
	width: 300px;
	background: #eee;
	margin: 50px auto;
	text-align: center;
	}