samedi 28 avril 2018

Replace an image with Ajax on seaside

I have been working on Seaside 3.1 for a couple of days and I'm trying to design a simple TicTacToe with Ajax.

It works great without ajax with this code:

renderContentOn: html
html heading: 'Tictactoe'.
html
    form: [ 
        1 to: 3 do: [ :row | 
            1 to: 3 do: [ :col | 
                html imageButton
                    url: (tictactoe imageCase: row * 10 + col);
                    callback: [ tictactoe playsX: row playsY: col ] ].
            html break ] ]

and with ajax it doesn't work at all, though the page doesn't refresh as expected. The imageButton never changes for a simple image with another url.

The goal is just to swap the imageButton for an image with another url when I click on it.

Here's where I am with my code:

renderContentOn: html
html heading: 'Tictactoe'.
1 to: 3 do: [ :row | 
    1 to: 3 do: [ :col | 
        html imageButton
            url: (tictactoe imageCase: row * 10 + col);
            id: 'case' , row asString , col asString;
            onClick:
                    (html scriptaculous updater
                            id: 'case' , row asString , col asString;
                            callback: [ :r | 
                                        morpion playsX: row playsY: col.
                                        r render: (html image url: (tictactoe imageCase: row * 10 + col)) ];
                            return: false) ].
    html break ]

I am new and not very good with this technology, therefore I am ready to hear any answer, advice or guidance.

I would like to thank you in advance, have a good day.




Aucun commentaire:

Enregistrer un commentaire