Как я могу взять данные базы данных и отобразить в тегах div в файле jsp на панели мониторинга?

#java #mysql #jsp #web #glassfish

#java #mysql #jsp #веб #glassfish

Вопрос:

Я пытаюсь создать панель мониторинга для веб-приложения Java, для которого я хотел бы получить данные из базы данных и поместить их в тег div, в php это довольно просто, но в java и в jsp я не уверен, как я мог бы получить результат, который я пытаюсь получить.

Примером того, чего я пытаюсь достичь, является :

Пример панели мониторинга:

Код панели инструментов :

 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@page contentType="text/html"  pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Nurse Dashboard</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <script src="https://kit.fontawesome.com/0afbc9b86d.js" crossorigin="anonymous"></script>
        <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/styles.css" />
    </head>
     <body id="body">
    <div class="container">
      <nav class="navbar">
        <div class="nav_icon" onclick="toggleSidebar()">
          <i class="fa fa-bars" aria-hidden="true"></i>
        </div>
        <div class="navbar__left">
          
          <a class="active_link" href="#">Profile</a>
        </div>
        <div class="navbar__right">
          <a href="#">
            <i class="fa fa-search" aria-hidden="true"></i>
          </a>
          <a href="#">
            <i class="fa fa-clock-o" aria-hidden="true"></i>
          </a>
          <a href="#">
            <img width="30" src="assets/nurse.svg" alt="" />
            <!-- <i class="fa fa-user-circle-o" aria-hidden="true"></i> -->
          </a>
        </div>
      </nav>

      <main>
        <div class="main__container">
          <!-- MAIN TITLE STARTS HERE -->
          <div class="main__title">
            <img src="assets/sell.svg" alt="" />
            <div class="main__greeting">
              <h1>Hello! Have a nice day</h1>
              <p>Lets Get to work!</p>
            </div>
          </div>
         ***< The place i would want the results to be shown >***
          <!-- MAIN TITLE ENDS HERE -->
          <!-- MAIN CARDS STARTS HERE -->
          <div class="main__cards">
            <div class="card">
              <i>icon</i>
              <div  class="card_inner">
                  <p id="card_inner">
             </div>
            </div>
            <div class="card">
              
              <div class="card_inner">
                My man
              </div>
            </div>

            <div class="card">
              <i></i>YEllow
              <div class="card_inner">
                
              </div>
            </div>

            <div class="card">
              <i
                
              ></i>
                Kind
              <div class="card_inner">
                
              </div>
            </div>
          </div>
          <!-- MAIN CARDS ENDS HERE -->

          <!-- CHARTS STARTS HERE -->
          <div class="charts">
            <div class="charts__left">
              <div class="charts__left__title">
                <div>
                 kkkkk
                </div>
              
              </div>
              
            </div>

            <div class="charts__right">
              <div class="charts__right__title">
                <div>
                 kkk1
                </div>
              
              </div>

              <div class="charts__right__cards">
                <div class="card1">
               
                </div>

                <div class="card2">
                  
                </div>

                <div class="card3">
                  
                </div>

                <div class="card4">
                  
                </div>
              </div>
            </div>
          </div>
          <!-- CHARTS ENDS HERE -->
        </div>
      </main>

      <div id="sidebar">
        <div class="sidebar__title">
            <div class="sidebar__img">
              <img src="${pageContext.request.contextPath}/imgs/nurse.svg" style="border-radius: 50%;" alt="logo" />
              <h1>amp;nbsp;amp;nbsp; Welcome Nurse,<br>
             amp;nbsp;amp;nbsp; Nimesha
              </h1>
          </div>
          <i
            onclick="closeSidebar()"
            class="fa fa-times"
            id="sidebarIcon"
            aria-hidden="true"
          ></i>
        </div>
        <!--SIDE_BAR-->
        <div class="sidebar__menu">
          <div class="sidebar__link active_menu_link">
            <i class="fas fa-tachometer-alt"></i>
            <a href="<%=request.getContextPath()%>/NurseDashboard">Dashboard</a>
          </div>
          <div class="sidebar__link">
            <i class="fa fa-line-chart"></i>
            <a href="<%=request.getContextPath()%>/NurseDashboard/reportinfo">Patient Report</a>
          </div>
           <div class="sidebar__link">
            <i class="fa fa-flask"></i>
            <a href="<%=request.getContextPath()%>/NurseDashboard/labreports">Lab Report</a>
          </div>
           <div class="sidebar__link">
           <i class="fa fa-bed" aria-hidden="true"></i>
            <a href="<%=request.getContextPath()%>/NurseDashboard/Beds">Bed Management</a>
          </div>
          <div class="sidebar__logout">
            <i class="fa fa-power-off"></i>
            <a href="<%=request.getContextPath()%>/NurseDashboard/logout">Log out</a>
          </div>
        </div>
      </div>
    </div>
    <script src="${pageContext.request.contextPath}/js/script.js"></script> 
  </body>
</html>
 

Ответ №1:

Попробуйте использовать Java-фреймворки, такие как Java Spring.. для достижения этого!