|
|
|
ปรึกษา เรื่อง modal edit และ delete กรณี edit และ delete ได้แค่ 10 แถวแรก แถวที่ 11 ไป edit และ delete ไม่ได้ครับ |
|
|
|
|
|
|
|
เช็คใน console.log แล้วนำ error มาโพสต์ด้วยครับ
|
|
|
|
|
Date :
2021-01-29 14:45:18 |
By :
lakornworld |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
งั้นก็ดู source การแสดงตาราง (สังเกตใน while ลูป) ได้จำกัด event ไว้แค่ 10 element หรือไม่
|
|
|
|
|
Date :
2021-01-29 15:12:20 |
By :
lakornworld |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ต้องดูส่วนที่แสดง template ครับ
|
ประวัติการแก้ไข 2021-01-29 18:41:38 2021-01-29 18:51:54
|
|
|
|
Date :
2021-01-29 18:27:53 |
By :
lakornworld |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ตอบความคิดเห็นที่ : 7 เขียนโดย : lakornworld เมื่อวันที่ 2021-01-29 21:38:38
รายละเอียดของการตอบ ::
หน้าที่แสดงตารางครับ ผมไม่รู้ว่าคุณเขียนไว้ในไฟล์ไหน (ใช่ modalmasterpc.php หรือไม่)
template ก็คือส่วนที่ generate html (ของตาราง) ออกมาแสดงยังหน้าเว็บไซต์
ตอบ หน้าที่แสดงตาราง ผมเขียนไว้ในไฟล์ modalmasterpc.php ครับ
code modalmasterpc.php
Code (PHP)
<?php
require_once('connection.php');
require_once('DataTables.php');
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Master Pc</title>
<link rel="stylesheet" href="bootstrap/bootstrap.css">
<!-- <link rel="stylesheet" type="text/css" href="stylesheet/styles.css"> -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
</head>
<body>
<!-- start style -->
<style>
body {
background-image: url('bg/bg.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
background-size: 100% 100%;
}
.container {
max-width: 1150px;
}
.copyright {
background-color: #1a252f;
/* height:50px; */
/* position:fixed;
left:0px;
bottom:0px; */
/* background-color:#000000; */
/* width:100%;
z-index: 99; */
/* color:#FFFFFF; */
}
</style>
<!-- start navbar -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark text-uppercase fixed-top">
<!-- <nav class="navbar navbar-expand-lg navbar-light bg-light text-uppercase fixed-top"> -->
<a class="fas fa-desktop fa-2x" href="#"></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="index.php">Computer Management System<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item ">
<a class="nav-link" href="dashboardcms.php">DashBoard</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="modalmasterpc.php">Master Pc</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="v_detail_pc.php">Detail Pc</a>
</li>
<li class="nav-item">
<a class="nav-link" href="v_monitor_pc.php">Monitor Pc</a>
</li>
</ul>
</div>
</nav>
<br>
<br>
<br>
<!-- start container -->
<div class="container">
<div class="row ">
<div class="col-lg-12">
<div class="col-md-9 col-lg-12 p-3 mb-2 bg-info text-white display text-uppercase " style="font-size: 15pt; font-family:Monospace;">Master PC</div>
<p>
<hr Width="100%" Align="Center" Size="5" Color="GAINSBORO">
<!-- <a href="add.php" class="btn btn-success mb-3 fas fa-plus-square"> Add Information</a> -->
<!-- Button trigger modal -->
<button type="button" class="btn btn-success mb-3 fas fa-plus-square" data-toggle="modal" data-target="#addModal">
Add Information
</button>
<!-- ========================================================================================================= -->
<!-- Modal add-->
<div class="modal fade" id="addModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">New Information</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form action="insertadd.php" method="POST">
<div class="modal-body">
<div class="form-group text-left">
<div class="row">
<label for="station" class="col-sm-3 control-label">Station ::</label>
<div class="col-sm-9">
<input type="text" name="txt_station" autocomplete="off" class="form-control" placeholder="Enter Station Number..." pattern="[0-9]{1,}" title="กรอกตัวเลขเท่านั้น" required>
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="com_name" class="col-sm-3 control-label">Com_name ::</label>
<div class="col-sm-9">
<input type="text" name="txt_com_name" autocomplete="off" class="form-control" placeholder="Enter Com_name...">
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="processorid" class="col-sm-3 control-label">Processorid ::</label>
<div class="col-sm-9">
<input type="text" name="txt_processorid" autocomplete="off" class="form-control" placeholder="Enter Processorid...">
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="location" class="col-sm-3 control-label">Location ::</label>
<div class="col-sm-9">
<select type="text" name="txt_location" autocomplete="off" class="form-control" placeholder="Enter Location...">
<option value="">Enter Location...</option>
<option value="CP3">CP3</option>
<option value="Tara park">Tara park</option>
<option value="WFH">WFH</option>
</select>
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="team" class="col-sm-3 control-label">Team ::</label>
<div class="col-sm-9">
<select type="text" name="txt_team" autocomplete="off" class="form-control" placeholder="Enter Team...">
<option value="">Enter Team...</option>
<option value="OPT1">OPT1</option>
<option value="OPT2">OPT2</option>
<option value="OPT3">OPT3</option>
<option value="SUPPORT">SUPPORT</option>
<option value="SHARE">SHARE</option>
</select>
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="asset" class="col-sm-3 control-label">Asset ::</label>
<div class="col-sm-9">
<input type="text" name="txt_asset" autocomplete="off" class="form-control" placeholder="Enter Asset Number..." pattern="[0-9]{1,}" title="กรอกตัวเลขเท่านั้น" required>
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="serial" class="col-sm-3 control-label">Serial ::</label>
<div class="col-sm-9">
<input type="text" name="txt_serial" autocomplete="off" class="form-control" placeholder="Enter Serial...">
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="type" class="col-sm-3 control-label">Type ::</label>
<div class="col-sm-9">
<select type="text" name="txt_type" autocomplete="off" class="form-control" placeholder="Enter Type...">
<option value="">Enter Type...</option>
<option value="Pc Gosoft">Pc Gosoft</option>
<option value="Pc Cpall">Pc Cpall</option>
<option value="All in one">All in one</option>
<option value="Notebook Gosoft">Notebook Gosoft</option>
<option value="Notebook Cpall">Notebook Cpall</option>
</select>
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="lan_port" class="col-sm-3 control-label">Lan port ::</label>
<div class="col-sm-9">
<input type="text" name="txt_lan_port" autocomplete="off" class="form-control" placeholder="Enter Lan port...">
</div>
</div>
</div>
<!-- <div class="form-group text-center">
<div class="col-md-12 mt-3">
<input type="submit" name="btn_insert" class="btn btn-primary" value="Insert">
<a href="master_pc.php" class="btn btn-danger">Cancel</a>
</div>
</div> -->
</div>
<div class="modal-footer ">
<button type="submit" name="btn_insert" class="btn btn-primary">Insert</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
</div>
</form>
</div>
</div>
</div>
<!-- ========================================================================================================= -->
<!-- Modal Edit -->
<div class="modal fade" id="editModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Edit Information</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form action="EditUpdate.php" method="POST">
<div class="modal-body">
<input type="hidden" name="update_no" id="update_no"></input>
<div class="form-group text-left">
<div class="row">
<label for="station" class="col-sm-3 control-label">Station ::</label>
<div class="col-sm-9">
<input type="text" name="txt_station" id="txt_station" autocomplete="off" class="form-control" placeholder="Enter Station Number..." pattern="[0-9]{1,}" title="กรอกตัวเลขเท่านั้น" required>
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="com_name" class="col-sm-3 control-label">Com_name ::</label>
<div class="col-sm-9">
<input type="text" name="txt_com_name" id="txt_com_name" autocomplete="off" class="form-control" placeholder="Enter Com_name...">
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="processorid" class="col-sm-3 control-label">Processorid ::</label>
<div class="col-sm-9">
<input type="text" name="txt_processorid" id="txt_processorid" autocomplete="off" class="form-control" placeholder="Enter Processorid...">
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="location" class="col-sm-3 control-label">Location ::</label>
<div class="col-sm-9">
<select type="text" name="txt_location" id="txt_location" autocomplete="off" class="form-control" placeholder="Enter Location...">
<option value="">Enter Location...</option>
<option value="CP3">CP3</option>
<option value="Tara park">Tara park</option>
<option value="WFH">WFH</option>
</select>
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="team" class="col-sm-3 control-label">Team ::</label>
<div class="col-sm-9">
<select type="text" name="txt_team" id="txt_team" autocomplete="off" class="form-control" placeholder="Enter Team...">
<option value="">Enter Team...</option>
<option value="OPT1">OPT1</option>
<option value="OPT2">OPT2</option>
<option value="OPT3">OPT3</option>
<option value="SUPPORT">SUPPORT</option>
<option value="SHARE">SHARE</option>
</select>
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="asset" class="col-sm-3 control-label">Asset ::</label>
<div class="col-sm-9">
<input type="text" name="txt_asset" id="txt_asset" autocomplete="off" class="form-control" placeholder="Enter Asset Number..." pattern="[0-9]{1,}" title="กรอกตัวเลขเท่านั้น" required>
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="serial" class="col-sm-3 control-label">Serial ::</label>
<div class="col-sm-9">
<input type="text" name="txt_serial" id="txt_serial" autocomplete="off" class="form-control" placeholder="Enter Serial...">
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="type" class="col-sm-3 control-label">Type ::</label>
<div class="col-sm-9">
<select type="text" name="txt_type" id="txt_type" autocomplete="off" class="form-control" placeholder="Enter Type...">
<option value="">Enter Type...</option>
<option value="Pc Gosoft">Pc Gosoft</option>
<option value="Pc Cpall">Pc Cpall</option>
<option value="All in one">All in one</option>
<option value="Notebook Gosoft">Notebook Gosoft</option>
<option value="Notebook Cpall">Notebook Cpall</option>
</select>
</div>
</div>
</div>
<div class="form-group text-left">
<div class="row">
<label for="lan_port" class="col-sm-3 control-label">Lan port ::</label>
<div class="col-sm-9">
<input type="text" name="txt_lan_port" id="txt_lan_port" autocomplete="off" class="form-control" placeholder="Enter Lan port...">
</div>
</div>
</div>
</div>
<div class="modal-footer ">
<button type="submit" name="btn_update" class="btn btn-primary">Update</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
</div>
</form>
</div>
</div>
</div>
<!-- ========================================================================================================= -->
<!-- Modal Delete -->
<div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Delete Information</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form action="delete.php" method="POST">
<div class="modal-body">
<input type="hidden" name="delete_no" id="delete_no"></input>
<h4>คุณต้องการลบข้อมูล ใช่ หรือ ไม่?</h4>
</div>
<div class="modal-footer ">
<button type="submit" name="btn_delete" class="btn btn-primary">Yes</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">No</button>
</div>
</form>
</div>
</div>
</div>
<!-- ========================================================================================================= -->
<table bgcolor="white" id="example" class="table table-striped table-bordered table-hover
table-responsive text-center" style="font-size:8pt;">
<thead class="thead-dark">
<tr>
<th class='no-sort d-none '>NO</th>
<th class='no-sort'>STATION</th>
<th class='no-sort'>COM_NAME</th>
<th class='no-sort'>PROCESSORID</th>
<th class='no-sort'>LOCATION</th>
<th class='no-sort'>TEAM</th>
<th class='no-sort'>UNIXTIME</th>
<th class='no-sort'>ASSET</th>
<th class='no-sort'>SERIAL</th>
<th class='no-sort'>TYPE</th>
<th class='no-sort'>LAN_PORT</th>
<th class='no-sort'>ACTION</th>
<!-- <th>DELETE</th> -->
</tr>
<!-- style = "display:none;" -->
<tr id="filters">
<th class='no-sort d-none '></th>
<th class='no-sort'></th>
<th class='no-sort'></th>
<th class='no-sort'></th>
<th class='no-sort'></th>
<th class='no-sort'></th>
<th class='no-sort'></th>
<th class='no-sort'></th>
<th class='no-sort'></th>
<th class='no-sort'></th>
<th class='no-sort'></th>
<th class='no-sort'></th>
</tr>
</thead>
<tbody>
<?php
$sql1 = "SELECT no,station,com_name,processorid,location,team,from_unixtime(unixTime,'%d/%m/%Y %h:%i:%s') as unixtime,asset,serial,type,lan_port
FROM master_pc order by station;";
$result1 = $mysqli->query($sql1);
while ($row = $result1->fetch_array(MYSQLI_ASSOC)) {
?>
<tr style="font-size:7pt;">
<td class="d-none text-left"><?php echo $row["no"]; ?></td>
<td class="text-left"><?php echo $row["station"]; ?></td>
<td class="text-left"><?php echo $row["com_name"]; ?></td>
<td class="text-left"><?php echo $row["processorid"]; ?></td>
<td class="text-left"><?php echo $row["location"]; ?></td>
<td class="text-left"><?php echo $row["team"]; ?></td>
<td class="text-left"><?php echo $row["unixtime"]; ?></td>
<td class="text-left"><?php echo $row["asset"]; ?></td>
<td class="text-left"><?php echo $row["serial"]; ?></td>
<td class="text-left"><?php echo $row["type"]; ?></td>
<td class="text-left"><?php echo $row["lan_port"]; ?></td>
<td>
<button type="button" class="btn btn-primary fas fa-edit fa-1x"></button>
<br></br>
<button type="button" class="btn btn-danger fas fa-trash fa-1x"></button>
</td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
</div>
<br>
<br>
<!-- <footer id="sticky-footer" class="py-4 bg-dark text-white-50">
<div class="container text-center">
<small>Copyright © Your Website Computer Management Gosoft Contact Center</small>
</div>
</footer> -->
<!-- Copyright Section -->
<div class="copyright py-4 text-center text-white">
<div class="container"><small>Copyright © Your Website Computer Management Gosoft Contact Center</small></div>
</div>
<!-- <script src="js/slim.js"></script> -->
<script src="js/popper.js"></script>
<script src="js/bootstrap.js"></script>
<!-- Scrip edit -->
<script>
$(document).ready(function() {
$('.fas.fa-edit').on('click', function() {
$('#editModal').modal('show');
$tr = $(this).closest('tr');
var data = $tr.children("td").map(function() {
return $(this).text();
}).get();
console.log(data);
$('#update_no').val(data[0]);
$('#txt_station').val(data[1]);
$('#txt_com_name').val(data[2]);
$('#txt_processorid').val(data[3]);
$('#txt_location').val(data[4]);
$('#txt_team').val(data[5]);
$('#txt_unixtime').val(data[6]);
$('#txt_asset').val(data[7]);
$('#txt_serial').val(data[8]);
$('#txt_type').val(data[9]);
$('#txt_lan_port').val(data[10]);
});
});
</script>
<!-- Script Delete -->
<script>
$(document).ready(function() {
$('.fas.fa-trash').on('click', function() {
$('#deleteModal').modal('show');
$tr = $(this).closest('tr');
var data = $tr.children("td").map(function() {
return $(this).text();
}).get();
console.log(data);
$('#delete_no').val(data[0]);
});
});
</script>
</body>
</html>
|
ประวัติการแก้ไข 2021-02-01 09:39:05 2021-02-01 09:40:50
|
|
|
|
Date :
2021-02-01 08:53:56 |
By :
chawa-2011 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
https://jsfiddle.net/w8n9pcq1/
ลองดูมันก็จับค่าในตารางมายัดใส่ฟอร์มได้.
ที่ว่าไม่ได้ มันไม่ได้ยังไง?
กด edit แล้ว modal ไม่ขึ้น
หรือว่า modal ขึ้น แต่ฟอร์มไม่มีข้อมูลมาแสดง
หรือว่า modal ขึ้น ฟอร์มแสดง แต่บันทึกแล้วไม่มีการอัพเดท
เวลาถามอะไรต้องบอกให้ละเอียดด้วย ไม่ใช่เข้าใจเองอยู่คนเดียว เพราะที่เห็นมันมีหลายขั้นตอน ไม่รู้ว่าไม่ได้ตรงไหนกันแน่
แล้วการดัก event ใน js ปกติเขาจะไม่ใช้ class หรือ id ที่ทางพวก vendor/third party เขาจัดมาให้ อย่างเช่น Bootstrap, FontAwesome ที่ใช้ class fa fas far faxxx ทั้งหลายโดย FontAwesome หรือ btn btn-xxx โดย Bootstrap อะไรอย่างนี้
ควรกำหนด class ที่มีชื่อเฉพาะตัวขึ้นมาเอง เช่น button-command-edit หรือ button-command-delete แบบนี้
เหตุผลเพราะชื่อที่ทางผู้อื่นเขากำหนดมา วันหนึ่งมันจะเปลี่ยน แล้วถ้าเราต้องอัพเดทตาม แล้วลืม มันจะพังทั้งหมด!
แต่ถ้าใช้ที่กำหนดเอง เราก็ไม่ต้องไปยุ่งกับมันอีก เวลาอัพเดทก็แค่อัพเดทตามที่เขาเปลี่ยนไป ที่เรากำหนดก็ทิ้งเอาไว้อย่างนั้น มันง่ายกว่า
edit:------------------------
เห็นว่าใช้ datatable.js
ไม่แน่ใจว่า limit การแสดงผลในตารางหรือเปล่าหรือใช้การแบ่งหน้าวิธีไหนยังไง ถ้าเป็น ajax การดัก event ก็ต้องเปลี่ยน
เพราะการดักแบบ $('ปุ่ม').on('click'); แบบนี้ มันจะจับเฉพาะที่มีการแสดงผลไปแล้ว คือโหลดเรียบร้อยแล้วนั่นเอง
แต่ถ้าใช้ ajax เปลี่ยนหน้าแสดงข้อมูลในตาราง พวกข้อมูลในตารางมันเปลี่ยน มันก็จะไม่ไปจับเอาข้อมูลใหม่ที่ขึ้นมา
ดังนั้นให้ใช้ js event delegation. เพราะมันจะจับเอาเหตุการแบบกว้างๆก่อน แล้วค่อยกรองภายหลังว่าจับเอาที่ตรงไหนบ้าง.
ตัวอย่างกับ jQuery
Code (JavaScript)
$('.list-items-table').on('click', '.edit-command', function(event) {
let tr = $(this).closest('tr');
let data = tr.children('td').map(function() {
return $(this).text();
}).get();
console.log(data);
$('#editing-id').val(data[0]);
$('#editing-name').val(data[1]);
});
https://jsfiddle.net/23bdkpam/
|
ประวัติการแก้ไข 2021-02-01 11:50:09 2021-02-01 11:50:35 2021-02-01 11:56:24
|
|
|
|
Date :
2021-02-01 11:48:27 |
By :
mr.v |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$(document).ready(function() {
$('#example').on('click','fas.fa-edit',function() {
$('#editModal').modal('show');
$tr = $(this).closest('tr');
var data = $tr.children("td").map(function() {
return $(this).text();
}).get();
console.log(data);
$('#update_no').val(data[0]);
$('#txt_station').val(data[1]);
$('#txt_com_name').val(data[2]);
$('#txt_processorid').val(data[3]);
$('#txt_location').val(data[4]);
$('#txt_team').val(data[5]);
$('#txt_unixtime').val(data[6]);
$('#txt_asset').val(data[7]);
$('#txt_serial').val(data[8]);
$('#txt_type').val(data[9]);
$('#txt_lan_port').val(data[10]);
});
});
|
|
|
|
|
Date :
2021-02-01 12:37:00 |
By :
test |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$(document).ready(function() {
$('#example').on('click','.fas.fa-edit',function() {
$('#editModal').modal('show');
$tr = $(this).closest('tr');
var data = $tr.children("td").map(function() {
return $(this).text();
}).get();
console.log(data);
$('#update_no').val(data[0]);
$('#txt_station').val(data[1]);
$('#txt_com_name').val(data[2]);
$('#txt_processorid').val(data[3]);
$('#txt_location').val(data[4]);
$('#txt_team').val(data[5]);
$('#txt_unixtime').val(data[6]);
$('#txt_asset').val(data[7]);
$('#txt_serial').val(data[8]);
$('#txt_type').val(data[9]);
$('#txt_lan_port').val(data[10]);
});
});
|
|
|
|
|
Date :
2021-02-01 12:38:25 |
By :
test |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ผมตอบไปแล้ว event delegation ดูคำตอบที่ผมแก้ไขไปก่อนหน้านี้
|
|
|
|
|
Date :
2021-02-01 13:05:58 |
By :
mr.v |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Load balance : Server 01
|