You are viewing revision #3 of this wiki article.
This version may not be up to date with the latest version.
You may want to view the differences to the latest version.
I wanted to implement a widget that could refresh itself through Ajax without refreshing the whole page. CGridView and CListView are excellent examples of such widgets.
I spent some time trying to understand how a controller renders it’s view(s) and then looked at the actionAdmin and actionIndex actions of an app generated by gii. The views generated by these actions contain CGridView and CListView widgets respectively.
My case study was a simple Dashboard application, where I have two view – left and right in the same page (layout file). The sequence diagram outlines how these two pieces are rendered and how they’re merged with the layout file to generate a page the user will see. I came up with the sequence diagram below.
If the pieces appear unfamiliar to you, you might want to read – Rendering View Files in Yii here (if this link get’s deleted, google the title).
It might be worth mentioning that, the default implementation of the aforementioned widgets, requests the “owning” controller (the one that created the widget) to render it’s entire view again through an Ajax request. When a response arrives, the html response (page) is parsed using jQuery and the section (div) that the widget is interested in is extracted. The widget’s contents are then replaced with the extracted (partial contents) one.
In a typical application’s controller, where one might be displaying several models/views, it might make sense to write a controller that returns just the partially rendered view without any layout applied. This should cut down some time for you depending on how complex your views/models are. This approach, if thought out carefully should also maximize code sharing.
If I have provided inaccurate information, please feel free to comment and let me know.
Original Post
The original is post from http://geekjamboree.wordpress.com/2013/10/30/rendering-views-and-updating-them-with-ajax/ also by me.
nice summary
Nice summary, I think it's important for beginners to get a grasp how various components are coupled.
I think that in that graphic jQueryWidget should be between User and Browser and it's the User that calls the 'update' action by changing page, sorting or performing a search.
On second thought, I'd join the User and Browser into one. If an action is fired from the browser we can assume it was the user who called it. If you send the results to the browser and they are displayed we can assume the user can see them.
Suggestions incorporated
@nineinchnick thanks for your encouraging comments. I incorporated your suggestions and updated the diagram. However, I had to incorporate a faux step of invoking www.url.com from jQueryWidget to Browser as the tool I used doesn't otherwise allow me to move the objects.
Good Wiki
i think its a best way for beginners to learn the YII call structure .
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.