mixhtml

REPLACE

Replace existing items

In this example, there are multiple items in the DOM with the class "item". Clicking on the "Replace items" button, will send a reques to the server. The response will contain the instruction to replace those items.

Note: The request send to the server doesn't influence this example. It can be any type of request. In this example, it is using a GET reques to an imaginary end-point called "test"

Item One
Item Two
Item Three

Request

    <button mix-get="test">
        Replace items
    </button>

Response

<browser mix-replace=".item">
    <div>New item</div>
</browser>

Replace existing items slowly

In this example, there are multiple items in the DOM with the class "item". Clicking on the "Replace items" button, will send a reques to the server. The response will contain the instruction to replace those items.

Note: The request send to the server doesn't influence this example. It can be any type of request. In this example, it is using a GET reques to an imaginary end-point called "test". The attribute mix-fade-2000 is used in the response, therefore the items are replaced slowly.

Item One
Item Two
Item Three

Request

    <button mix-get="test">
        Replace items
    </button>

Response

<browser mix-replace=".item">
    <div mix-fade-2000>New item</div>
</browser>