[Seaside] updating the contents of a div as a side effect of a liveCallback..

Thu Feb 1 06:54:20 UTC 2007

Rick Flower a écrit :
> Rick Flower wrote:
>> Michel Bany wrote:
>>>
>>>> ... Seaside is complaining (likely because it's not allowed).. 
>>> Can you be more specific ?
>>> Are you able to create a small example that produce the Seaside 
>>> complaint ?
>>
>> Michel -- It might be something I'm doing wrong, but I thought I saw 
>> test code in the Async package that is more or less doing what I'm 
>> doing.. I've got a submit button with the liveCallback (the new stuff 
>> that you added the other day) that looks like the following :
>>
>> html div id: #blah with: [ html submitButton liveCallback: [:r | self 
>> renderCartContents: self on: r]; text: 'Add to Cart'].
>>
>> Down in >>renderCartContents I've got the following :
>>
>> >>renderCartContents: dummy on: html
>> html text: 'blah'
>>
>> When it comes time to do the liveCallback (by pressing the submit 
>> button), I get the follow dialog box from Seaside :
>>
>> No replacement and no script evaluated, probable bug in your callback 
>> code.
>>
>> See below the response produced by the callback code.
>>
>> <?xml version="1.0" encoding="utf-8"?><body>blah</body>
> Ok.. I changed my test code in the liveCallback from that shown above 
> to the following and my problems disappeared.. It must be my 
> misunderstanding of ST I guess..
>
> liveCallback: [:h | h span id: #cart_contents; with: [self 
> renderCartContents: self on: h ]];
>
> I guess it needs to write into a span...
Now I see what's wrong.

SeasideAsync identifies the is only capable of updating the page,
it does not add to it. You should look a bit closer at the test code
in #renderButtonOn:. You will see that the span area with id
'timestamp-button' is defined in the regular rendering code
and updated by thelive callback.

For updating a particular area of the page you need to designate
what element in the page is to be updated using the id attribute.
renderCartContents: dummy on: html
    html div id: #cart; class: #cart; with: [ ... ].

You also need a place holder with the same id so that SeasideAsync
knows what area of the page will be updated. The place holder may
be completely empty, it may show some initial value or it may be hidden.
    html submitButton liveCallback: [:r | self renderCartContents: self 
on: r]; text: 'Add to Cart'].
    ...
    html div id: #cart; with: String new.
or
    html div id: #cart; with: 'Your cart is empty'.
or
    html div id: #cart; class: #hidden; with: 'Place holder for the cart'.

HTH
Michel.