簡體   English   中英

如何獲取數據庫數據並顯示在儀表板中 jsp 文件的 div 標簽中?

[英]How can i take database data and show in div tags in jsp file in a dashboard?

I am trying to build the dashboard for a java web application for which I would want to retrieve data from the database and place it in div tag, in php its quite simple but in java and in jsp I am unsure how i could get the result我試圖得到。

我想要實現的一個例子是:

儀表板示例:

儀表板的代碼是:

<%@ 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>&nbsp;&nbsp; Welcome Nurse,<br>
             &nbsp;&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>

嘗試使用 Java 框架,如 Java Spring.. 來實現這一點!

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM