cayasso/toolbar.html

## toolbar.html
<html>

<head>
<script>

// Assuming this is the namespace root for myatc
var myatc = {};

// then somewhere global
myatc.saveCar = function () {
	// call the jsFunction
	jsfMyAtcSaveCar();
}

myatc.carAdded = function () {
	// code to anounce that car was added
	alert('a new car was just added, please do what you need');
}

// on document ready
$(function(){

	// Bind to the DOM the save car custom event
	$(document).on('saveCar', myatc.saveCar);

	// Register click event
	$('.save-car').on('click', function () {

		// Here we trigger the custom event save car
		$(document).trigger('saveCar');
	});

});

</script>

</head>

<body>

<!-- THE HTML -->

<!-- Assuming this is the user action link to save the car-->
<a href="#" class="save-car">Save this car</a>

<!-- This is the jsFunction for saving a car -->
<a4j:jsFunction name="jsfMyAtcSaveCar" reRender="savedCars" onComplete="myatc.carAdded">

<div id="savedCars">
<!-- This will be re-rendered after jsFunction finish its thing -->
</div>

</body>

</html>
	<html>

	<head>
	<script>

	// Assuming this is the namespace root for myatc
	var myatc = {};

	// then somewhere global
	myatc.saveCar = function () {
	// call the jsFunction
	jsfMyAtcSaveCar();
	}

	myatc.carAdded = function () {
	// code to anounce that car was added
	alert('a new car was just added, please do what you need');
	}

	// on document ready
	$(function(){

	// Bind to the DOM the save car custom event
	$(document).on('saveCar', myatc.saveCar);

	// Register click event
	$('.save-car').on('click', function () {

	// Here we trigger the custom event save car
	$(document).trigger('saveCar');
	});

	});

	</script>

	</head>

	<body>

	<!-- THE HTML -->

	<!-- Assuming this is the user action link to save the car-->
	<a href="#" class="save-car">Save this car</a>

	<!-- This is the jsFunction for saving a car -->
	<a4j:jsFunction name="jsfMyAtcSaveCar" reRender="savedCars" onComplete="myatc.carAdded">

	<div id="savedCars">
	<!-- This will be re-rendered after jsFunction finish its thing -->
	</div>

	</body>

	</html>