### Initialize Layui Form Module
Source: https://github.com/niezhiliang/netty-websocket-spring-boot/blob/master/netty-websocket-spring-boot-demo/src/main/resources/templates/admin.html
Initializes the Layui form module, making its functionalities available for use in the page. This is a common setup step for Layui components, typically executed when the DOM is ready.
```JavaScript
layui.use('form', function () { var form = layui.form; });
```
--------------------------------
### Send Message to All Users via AJAX
Source: https://github.com/niezhiliang/netty-websocket-spring-boot/blob/master/netty-websocket-spring-boot-demo/src/main/resources/templates/admin.html
This JavaScript function handles sending a message from the client to all connected users. It validates the message content (ensuring it's not empty) and sends it via an AJAX GET request to the '/sendAll' endpoint. The UI is updated to show the message was sent to all users upon successful transmission.
```JavaScript
function sendAll(){
var msg = $("#msg").val();
if(msg!=null && msg!=""){
$.ajax({
method: 'get',
url: '/sendAll',
data:{ msg:msg },
success:function(data) {
var content = $("#content").html();
$("#content").html(content+'
\n' +
'
'+'服务器推送 '+msg+' --> 所有用户'+ '
\n' +
'
\n' +
'
');
console.log(data);
}
});
}else{
alert("请填写要发送的内容");
}
}
```
--------------------------------
### Send Message to Selected Users via AJAX
Source: https://github.com/niezhiliang/netty-websocket-spring-boot/blob/master/netty-websocket-spring-boot-demo/src/main/resources/templates/admin.html
This JavaScript function handles sending a message from the client to specific users selected via checkboxes. It collects selected usernames, validates input (ensuring users are selected and message content exists), and sends the message via an AJAX GET request to the '/sendmsg' endpoint. It also updates the UI with the sent message or system prompts.
```JavaScript
function sendMsg(){
var user = "";
$("input[name='check']:checked").each(function(i){ // Corrected selector to target only checked checkboxes
user = user + $(this).attr("title") + ",";
});
console.log(user);
if (user.length > 0) {
user = user.substr(0, user.length - 1);
} else {
console.log("未选中发送人");
var content = $("#content").html();
$("#content").html(content+'\n' +
'
'+'系统提示:请在多选框中选择要发送的用户'+ '
\n' +
'
\n' +
'
');
return;
}
var msg = $("#msg").val();
if(msg!=null && msg!=""){
$.ajax({
method: 'get',
url: '/sendmsg',
data: { "username": user, "msg": msg },
success:function(data) {
var content = $("#content").html();
$("#content").html(content+'\n' +
'
'+'服务器推送 '+msg+' -->'+user+ '
\n' +
'
\n' +
'
');
console.log(data);
}
});
}else{
alert("请填写要发送的用户昵称或者发送内容");
}
}
```
--------------------------------
### Initiate WebSocket Connection on Page Load
Source: https://github.com/niezhiliang/netty-websocket-spring-boot/blob/master/netty-websocket-spring-boot-demo/src/main/resources/templates/admin.html
This line calls the 'connect()' function to immediately establish a WebSocket connection when the script is executed, typically upon page load, ensuring the client is ready to communicate with the server as soon as the page loads.
```JavaScript
connect()
```
--------------------------------
### Establish WebSocket Connection and Handle Events
Source: https://github.com/niezhiliang/netty-websocket-spring-boot/blob/master/netty-websocket-spring-boot-demo/src/main/resources/templates/admin.html
This JavaScript function establishes a WebSocket connection to the server at 'ws://127.0.0.1:8086/socketServer/niezhiliang9595'. It includes browser compatibility checks for WebSocket support and defines event handlers for 'onmessage' (receiving data), 'onclose' (connection closed), and 'onopen' (connection established) to update the UI and log connection status.
```JavaScript
function connect(){
if ('WebSocket' in window){
ws = new WebSocket("ws://127.0.0.1:8086/socketServer/niezhiliang9595");
} else if ('MozWebSocket' in window){
ws = new MozWebSocket("ws://127.0.0.1:8086/socketServer/niezhiliang9595");
} else{
alert("该浏览器不支持websocket");
}
ws.onmessage = function(evt) {
var content = $("#content").html();
$("#content").html(content+'\n' +
'
'+evt.data+ '
\n' +
'
\n' +
'
');
console.log(evt.data); // Corrected from console.log(msg)
};
ws.onclose = function(evt) {
console.log('连接关闭');
};
ws.onopen = function(evt) {
var content = $("#content").html();
$("#content").html(content+'\n' +
'
'+'服务器初始化成功...'+ '
\n' +
'
\n' +
'
');
console.log('连接成功');
};
}
```
=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.