I tweaked the zone updater get what I want. Finally it works :) This particular page is VERY hard to implement. It may look east but once you put your fingers on your keyboard, you start scratching your head again :D
Thigo also kindly sent some assisting information regarding that matter: "Just put zone="someValidZoneId" (so Tapestry sets up the zone update JavaScript code) and then use the some custom JavaScript to update the zones. http://stackoverflow.com/questions/1026162/refreshing-a-tapestry-zone-on-a-regular-basis has some example code, just ignore the "periodical" part. Server-side, return a MultiZoneUpdate (replaced in 5.3 by a service) in the event handler method. ;) I hope this helps . . ." But the zone updated suited my situation most. It probably can use some cleanup but here is how my zone updater looks like at the moment: ZoneUpdater = Class.create({ initialize : function(spec) { this.element = $(spec.elementId); this.url = spec.url; this.preUpdate = window[spec.preUpdate]; this.domain = spec.domain; this.range = spec.range; this.direction = spec.direction; $T(this.element).zoneId = spec.zone; if (spec.event) { this.event = spec.event; this.element.observe(this.event, this.updateZone.bindAsEventListener(this)); } }, updateZone : function() { var p = { domain : this.domain, range : this.range, direction : this.direction, nodId : this.element.value }; var td; if (this.direction == "from") { for ( var i = 1; i <= this.range; i++) { td = $$('td[row="' + i + '"][col="' + this.domain + '"]')[0]; td.writeAttribute('to', this.element.value); } } else if (this.direction == "to") { for ( var i = 1; i <= this.range; i++) { td = $$('td[row="' + this.domain + '"][col="' + i + '"]')[0]; td.writeAttribute('from', this.element.value); } } this.preUpdate.call(p); var zoneManager = Tapestry.findZoneManager(this.element); if (!zoneManager) { return; } var updatedUrl = this.url; if (this.element.value) { var param = this.element.value; if (param) { updatedUrl = addRequestParameter('param', param, updatedUrl); for ( var i = 1; i <= this.range; i++) { if (this.direction == "from") { td = $$('td[row="' + i + '"][col="' + this.domain + '"]')[0]; updatedUrl = addRequestParameter('row', i, updatedUrl); updatedUrl = addRequestParameter('col', this.domain, updatedUrl); updatedUrl = addRequestParameter('nod', td.readAttribute('from'), updatedUrl); } else if (this.direction == "to") { td = $$('td[row="' + this.domain + '"][col="' + i + '"]')[0]; updatedUrl = addRequestParameter('row', this.domain, updatedUrl); updatedUrl = addRequestParameter('col', i, updatedUrl); updatedUrl = addRequestParameter('nod', td.readAttribute('to'), updatedUrl); } zoneManager.updateFromURL(updatedUrl); updatedUrl = addRequestParameter('param', param, this.url); } } } } }) I had to collect each cell's info to update accordingly..finally it works now..only the final touches left. Finally I can move forward with my conversion...seriously guys, is there a better framework that tapestry :D Thank you Taha and Thiago for your prompt responses :) On Tue, Sep 6, 2011 at 1:49 AM, Taha Hafeez <tawus.tapes...@gmail.com> wrote: > Hi Muhammad > > You can use ZoneUpdater for that. > > http://tinybits.blogspot.com/2010/03/new-and-better-zoneupdater.html > > So in your select you will have > > <select t:type='select' t:mixins='zoneupdater' t:zone='whatever_zone' > t:event='updateColumn' t:context='widthIndex' > t:clientEvent='onchange'/> > > and > > <select t:type='select' t:mixins='zoneupdater' t:zone='whatever_zone' > t:event='updateRow' t:context='heightIndex' t:clientEvent='onchange'/> > > > Object onColumnUpdate(int widthIndex){ > ... > > return columnZone.getBody(); > } > > Object onRowUpdate(int heightIndex){ > return rowZone.getBody(); > } > > > On Mon, Sep 5, 2011 at 11:32 PM, Muhammad Gelbana <m.gelb...@gmail.com> wrote: >> Hi All, >> >> I've been trying to do this for some time now but nothing worked. I searched >> through this list and I still can't figure it out !! >> >> Here is my case, I draw a table using dimensions provided in the page >> activation context. So I can't predict how many rows or columns I may have. >> Each header in the columns have a select field and so does each row at it's >> left most cell. >> Each select field should update the whole row or column, depending on which >> select field had it's value changed. >> >> I attached an image explaning more what I need to do and here is a portion >> of my page's tml file to elaborate more. The "???" are just to not that I >> need the select to update zones but I just don't know what to put here ! >> >> <t:form> >> <div style="overflow: auto;"> >> <table class="contentpane skyTable" width="100%" cellspacing="0" >> cellpadding="0" border="0" align="center"> >> <tr> >> <td bgcolor="lightgray"/> >> <td t:type="loop" t:source="1 .. width" >> t:value="widthIndex"> >> ${widthIndex} - <t:select t:id="toNode" >> model="toProbesModel" zone="???"/> >> </td> >> </tr> >> <tr t:type="loop" t:source="1 .. height" t:value="heightIndex"> >> <td>${heightIndex} - <t:select t:id="fromNode" >> model="fromProbesModel" zone="???"/></td> >> <t:loop t:source="1 .. width" t:value="widthIndex"> >> <td row="${heightIndex}" col="${widthIndex}" from="" >> to="" style="background-color: #BDBDBD;"> >> <t:zone id="${widthIndex}-${heightIndex}"> >> N/A >> </t:zone> >> </td> >> </t:loop> >> </tr> >> </table> >> </div> >> </t:form> >> >> The whole idea is to add more info to the XHR request, this will most >> probably aid to fix my problem. >> >> If this is kinda not possible at the moment. May be someone can help me to >> request fragments of pages to load in these using prototype ajax calls >> rather that using tapestry's capabilities although I'd hate that !! I wanna >> be good using tapestry :) >> >> Also I need to modify the cells being updated "style" attribute to add an >> image as it's background and remote that attribute when a cell is fully >> updated. Just to show a loader gif. >> >> I already have this working using servlets but I'd LOVE to use tapestry >> instead :) >> >> -- >> Regards, >> Muhammad Gelbana >> Java Developer >> >> >> --------------------------------------------------------------------- >> To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org >> For additional commands, e-mail: users-h...@tapestry.apache.org >> > > > > -- > Regards > > Taha Hafeez Siddiqi (tawus) > http://tawus.wordpress.com > > --------------------------------------------------------------------- > To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org > For additional commands, e-mail: users-h...@tapestry.apache.org > > -- Regards, Muhammad Gelbana Java Developer --------------------------------------------------------------------- To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org For additional commands, e-mail: users-h...@tapestry.apache.org
