basic_single_model.js

var newModel = (function(){
	var attributes = {}

	var state = {
		set: function(stateChange){
			attributes = $.extend({}, attributes, stateChange);
		},

		get: function(key) {
			return $.extend({}, attributes);
		},

		save: function(stateChange, callback) {
			this.set(stateChange)

			$.post(this.url, attributes, callback)
		},

		fetch: function(callback, options) {
			_this = this;
			return $.get(this.url, function(data){
				data = _this.parse(data);
				if (options.reset == true) {
					attributes = data;
				} else {
					attributes = $.extend({}, attributes, data)
				}
				callback(data)
			});
		},

		parse: function(data) {
			return data;
		}
		url: '/config'
	};

	return function newModel(){
		return state;
	}
})();

var saveInput = (function(masterState){
	return function saveInput(e){
		var field = $(e.currentTarget).attr('name')

		// name="key1[key2]" value=""
		var parts = field.match(/([^\[]+)\[([^\]]+)\]/)
		var key1 = parts[1], key2 = parts[2]

		stateChange = {}
		stateChange[key2] = $(e.currentTarget).value();

		masterState.save(stateChange,reportSucces);
	}
})(newModel());


function reportSucces(data) {
	console.log('great success', data);
}

$(document).on('change', 'input', saveInput);

less_basic_model

var ConfigVarState = Backbone.Model.extend({})

var ConfigView = Backbone.View.extend({
	events: {
		"change input": "handleInputChanged"
	},

	handleInputChanged: function(e){
		var field = $(e.currentTarget).attr('name')

		var parts = field.match(/([^\[]+)\[([^\]]+)\]/)
		var key1 = parts[1], key2 = parts[2]

		stateChange = {}
		stateChange[key2] = $(e.currentTarget).value();

		if(this.state.get(key1) === undefined) {
			this.state.set(key1, stateChange)
		} else {
			keyState = this.state.get(key1)
			_.extend(keyState, stateChange)
		}
	},
})


var Model = (function(){

	function Model(){
		this.attributes = {}
	}

	//private scope


	//public methods
	Model.prototype = $.extend({}, Model.prototype, {

		set: function(stateChange){
			attributes = $.extend({}, this.attributes, stateChange);
		},

		save: function(stateChange, callback) {
			this.set(stateChange)

			$.post(this.url, this.attributes, callback)
		},

		fetch: function(callback, options) {
			_this = this;
			$.get(this.url, function(data){
				data = _this.parse(data);
				if (options.reset == true) {
					_this.attributes = data;
				} else {
					_this.attributes = $.extend({}, _this.attributes, data)
				}
				callback(data)
			});
		},

		parse: function(data) {
			return data;
		}
		url: '/config'
	});

	return Model;
})();

new Model();