mirror of
https://github.com/bigskysoftware/htmx.git
synced 2025-09-30 22:41:23 +00:00
ca27475b7b
The stylesheet was preventing the "echo" test from working correctly. WS messages were sent/received correctly, but the results could not be displayed because the container size was too small. This patch allows the containers to grow, and display WS results correctly.
39 lines
1.2 KiB
HTML
39 lines
1.2 KiB
HTML
<h1>Echo Test</h1>
|
|
|
|
<div role="tablist" hx-target="#page" hx-push-url="false">
|
|
<a role="tab" hx-get="/ws-echo.html">Legacy Style</a>
|
|
<a role="tab" hx-get="/ws-echo-ext.html" aria-selected="true">New Style</a>
|
|
</div>
|
|
|
|
<h3>Description</h3>
|
|
<p>This test lets you send and receive data to and from the WebSocket server. Every message that you send to the server will be "echoed"
|
|
back to you in a separate message</p>
|
|
|
|
<h3>Example HTML</h3>
|
|
|
|
<pre class="code">
|
|
<div hx-ext="ws" ws-connect="ws://localhost/echo">
|
|
|
|
<form ws-send>
|
|
<input type="text" name="message" style="width:500px;" value="This Is The Message" />
|
|
<input type="submit"/>
|
|
</form>
|
|
|
|
<div id="idMessage"></div>
|
|
</div>
|
|
</pre>
|
|
|
|
<div class="elastic container" hx-ext="ws" ws-connect="ws://localhost/echo">
|
|
|
|
<form ws-send="">
|
|
<h3>Send a Message</h3>
|
|
<div>
|
|
<input type="text" name="message" style="width:500px;" value="This Is The Message" />
|
|
<input type="submit" value="Send" class="btn primary"/>
|
|
</div>
|
|
</form>
|
|
|
|
<br>
|
|
<h3>Receive a Message</h3>
|
|
<div id="idMessage"></div>
|
|
</div> |