Best way to create widget-like ajax page sections?

So, I have a page that is made up of 4 different AJAX containers (meaning they are populated with HTML via AJAX). I have an attachment section that refreshes the section whenever 开发者_如何学JAVAa new upload has been performed.

Currently I have a DIV that gets replaced with the content I want, then when I execute some kind of AJAX POST action, it returns with the updated HTML content. In one case, I have an AJAX section that includes an AJAX section that includes and AJAX section. It is a 'quote' screen with a 'location' section which populates with a page for each location attached to the quote...and each location has a 'line item' section that populates with a list of current line items assigned to that location. I have an AJAXform attached to each location that refreshes the line item list when an item is added. Also, I have a form attached to the quote page that refreshes the location list when a location is added.

<!-- Quote page -->
<div id="locations>
    <!-- AJAX page listing locations -->
</div>
<form id="ajax-form-for-adding-locations">
    <input id="location-name" type="text"/>
</form>

<!-- Location page -->
<div id="line items">
    <!-- AJAX page listing line items for this location -->
</div>
<form id="ajax-form-for-adding-line-items">
    <input id="item-name" type="text"/>
</form>

The nested AJAX sections seems a little excessive to me. Is there a better way to set this up?

The best, cleanest, most extensible and most future proof way to tackle this kind of one-page app design which is heavily based on ajax would be to use one of the javascript MVC libraries.

Personally I recommend you the backbonejs - it has a great community, is actively developed, lightweight and fast to learn enough to be able to build quality application in no time.

Check the website and look at the example apps using backbone, go through the short (but fully covering the code) documentation and have a look at the example todo app. You can also check the wiki page on github for even more resources and examples/tutorials

We are using it at our company after trying some other options before and we <3 it to the point that it's hard to believe!

Oh, and you mentioned in tags jquery - BackboneJS plays super nicely with jQuery (and CoffeeScript, and whatever else... it's pure love :) !)