I am trying to create a CRUD with JPA. Both the insert new record and delete record work. But once I go to update, which is the line ctrl.edit(cats) it returns error: org.apache.jasper.JasperException: java.lang.NullPointerException
Could someone please review my code and advise if there is something I am missing? I have created entities and controllers with JPA.
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<%#page import="entities.Categories"%>
<%#page import="controller.CategoriesJpaController"%>
<%#page import="java.util.List"%>
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>CATEGORIAS</title>
<script>
function cargar(id,nom,des)
{
document.modalito.txtcatid.value = id;
document.modalito.txtcatname.value = nom;
document.modalito.txtcatdes.value = des;
}
</script>
</head>
<body>
<%
HttpSession sesion = request.getSession();
//validar que solo si hay sesion activa pueda entrar
//la unica sesion es usuario y nivel
if(sesion.getAttribute("usuario")==null && sesion.getAttribute("nivel")==null)
{
response.sendRedirect("../login/index_login.jsp");
}
if(sesion.getAttribute("usuario")!=null && sesion.getAttribute("nivel")!=null)
{
String useruser = sesion.getAttribute("usuario").toString();
String nivel = sesion.getAttribute("nivel").toString();
%>
<nav class="navbar navbar-expand navbar-dark bg-dark static-top">
<hr>
<p style="color:white; font-size: 20px;"> Bienvenido <%=useruser%> (Nivel: <%=nivel%>) | <a style="color:white;" href="${pageContext.request.contextPath}/index.jsp"> | Home | </a></p>
<hr>
</nav>
<%
}
response.setHeader("Pragma","no-cache");
response.setHeader("Cache-Control", "no-cache, no-store, must-revalidate");
response.setDateHeader ("Expires", 0);
%>
<br><br>
<h3 align="center">Formulario Categorias</h3>
<hr>
<button style="margin-left: 45%;" type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#miModal">
Ingresar Nuevo
</button>
<br><br>
<pre align="center">CONTENIDO DE LA TABLA PRODUCTOS</pre>
<br>
<%
List <Categories> ls;
CategoriesJpaController ctrl = new CategoriesJpaController();
Categories cats = new Categories();
ls = ctrl.findCategoriesEntities();
if(request.getParameter("btnGuardar")!=null || request.getParameter("btnMod")!=null || request.getParameter("btnEliminar")!=null)
{
//guardar en un objeto producto lo del form
cats.setCategoryID(Integer.parseInt(request.getParameter("txtcatid")));
cats.setCategoryName(request.getParameter("txtcatname"));
cats.setDescription(request.getParameter("txtcatdes"));
}
if(request.getParameter("btnGuardar")!=null)
{
ctrl.create(cats);
out.print("<script>alert('Exito al insertar');window.location.href = 'vCategoria.jsp';</script>");
ls=ctrl.findCategoriesEntities();
}
else if(request.getParameter("btnMod")!=null)
{
ctrl.edit(cats);
out.print("<script>alert('Exito al modificar');window.location.href = 'vCategoria.jsp';</script>");
ls=ctrl.findCategoriesEntities();
}
else if(request.getParameter("btnEliminar")!=null)
{
ctrl.destroy(cats.getCategoryID());
out.print("<script>alert('Exito al eliminar');window.location.href = 'vCategoria.jsp';</script>");
ls=ctrl.findCategoriesEntities();
}
%>
<div style="width: 700px; position: relative; margin-left: 27%;">
<table border="1" class="table">
<thead class="thead-dark">
<tr>
<th class="text-center">ID CATEGORIA</th>
<th class="text-center">NOMBRE CATEGORIA</th>
<th class="text-center">DESCRIPCIÓN</th>
</tr>
</thead>
<tbody>
<%
for(Categories c : ls)
{
%>
<tr>
<td class="text-center"><%= c.getCategoryID()%>
<a href="javascript:cargar('<%= c.getCategoryID() %>','<%= c.getCategoryName()%>','<%= c.getDescription() %>')">
<img src="../recursos/editar.jpg" width="25px" height="25px" data-toggle="modal" data-target="#miModal">
</a>
</td>
<td class="text-center"><%= c.getCategoryName() %></td>
<td class="text-center"><%= c.getDescription() %></td>
</tr>
<%
}
%>
</tbody>
</table>
</div>
</body>
<!--Este es el formulario modal-->
<div class="modal fade" id="miModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">Formulario de Registro</h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="form-group">
<form action="vCategoria.jsp" method="POST" name="modalito">
<input type="text" name="txtcatid" placeholder="ID Categoria" class="form-control" /><br>
<input type="text" name="txtcatname" placeholder="Nombre Categoria" class="form-control" /><br>
<input type="text" name="txtcatdes" placeholder="Descripción" class="form-control" /><br>
<input type="submit" name="btnGuardar" class="btn btn-primary" value="Guardar"/>
<input type="submit" name="btnMod" class="btn btn-info" value="Modificar"/>
<input type="submit" name="btnEliminar" class="btn btn-danger" value="Eliminar"/>
<input type="hidden" value="nuevo" name="opcion" /><br>
</form>
</div>
</div>
</div>
</div>
</div>
<!--Hasta aquí el modal-->
</body>
Sorry, in order to post as Resolved, I found the answer here: es.stackoverflow.com/a/104830 it is in Spanish but it did help.
I simply initiated my OneToMany List on my Entity in question and that resolved it.
#OneToMany(mappedBy = "categoryID") private List<Products> productsList = new
ArrayList<Products>
Related
I'm trying to set boxes' elements copied from medicineBox's values like below. Can anyone help me in this. I need to post medicineOrder model to the controller
<tr th:each="medicineBox : ${medicine.medicineBoxes}">
<td class="text-center">
<input type="text" th:field="*{boxes[__${medicineBoxStat.index}__].boxNumber}" th:value="${medicineBox.box.number}" />
</td>
<td class="text-center" th:text="${medicineBox.medicineCount}"></td>
<td><input type="number" th:field="*{boxes[__${medicineBoxStat.index}__].medicineCount}" class="form-control" /></td>
</tr>
I'm using two object here -
medicine and medicineOrder
------------------> Controller method to get the page
#GetMapping("/{medicineId}")
public String loadMedicineDetailPage(#PathVariable("medicineId") long medicineId, Model model) {
model.addAttribute("medicine", service.getMedicineById(medicineId));
model.addAttribute("medicineOrder", new MedicineOrder());
return WebPages.MEDICINE_DETAIL.toString();
}
------------------> thymeleaf html page
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="ISO-8859-1"/>
<link href="https://cdn.jsdelivr.net/npm/bootstrap#5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<title>Spring Boot Application</title>
</head>
<body>
<div class="container">
<br/>
<a class="btn btn-primary" th:href="#{/mvc/medicine/list}">Back</a>
<br/>
<br/>
<h3 class="text-center alert alert-success">Medicine Details</h3>
<form class="row g-3" action="#" th:action="#{/mvc/medicine/sell}" method="post" th:object="${medicineOrder}">
<div class="col-md-6 col-xs-12 col-sm-12">
<label for="name" class="form-label">Name</label>
<input type="text" style="background-color:#95edea" disabled class="form-control" id="name" th:field="${medicine.name}"/>
</div>
<div class="col-md-6 col-xs-12 col-sm-12">
<label for="company" class="form-label">Company</label>
<input type="text" disabled class="form-control" id="company" th:field="${medicine.companyStringName}"/>
</div>
<div class="col-md-6 col-xs-12 col-sm-12">
<label for="price" class="form-label">Price</label>
<input type="text" disabled class="form-control" id="price" th:field="${medicine.price}"/>
</div>
<!--<div class="col-md-6 col-xs-12 col-sm-12">
<label for="count" class="form-label">Count</label>
<input type="text" class="form-control" id="count" th:field="${medicine.count}"/>
</div>-->
<div class="col-md-6 col-xs-12 col-sm-12">
<label for="volume" class="form-label">ML</label>
<input type="text" disabled class="form-control" id="volume" th:field="${medicine.volume}"/>
</div>
<div class="col-md-6 col-xs-12 col-sm-12">
<label for="purchaseDate" class="form-label">Date Purchased</label>
<input type="text" disabled class="form-control" id="purchaseDate" th:field="${medicine.purchaseDate}"/>
</div>
<!--<div class="col-md-6 col-xs-12 col-sm-12">
<label for="boxNo" class="form-label">Box Number</label>
<input type="text" class="form-control" id="boxNo" th:field="${medicine.boxNumber}"/>
</div>-->
**<input type="hidden" th:field="*{medicineId}" th:value="${medicine.medicineId}"/>**
<table class="table table-bordered">
<tr class="table-primary">
<td>Box Number</td>
<td>Medicine Count</td>
<td>Sell Count</td>
</tr>
<tr th:each="medicineBox : ${medicine.medicineBoxes}">
<td class="text-center">
**<input type="text" th:field="*{boxes[__${medicineBoxStat.index}__].boxNumber}" th:value="${medicineBox.box.number}"** />
</td>
<td class="text-center" th:text="${medicineBox.medicineCount}"></td>
<td><input type="number" th:field="*{boxes[__${medicineBoxStat.index}__].medicineCount}" class="form-control" /></td>
</tr>
</table>
<button class="btn btn-primary" type="submit">Sell</button>
</form>
</div>
</body>
</html>
---------------> Controller method to handle the post request
#PostMapping("/sell")
public String sellMedicine(#ModelAttribute MedicineOrder medicineOrder, BindingResult bindingResult) {
if(bindingResult.hasErrors()){
// error handling
}
service.sellMedicine(medicineOrder);
return "redirect:/mvc/medicine/list";
}
----------------> Class MedicineOrder
package com.example.demo.dto;
import com.example.demo.model.Box;
import java.util.ArrayList;
import java.util.List;
public class MedicineOrder {
private long medicineId;
private List<OrderedBox> boxes = new ArrayList<>();
public long getMedicineId() {
return medicineId;
}
public void setMedicineId(long medicineId) {
this.medicineId = medicineId;
}
public List<OrderedBox> getBoxes() {
return boxes;
}
public void setBoxes(List<OrderedBox> boxes) {
this.boxes = boxes;
}
#Override
public String toString() {
return "MedicineOrder{" +
"medicineId=" + medicineId +
", boxes=" + boxes +
'}';
}
}
package com.example.demo.dto;
public class OrderedBox {
private String boxNumber;
private int medicineCount;
public String getBoxNumber() {
return boxNumber;
}
public void setBoxNumber(String boxNumber) {
this.boxNumber = boxNumber;
}
public int getMedicineCount() {
return medicineCount;
}
public void setMedicineCount(int medicineCount) {
this.medicineCount = medicineCount;
}
#Override
public String toString() {
return "OrderedBox{" +
"boxNumber='" + boxNumber + '\'' +
", medicineCount=" + medicineCount +
'}';
}
}
Not able to get the MedicineOrder.medicineId and medicineBorder.boxes[*].boxNumber from template to model object.
After lot of searching I didn't find any answer which is solving the issue only using thymeleaf.
To solve this issue I had to add two hidden input field for medicineId and boxNumber on medicineOrder object and populate those input field using javascript as below. Anyway if anyone find the solution by only using thymeleaf, please let me know.
Populated those fields using javascript
<script>
function function__02__number__assignment(_element){
var __element = _element.children[0];
var __tElement1 = __element.children[0];
var __tElement2 = __element.children[1];
// Copy value from 2 to 1
__tElement1.value = __tElement2.value;
}
function function__01__box_traverse(){
var rootElement = document.getElementsByClassName('box-stock-details');
for(var __i=0 ; __i < rootElement.length ; __i++) {
function__02__number__assignment(rootElement[__i]);
}
function_01_01_medicineId();
return true;
}
function function_01_01_medicineId(){
var _00_1_id_src = document.getElementById('00-1-id-src');
var _00_1_id_dest = document.getElementById('00-1-id-dest');
_00_1_id_dest.value = _00_1_id_src.value;
}
</script>
updated template file
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="ISO-8859-1"/>
<link href="https://cdn.jsdelivr.net/npm/bootstrap#5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<title>Spring Boot Application</title>
</head>
<body>
<div class="container">
<br/>
<a class="btn btn-primary" th:href="#{/mvc/medicine/list}">Back</a>
<br/>
<br/>
<h3 class="text-center alert alert-success">Medicine Details</h3>
<form class="row g-3" action="#" th:action="#{/mvc/medicine/sell}" method="post" th:object="${medicineOrder}">
<div class="col-md-6 col-xs-12 col-sm-12">
<label for="name" class="form-label">Name</label>
<input type="text" style="background-color:#95edea" disabled class="form-control" id="name" th:field="${medicine.name}"/>
</div>
<div class="col-md-6 col-xs-12 col-sm-12">
<label for="company" class="form-label">Company</label>
<input type="text" disabled class="form-control" id="company" th:field="${medicine.companyStringName}"/>
</div>
<div class="col-md-6 col-xs-12 col-sm-12">
<label for="price" class="form-label">Price</label>
<input type="text" disabled class="form-control" id="price" th:field="${medicine.price}"/>
</div>
<!--<div class="col-md-6 col-xs-12 col-sm-12">
<label for="count" class="form-label">Count</label>
<input type="text" class="form-control" id="count" th:field="${medicine.count}"/>
</div>-->
<div class="col-md-6 col-xs-12 col-sm-12">
<label for="volume" class="form-label">ML</label>
<input type="text" disabled class="form-control" id="volume" th:field="${medicine.volume}"/>
</div>
<div class="col-md-6 col-xs-12 col-sm-12">
<label for="purchaseDate" class="form-label">Date Purchased</label>
<input type="text" disabled class="form-control" id="purchaseDate" th:field="${medicine.purchaseDate}"/>
</div>
<!--<div class="col-md-6 col-xs-12 col-sm-12">
<label for="boxNo" class="form-label">Box Number</label>
<input type="text" class="form-control" id="boxNo" th:field="${medicine.boxNumber}"/>
</div>-->
<!-- Hidden input to get the value of medicineId from Medicine object -->
<input id="00-1-id-src" type="hidden" th:value="${medicine.medicineId}"/>
<!-- Hidden input to set the medicineId on MedicineOrder object -->
<input id="00-1-id-dest" type="hidden" th:field="*{medicineId}" />
<table class="table table-bordered">
<tr class="table-primary">
<td>Box Number</td>
<td>Medicine Count</td>
<td>Sell Count</td>
</tr>
<tr class="box-stock-details" th:each="medicineBox : ${medicine.medicineBoxes}">
<td class="text-center">
<input hidden th:field="*{boxes[__${medicineBoxStat.index}__].boxNumber}" />
<input disabled class="form-control" type="text" th:value="${medicineBox.box.number}" />
</td>
<td class="text-center" th:text="${medicineBox.medicineCount}"></td>
<td><input type="number" th:field="*{boxes[__${medicineBoxStat.index}__].medicineCount}" class="form-control" /></td>
</tr>
</table>
<button class="btn btn-primary" type="submit" onclick="return function__01__box_traverse()">Sell</button>
</form>
</div>
</body>
<script>
function function__02__number__assignment(_element){
var __element = _element.children[0];
var __tElement1 = __element.children[0];
var __tElement2 = __element.children[1];
// Copy value from 2 to 1
__tElement1.value = __tElement2.value;
}
function function__01__box_traverse(){
var rootElement = document.getElementsByClassName('box-stock-details');
for(var __i=0 ; __i < rootElement.length ; __i++) {
function__02__number__assignment(rootElement[__i]);
}
function_01_01_medicineId();
return true;
}
function function_01_01_medicineId(){
var _00_1_id_src = document.getElementById('00-1-id-src');
var _00_1_id_dest = document.getElementById('00-1-id-dest');
_00_1_id_dest.value = _00_1_id_src.value;
}
</script>
</html>
My Connection String
Class.forName("com.mysql.jdbc.Driver");
conn= DriverManager.getConnection("jdbc:mysql://localhost:3306/exam_system?useSSL=false&useUnicode=true&characterEncoding=utf8","root","Password");
My JSP File
<%#page import="java.util.ArrayList"%>
<jsp:useBean id="pDAO" class="myPackage.DatabaseClass" scope="page"/>
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="style-backend.css">
<link rel="stylesheet" type="text/css" href="style.css">
<meta charset="utf-8" >
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<label Style="color: black"> ছন্দে</label>
<input type="hidden" name="pgprt" value="4">
<select name="coursename" class="text">
<%
ArrayList list1=pDAO.getAllCourses();
for(int i=0;i<list1.size();i=i+2){
%>
<option value="<%=list1.get(i)%>"><%=list1.get(i)%></option>
<%
}
%>
</select>
<input type="submit" value="Show" class="form-button">
</form>
</div>
<div class="panel form-style-6" style="max-width: 420!important;float: right">
<form action="controller.jsp" >
<div class="title">Add New Question</div>
<table Style="color: black;font-color: black">
<tr>
<td><label Style="color: black">Course Name</label></td>
<td colspan="3">
<select name="coursename" class="text">
<%
ArrayList list=pDAO.getAllCourses();
for(int i=0;i<list.size();i=i+2){
%>
<option value="<%=list.get(i)%>"><%=list.get(i)%></option>
<%
} request.setCharacterEncoding("UTF-8");
%>
</select>
</td>
</tr>
<tr>
<td><label Style="color: black">Your Question:</label></td>
<td colspan="4"><input type="text" name="question" class="text" placeholder="Type your question here" style="width: 420px;" ></td><br>
</tr>
<tr>
<td><label Style="color: black">Options</label></td>
<td><input type="text" name="opt1" class="text" placeholder="First Option" style="width: 130px;" ></td>
<td><input type="text" name="opt2" class="text" placeholder="Second Option" style="width: 130px;" ></td>
<td><input type="text" name="opt3" class="text" placeholder="Third Option" style="width: 130px;" ></td>
<td><input type="text" name="opt4" class="text" placeholder="Fourth Option" style="width: 130px;" ></td>
</tr>
<tr>
<td><label>Correct Answer</label></td>
<td colspan="4"><center><input type="text" name="correct" class="text" placeholder="Correct Answer" style="width: 130px;" ></center></td>
<tr>
<td colspan="5"><input type="hidden" name="page" value="questions">
<input type="hidden" name="operation" value="addnew">
<center><input type="submit" class="form-button" value="Add" name="submit"></center></td>
When Inputting Non-English Data It is Not Inserting Correctly in MySQL Database. But
I changed Database Pattern And Test By Passing Non-English Data In String And It Works Perfectly.
INSERT INTO `exam_system`.`contact`
(`Name`,
`Email`,
`Message`)
VALUES
('<{Name:fsfsd }>',
'<{Email:sdfsdf }>',
'<{Message: 1. চর্যাপদ কোন ছন্দে লেখা? }');
Before Answering I tried
Net Bean Font Change
Tried Change String Data To Byte
And Rest
Change Are in the symbol Code.
When Accepting Parameter or User Value Convert That Value Into Char .
String crr=request.getParameter("correct");
byte[] bytesCrr = crr.getBytes(StandardCharsets.ISO_8859_1);
crr = new String(bytesCrr, StandardCharsets.UTF_8);
In my application built on Java, JSP with BootStrap, and Servlet, there is the issue to send the data from Servlet to BootStrap Modal.
Based on my project, a user clicks the 'check button' in each table container and that table_id is caught in javascript and send it to Servlet with that value. Then Servlet operates on grabbing the data from the database based on its table_id. The result(orders in the code and results are displayed properly when printing out them) of the operation needed to send to the BootStrap modal section.
TableMonitor.jsp
<%# page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="/docs/4.0/assets/img/favicons/favicon.ico">
<title>Migarock Table Monitoring System</title>
<link rel="canonical"
href="https://getbootstrap.com/docs/4.0/examples/pricing/">
<!-- Bootstrap core CSS -->
<link href="../../dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="pricing.css" rel="stylesheet">
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
crossorigin="anonymous">
<link href="./css/tableMonitor.css" rel="stylesheet">
<%# taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
</head>
<body>
<!--
<div class="d-flex flex-column flex-md-row align-items-center p-3 px-md-4 mb-3 bg-white border-bottom box-shadow">
<h3 class="my-0 mr-md-auto font-weight-normal">Migarock Table Monitoring System</h3>
<a class="btn btn-outline-primary" href="#">Lock</a>
</div> -->
<div class="row">
<div class="col-2">
<div class="container">
<div class="card-deck mb-3 text-center ">
<div class="card mb-4 box-shadow ">
<div class="card-header status1">
<h3 class="my-0 font-weight-normal ">
<strong>Table_01</strong>
</h3>
</div>
<div class="card-body">
<a class="btn btn-outline-primary btn-lg btn-block mx-1 mt-1"
data-toggle="modal" href="#tableModal" data-table-id="1">Check</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-2">
<div class="container">
<div class="card-deck mb-3 text-center">
<div class="card mb-4 box-shadow">
<div class="card-header">
<h3 class="my-0 font-weight-normal">
<strong>Table_02</strong>
</h3>
</div>
<div class="card-body">
<a class="btn btn-outline-primary btn-lg btn-block mx-1 mt-1"
data-toggle="modal" href="#tableModal" data-table-id="2">Check</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-2">
<div class="container">
<div class="card-deck mb-3 text-center">
<div class="card mb-4 box-shadow">
<div class="card-header status2">
<h3 class="my-0 font-weight-normal">
<strong>Table_03</strong>
</h3>
</div>
<div class="card-body">
<a class="btn btn-outline-primary btn-lg btn-block mx-1 mt-1"
data-toggle="modal" href="#tableModal" data-table-id="3">Check</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-2">
<div class="container">
<div class="card-deck mb-3 text-center">
<div class="card mb-4 box-shadow">
<div class="card-header">
<h3 class="my-0 font-weight-normal">
<strong>Table_04</strong>
</h3>
</div>
<div class="card-body">
<a class="btn btn-outline-primary btn-lg btn-block mx-1 mt-1"
data-toggle="modal" href="#tableModal" data-table-id="4">Check</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-2">
<div class="container">
<div class="card-deck mb-3 text-center">
<div class="card mb-4 box-shadow">
<div class="card-header">
<h3 class="my-0 font-weight-normal">
<strong>Table_05</strong>
</h3>
</div>
<div class="card-body">
<a class="btn btn-outline-primary btn-lg btn-block mx-1 mt-1"
data-toggle="modal" href="#tableModal" data-table-id="5">Check</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-2">
<div class="container">
<div class="card-deck mb-3 text-center">
<div class="card mb-4 box-shadow ">
<div class="card-header status3">
<h3 class="my-0 font-weight-normal">
<strong>Table_06</strong>
</h3>
</div>
<div class="card-body">
<a class="btn btn-outline-primary btn-lg btn-block mx-1 mt-1"
data-toggle="modal" href="#tableModal" data-table-id="6">Check</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="tableModal" tabindex="1" role="dialog"
aria-labelledby="modal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h2 class="modal-title" id="modal">Table Status</h2>
<button type="button" class="close" data-dismiss="modal"
aria-label="close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="controlBar">
<div class="row">
<div class="col-8" style="text-align: left;">
<button type="button" class="btn btn-outline-success btn-lg"
data-dismiss="modal">Add item</button>
<button type="button" class="btn btn-outline-secondary btn-lg"
data-dismiss="modal">Change Status</button>
</div>
<div class="col-4" style="text-align: right; padding-right: 10%;">
<button type="button" class="btn btn-outline-warning btn-lg"
data-dismiss="modal">Help</button>
<button type="button" class="btn btn-outline-info btn-lg"
data-dismiss="modal">Bill</button>
</div>
</div>
<div>
<div class="modal-body">
<h3>My name is ${test}</h3>
<!-- <form action="./evaluationRegisterAction.jsp" method="post"> -->
<div class="scrollbar scrollbar-primary">
<!-- <div> -->
<table class="table">
<thead>
<tr style="text-align: center;">
<th scope="col"><input type="checkbox"
class="select-all checkbox" name="select-all" /></th>
<th scope="col">OrderTime</th>
<th scope="col">Item</th>
<th scope="col">QTY</th>
<th scope="col">Price</th>
<th scope="col">Status</th>
</tr>
</thead>
<tbody>
<c:out value="${requestScope.orders}">
<c:forEach items="${orders}" var="order">
<tr style="text-align: center;">
<td style="text-align: center;">
<div class="form-check">
<input type="checkbox" class="select-item checkbox"
name="select-item">
</div>
</td>
<td><span id="orders"></span> ${order.getTimeStamp()}</td>
<td>{order.getOrderItem()}</td>
<td>{order.getOrderQty()}</td>
<td>{order.getOrderPrice()}</td>
<td>{order.getOrderStatus()}</td>
<td><a class="btn btn-light btn-sm mx-1 mt-2"
data-toggle="modal" href="#changeStatus">Ordered</a> <!-- <a class="btn btn-dark btn-sm mx-1 mt-2" data-toggle="modal"
href="#changeStatus">Delivered</a> -->
</td>
</tr>
</c:forEach>
</c:out>
</tbody>
</table>
</div>
</div>
<div>
<table class="table">
<tr style="text-align: center;">
<td colspan="3">
<h4>Total</h4>
</td>
<td colspan="3">
<h4>(total)</h4>
</td>
</tr>
</table>
</div>
<div class="controlBar">
<div class="row">
<div class="col-6" style="text-align: left;">
<button type="button" class="btn btn-danger btn-lg"
data-dismiss="modal">Close Session</button>
</div>
<div class="col-6"
style="text-align: right; padding-right: 10%;">
<button type="button" class="btn btn-outline-danger btn-lg"
data-dismiss="modal">Close Window</button>
</div>
</div>
</div>
</div>
<!-- </form> -->
</div>
</div>
</div>
</div>
<footer class="pt-4 my-md-5 pt-md-5 border-top"> </footer>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
crossorigin="anonymous"></script>
<script>
window.jQuery
|| document
.write('<script src="../../assets/js/vendor/jquery-slim.min.js"><\/script>')
</script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
crossorigin="anonymous"></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
crossorigin="anonymous"></script>
<script>
Holder.addTheme('thumb', {
bg : '#55595c',
fg : '#eceeef',
text : 'Thumbnail'
});
</script>
<script>
$(function() {
//button select all or cancel
$("#select-all").click(function() {
var all = $("input.select-all")[0];
all.checked = !all.checked
var checked = all.checked;
$("input.select-item").each(function(index, item) {
item.checked = checked;
});
});
//button select invert
$("#select-invert").click(function() {
$("input.select-item").each(function(index, item) {
item.checked = !item.checked;
});
checkSelected();
});
//button get selected info
$("#selected").click(
function() {
var items = [];
$("input.select-item:checked:checked").each(
function(index, item) {
items[index] = item.value;
});
if (items.length < 1) {
alert("no selected items!!!");
} else {
var values = items.join(',');
console.log(values);
var html = $("<div></div>");
html.html("selected:" + values);
html.appendTo("body");
}
});
//column checkbox select all or cancel
$("input.select-all").click(function() {
var checked = this.checked;
$("input.select-item").each(function(index, item) {
item.checked = checked;
});
});
//check selected items
$("input.select-item").click(function() {
var checked = this.checked;
console.log(checked);
checkSelected();
});
//check is all selected
function checkSelected() {
var all = $("input.select-all")[0];
var total = $("input.select-item").length;
var len = $("input.select-item:checked:checked").length;
console.log("total:" + total);
console.log("len:" + len);
all.checked = len === total;
}
});
$('#tableModal')
.on(
'show.bs.modal',
function(e) {
var tableID = $(e.relatedTarget).data('table-id');
console.log("test: ", tableID)
$(e.currentTarget).find('input[name="tableID"]')
.val(tableID);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// Typical action to be performed when the document is ready:
document.getElementById("response").value = xhttp.responseText;
}
};
xhttp.open("POST", "TableMonitor", true);
xhttp.setRequestHeader("Content-type",
"application/x-www-form-urlencoded");
xhttp.send("tableId=" + tableID);
var orders = $(this).data('orders');
$('#orders').html(orders);
});
</script>
</body>
</html>
TableMonitor.java(Servlet)
package servlets;
import java.io.IOException;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.Iterator;
import java.util.List;
import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import brokers.TableBrokder;
import model.Order;
/**
* Servlet implementation class TableMonitor
*/
#WebServlet("/TableMonitor")
public class TableMonitor extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* #see HttpServlet#HttpServlet()
*/
public TableMonitor() {
super();
// TODO Auto-generated constructor stub
}
/**
* #see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
* response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
getServletContext().getRequestDispatcher("/TableMonitor.jsp").forward(request, response);
}
/**
* #see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
* response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String table_id = request.getParameter("tableId");
String action = request.getParameter("action");
System.out.println("servlet: " + table_id);
List<Order> orders = null;
TableBrokder tb = new TableBrokder();
try {
orders = tb.getOrderAll(Integer.parseInt(table_id));
} catch (NumberFormatException | SQLException e) {
e.printStackTrace();
}
for (int i = 0; i < orders.size(); i++) {
orders.get(i).toString();
}
// response.sendRedirect("TableMonitor");
RequestDispatcher dispatcher = request.getRequestDispatcher("/TableMonitor.jsp");
request.setAttribute("orders", orders);
request.setAttribute("test", "test");
dispatcher.forward(request, response);
}
}
Even though I google it but didn't get clear answers. Could you help me with this issue?
Looks like you are making an ajax call in your js but in your servlet you are not returning the response. I highly recommend checking out this answer on how to make ajax calls with servlets.
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String table_id = request.getParameter("tableId");
String action = request.getParameter("action");
System.out.println("servlet: " + table_id);
List<Order> orders = null;
TableBrokder tb = new TableBrokder();
try {
orders = tb.getOrderAll(Integer.parseInt(table_id));
} catch (NumberFormatException | SQLException e) {
e.printStackTrace();
}
for (int i = 0; i < orders.size(); i++) {
orders.get(i).toString();
}
//convert your list of orders to json
String json = new Gson().toJson(orders);
//add json to response
response.setContentType("application/json");
response.setCharacterEncoding("UTF-8");
response.getWriter().write(json);
}
When you make ajax calls you won't be able to do things like this:
request.setAttribute("orders", orders);
request.setAttribute("test", "test");
Because when you call this servlet url through ajax, you are not loading the jsp page again so the HttpServletRequest won't be passed to the jsp page. Hope this helps understand it some more.
The main functioning of my project to give privileges to the user to modify the event he want to.
so first page is modify-event.jsp where he will get the list of events present in the system with modify button at the end column
modify-event.jsp
<%#page import="java.util.ArrayList"%>
<jsp:include page="includes/header.jsp" />
<div>
<%#page import="java.sql.DriverManager"%>
<%#page import="java.sql.ResultSet"%>
<%#page import="java.sql.Statement"%>
<%#page import="java.sql.Connection"%>
<%
HttpSession session1 = request.getSession();
//String id = request.getParameter("userId");
String driverName = "com.mysql.jdbc.Driver";
String connectionUrl = "jdbc:mysql://localhost:3306/";
String dbName = "technovision";
String userId = "root";
String password = "root";
try {
Class.forName(driverName);
} catch (ClassNotFoundException e) {
e.printStackTrace();
}
Connection connection = null;
Statement statement = null;
ResultSet resultSet = null;
%>
<h2 align="center"><font><strong>Retrieve data from database in jsp</strong></font></h2>
<table align="center" cellpadding="5" cellspacing="5" border="1">
<tr>
</tr>
<tr bgcolor="#A52A2A">
<td><b>Event name</b></td>
<td><b>Registration Amount</b></td>
<td><b>EventHead name</b></td>
<td><b>EventHead contact</b></td>
<td><b>Event Description</b></td>
<td><b>Action</b></td>
</tr>
<%
try{
connection = DriverManager.getConnection(connectionUrl+dbName, userId, password);
statement=connection.createStatement();
String sql ="SELECT * FROM events";
resultSet = statement.executeQuery(sql);
while(resultSet.next()){
session1.setAttribute("eventid",resultSet.getString(1));
session1.setAttribute("eventname",resultSet.getString(2));
session1.setAttribute("registrationamount",resultSet.getString(3));
session1.setAttribute("eventheadname",resultSet.getString(4));
session1.setAttribute("eventheadcontact",resultSet.getString(5));
session1.setAttribute("eventdescription",resultSet.getString(6));
//ArrayList a = new ArrayList();
//a.add(resultSet.getString(1));
//a.add(resultSet.getString(2));
//a.add(resultSet.getString(3));
//a.add(resultSet.getString(4));
//a.add(resultSet.getString(5));
//a.add(resultSet.getString(6));
%>
<tr bgcolor="#DEB887">
<td><%=resultSet.getString("event_name") %></td>
<td><%=resultSet.getString("registration_amount") %></td>
<td><%=resultSet.getString("eventhead_name") %></td>
<td><%=resultSet.getString("eventhead_contact") %></td>
<td><%=resultSet.getString("event_description") %></td>
<td>Modify</td>
</tr>
<%
}
} catch (Exception e) {
e.printStackTrace();
}
%>
</table>
</div>
<%# include file="includes/footer.jsp" %>
<%#include file="includes/scripts.jsp" %>
</body>
</html>
Now when user clicks on any of the modify button he should redirect to the page which will fetch the clicked event details so that he can edit the same, but the case here is its opening the last data from that table above in modify-event.jsp because i made use of httpsession but i guess in the wrong way.
so when user clicks on modify button i redirected him to page name modify-page.jsp
modify-page.jsp
<%#page import="java.util.ArrayList"%>
<jsp:include page="includes/header.jsp" />
<%--<%# page import="com.event"%>--%>
<style>
input.eventdescription{
padding-top : 20px;
padding-bottom : 100px;
}
</style>
<%#page import="java.sql.DriverManager"%>
<%#page import="java.sql.ResultSet"%>
<%#page import="java.sql.*"%>
<%#page import="java.sql.Connection"%>
<%
// ArrayList[] eventname = new ArrayList[10];
// ArrayList[] registrationamount = new ArrayList[10];
// ArrayList[] eventheadname = new ArrayList[10];
// ArrayList[] eventheadcontact = new ArrayList[10];
// ArrayList[] eventdescription = new ArrayList[10];
// ArrayList[] eventid = new ArrayList[10];
//
//HttpSession session1 = request.getSession();
// eventname = (ArrayList[])session1.getAttribute("eventname");
// registrationamount = (ArrayList[])session1.getAttribute("registrationamount");
// eventheadname = (ArrayList[])session1.getAttribute("eventheadname");
// eventheadcontact = (ArrayList[])session1.getAttribute("eventheadcontact");
// eventdescription = (ArrayList[])session1.getAttribute("eventdescription");
// eventid = (ArrayList[])session1.getAttribute("eventid");
%>
<div class="addevent-content" style="background-color:black">
<div class="pattern height-resize">
<div class="container">
<form class="form-horizontal" action="UpdateEvent" method="post"
id="addevent_form" >
<!-- Form Name -->
<center>
<h2 id="registerheading">
<b style="color: gold">Modify Event</b>
</h2>
</center>
<br>
<!-- Text input-->
<div class="form-group">
<label class="col-md-5 control-label" style="color: #fff">Event
Name<abbr title="Required">*</abbr>
</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<input name="event_name" id="form_fname" placeholder="Event Name"
value='${eventname}' class="form-control" type="text" required>
</div>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-5 control-label" style="color: #fff">Registration Amount<abbr title="Required">*</abbr>
</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<input name="registration_amount" id="form_lname" placeholder="Registration Amount"
value='${registrationamount}' class="form-control" type="text" required>
</div>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-5 control-label" style="color: #fff">Event Image<abbr
title="Required">*</abbr></label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<input name="event_image" placeholder="Event Image" class="form-control"
value='' type="text" required>
</div>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-5 control-label" style="color: #fff">EventHead Name<abbr
title="Required">*</abbr></label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<input name="eventhead_name" id="password1" placeholder="EventHead Name"
value='${eventheadname}' class="form-control" type="text" required>
</div>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-5 control-label" style="color: #fff">EventHead Contact
<abbr title="Required">*</abbr>
</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<input name="eventhead_contact" id="password2" placeholder="(+91)"
value='${eventheadcontact}' class="form-control" type="text" required>
</div>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-5 control-label" style="color: #fff">Event Description<abbr
title="Required">*</abbr></label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<input name="event_description" id="email" placeholder=""
value='${eventdescription}' class="form-control eventdescription" type="text" required>
</div>
</div>
</div>
<!-- Select Basic -->
<input name="event_id"class="form-control"
value='${eventid}' type="hidden" >
<!-- Button -->
<div class="form-group">
<label class="col-md-5 control-label"></label>
<div class="col-md-5">
<br>
<button type="submit" class="btn btn-warning">SUBMIT</button>
</div>
</div>
</form>
</div>
<!-- /.container -->
</div>
<!-- pattern height resize-->
</div>
<%# include file="includes/footer.jsp" %>
<%#include file="includes/scripts.jsp" %>
</body>
</html>
So is there any way that when user clicks on modify button and it should retrieve that particular event details in modify-page.jsp from the database for modification and then user can click on submit to update the database .
below is the structure of the database table "Events"
Database structure
send unique id with url ,
Modify
Then get id in modify-page request.getParameter("id")
connect db again with PreparedStatement
using SELECT * FROM Events WHERE eventid= ? sql statement.
I have completed HTML project and works find and no ERROR
Now my problem is that I am unable to find incomplete job in my Project. I use Netbeans for creating this project is there a way to find any incomplete work in existing project?
I used HTML, Flash, java, to create this entire project. Is there a tool to find this incomplete work or can I find it using Netbeans
So, how do I find incomplete work?
Thanks in advance
CODE
<!DOCTYPE html>
<html>
<head>
<title>Atomic Structure and Chemical Bonds</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link type='text/css' rel='stylesheet' href='assets/css/bootstrap.min.css' />
<link type='text/css' rel='stylesheet' href='assets/css/VLAB.css' />
<link type='text/css' rel='stylesheet' href='assets/css/E20.css' />
<!--<link type='text/css' rel='stylesheet' href='assets/css/bootstrap-theme.min.css' />-->
<!--for Font-->
<link rel="stylesheet" type="text/css" media="screen" href="assets/fonts/webfontkit_proximaNova_reg/ProximaNova-Regular.css" />
<link rel="stylesheet" type="text/css" media="screen" href="assets/fonts/webfontkit_proximanova_sb/ProximaNova-Semibold.css" />
<script src="assets/js/jquery-1.9.1.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.ui.touch-punch.js"></script>
<script type="text/javascript" src="assets/js/jquery.shuffle.js"></script>
<script type="text/javascript" src="assets/js/calc.js"></script>
<!-- Icon Assets -->
<script type="text/javascript" src="assets/js/journal.js"></script>
<script type="text/javascript" src="assets/js/sound.js"></script>
<script type="text/javascript" src="assets/js/print.js"></script>
<script type="text/javascript" src="assets/js/main.js"></script>
<script type="text/javascript">
function incrementButtons( upBtn, downBtn, qtyField )
{
var step = parseFloat( qtyField.value ) || 1,
currentValue = step;
downBtn.onclick = function()
{
currentValue = parseFloat( qtyField.value ) || step;
qtyField.value = ( currentValue -= Math.min( step, currentValue - step ) );
}
upBtn.onclick = function()
{
currentValue = parseFloat( qtyField.value ) || step;
qtyField.value = ( currentValue += step );
}
}
</script>
</head>
<body>
<div class="overlay"></div>
<div class="VLAB_container">
<header>
<div class="VLAB_head">VIRTUAL LABS</div>
<div class="VLAB_exit">X</div>
<div class="VLAB_print"></div>
<div class="VLAB_audio"></div>
</header>
<!-- Table Popup -->
<div id="VLAB_table" class="VLAB_table"
style="display:none;z-index:101;">
<div class="VLAB_table_title">Table <div class="VLAB_table_exit">X</div></div>
<div class="VLAB_table_subtitle">Title here </div>
<br/>
<div>
<table id="answered">
<thead>
<tr>
<th>Value 1</th>
<th>Value 2</th>
<th>Value 3</th>
<th>Value 4</th>
</tr>
</thead>
<tbody>
<tr>
<td data-id="all"><input type='text' value='' /></td>
<td data-id="all"><input type='text' value='' /></td>
<td data-id="all"><input type='text' value='' /></td>
<td data-id="all"><input type='text' value='' /></td>
</tr>
<tr>
<td data-id="all"><input type='text' value='' /></td>
<td data-id="all"><input type='text' value='' /></td>
<td data-id="all"><input type='text' value='' /></td>
<td data-id="all"><input type='text' value='' /></td>
</tr>
<tr>
<td data-id="all"><input type='text' value='' /></td>
<td data-id="all"><input type='text' value='' /></td>
<td data-id="all"><input type='text' value='' /></td>
<td data-id="all"><input type='text' value='' /></td>
</tr>
</tbody>
</table>
</div>
<div class="VLAB_table_buttons">
<button type="button" class="btn disabled">Graph</button>
<button type="button" class="btn">Save</button>
<button type="button" class="btn">Print</button>
</div>
</div>
<!-- Table Popup ENDS-->
<!-- Journal Popup-->
<div id="VLAB_journal" class="VLAB_journal" style="display:none;z-index:101;">
<div class="VLAB_journal_title">Journal <div class="VLAB_journal_navigation"><div class="VLAB_journal_exit">X</div>
<div class="VLAB_journal_next"></div>
<span class="VLAB_journal_Qno"></span>
<div class="VLAB_journal_prev"></div>
</div>
</div>
<div class="VLAB_journal_subtitle"></div>
<div id="journalQuestions" style="display:none;z-index:101;">
<form action="#" class="regform" method="get">
<p>What part of the digestive system would you see in a cross-section anterior to the gizzard?<br/>
<textarea class="VLAB_journal_text_area" id="Answer1"
name="Question1" placeholder=""></textarea></p>
<p>What structure in the earthworm has a similar function as the human heart? Explain your answer.<br/>
<textarea class="VLAB_journal_text_area" id="Answer2"
name="Question2" placeholder=""></textarea></p>
<p>What do two earthworms exchange during mating? Explain your answer.<br/>
<textarea class="VLAB_journal_text_area" id="Answer3"
name="Question3" placeholder=""></textarea></p>
<p>Describe the difference between a closed and an open circulatory system.<br/>
<textarea class="VLAB_journal_text_area" id="Answer4"
name="Question4" placeholder=""></textarea></p>
<p>Do earthworms have a front and a back end? Explain your answer.<br/>
<textarea class="VLAB_journal_text_area" id="Answer5"
name="Question5" placeholder=""></textarea></p>
<p>What characteristics distinguish an annelid from other worms?<br/>
<textarea class="VLAB_journal_text_area" id="Answer6"
name="Question6" placeholder=""></textarea></p>
</form>
</div>
<div class="VLAB_journal_buttons">
<button type="button" class="btn">Save</button>
<button id="journalPrint" type="button" class="btn">Print</button>
</div>
</div>
<!-- Journal Popup ENDS-->
<!-- AUDIO START -->
<div style="display:none;">
<audio preload="metadata" id="a1" class="a1">
<source class="aud_src" src="assets/audio/sound2drag.mp3" type = "audio/mp3">
<source class="aud_src" src="assets/audio/sound2drag.ogg" type = "audio/ogg">
</audio>
</div>
<!-- AUDIO END -->
<!-- Calculator -->
<form>
<div class="VLAB_CALC">
<div class="VLAB_CALC_title">Calculator
<div class="VLAB_CALC_exit">X</div>
</div>
<div class="VLAB_CALC_screen">
<input type="text" id="memory" class="pull-left" value="" readonly /> <input type="text" id="displayPanel" class="pull-right" value="0" readonly /> </div>
<div class="VLAB_CALC_buttonpad">
<div class="dark" onclick='ac()'>AC</div>
<div class="dark" onclick='ce()'>CE/C</div>
<div class="dark" onclick='perc()' > %</div>
<div class="dark right" onclick='getoperator("/")'>/</div>
<div onclick='getdigit("1")'>1</div>
<div onclick='getdigit("2")'>2</div>
<div onclick='getdigit("3")'>3</div>
<div class="dark right" onclick='getoperator("*")'>×</div>
<div onclick='getdigit("4")'>4</div>
<div onclick='getdigit("5")'>5</div>
<div onclick='getdigit("6")'>6</div>
<div class="dark right" onclick='getoperator("+")'>+</div>
<div onclick='getdigit("7")'>7</div>
<div onclick='getdigit("8")'>8</div>
<div onclick='getdigit("9")'>9</div>
<div class="dark right" onclick='getoperator("-")'>−</div>
<div onclick='getdigit("0")'>0</div>
<div class="dark" onclick='v(".")'>.</div>
<div class="dark right equal-sign" onclick='e()'>=</div>
<div class="dark lastrow" onclick='sto()' >STO</div>
<div class="dark lastrow" id="memoryBtn" onclick='rcl()'>RCL</div>
<div class="dark right lastrow" onclick=' sum_m()'>SUM</div>
</div>
</div>
</form>
<!-- Calculator END -->
<div id="VLAB_leftPanel" class="VLAB_leftPanel">
<div class="VLAB_leftPanel_head">Measurements</div>
<div class="VLAB_leftPanel_subhead">What are the structures and body systems of an earthworm?</div>
<div class="VLAB_leftPanel_content">
<p>We study earthworms to learn the structures and functions of segmented worms, also called annelids. Segmentation supports diversified functions of body parts and tissues. Studying the anatomy and body systems of annelids helps us understand the bodies of higher-level organisms. <br/><br/>Earthworms are classified in the phylum <i>Annelida</i>. (Kingdom: Animal; Phylum; Annelida; Class: Oligochaeta; Order: Opisthopora; Family: Lumbricidae; Genus: <i>Lumbricus</i>; Species:<i>Lumbricus terrestris</i>) The Annelida also include leeches and bristleworms. Segmented worms have bilateral symmetry and have a coelom, which is a fluid-filled body cavity surrounded by mesoderm. Earthworms have two body openings, a mouth and an anus. The basic body plan of segmented worms consists of a digestive tract within a tube. Earthworms are hermaphrodites, which means that an individual animal produces both sperm and eggs. During mating, two earthworms exchange sperm. Each earthworm forms a capsule for the eggs and sperm in which the eggs are fertilized. The capsule is left behind in the soil where the young earthworms emerge from the eggs in two to three weeks. Earthworms are herbivores. They obtain food by eating through the soil and extracting nutrients from it as food passes through the digestive tract. As an earthworm burrows, it loosens, aerates, and fertilizes the soil. Earthworm burrows provide passageways for plant roots and improve drainage of the soil.<br/><br/>
<b>Procedure</b><br/><br/> <b>1</b>. Click the <b>Lab manual</b> to read about earthworm anatomy.<br/><br/><b>2</b>. Click the <b>External anatomy button</b> to view a diagram of the external features of an earthworm.<br/><br/><b>3</b>. Drag and drop the <b>Labels</b> to the matching structures of the illustration.<br/><br/><b>4</b>. When all structures are labeled, the <b>Check button</b> is enabled. Click the <b>Check button</b> to receive feedback on whether the labels are matched with the correct structures. Correct the highlighted incorrect labels.<br/><br/><b>5</b>. Click the <b>Internal anatomy button</b> to view a diagram of the internal features of the earthworm and repeat steps 3 and 4.<br/><br/><b>6</b>. Answer the <b>Journal Questions</b>.</p>
</div>
<div class="VLAB_leftPanel_buttons">
<button id="journalBtn" type="button" class="btn">Journal</button>
<button id="calcBtn" type="button" class="btn">Calculator</button>
<button id="tableBtn" type="button" class="btn">Table</button>
</div>
</div>
<!-- right Panel for Interactivity part-->
<div class="VLAB_rightPanel">
<div id="page_content">
<div id="vlab_assets">
<!-- for development -->
<div calss="lab"><img height="683" width="700" src="assets/img/main.png" alt="image" style="position:absolute;"/></div>
<div style="position:absolute;margin-left:12px;margin-top:101px;"><img height="545" width="667" src="assets/img/bg_yellow.png" alt="image" style="position:absolute;"/></div>
<button id="me1" class="button">Hydrogen</button>
<button id="me2" class="button" style="margin-left:184px;">Hydrogen</button>
<button id="me3" class="button" style="margin-left:348px;">Hydrogen</button>
<button id="me4" class="button" style="margin-left:512px;width:160px;">Hydrogen</button>
<!--a class="term" id="pop1"><button class="buttona" style="margin-top:113px;margin-left:530px;width:122px;height:30px;">Show Labels</button></a-->
<script language="javascript">
var _0xd7e2=["\x6D\x61\x74\x63\x68","\x75\x73\x65\x72\x41\x67\x65\x6E\x74","\x74\x6F\x75\x63\x68\x73\x74\x61\x72\x74","\x63\x6C\x69\x63\x6B","\x6E\x6F\x43\x6F\x6E\x66\x6C\x69\x63\x74","\x68\x69\x64\x65","\x2E\x41\x6E\x73\x5F\x31\x50\x6F\x70","\x66\x61\x64\x65\x54\x6F\x67\x67\x6C\x65","\x73\x70\x61\x6E","\x63\x68\x69\x6C\x64\x72\x65\x6E","\x2E\x41\x6E\x73\x5F\x31","\x76\x61\x6C","\x53\x68\x6F\x77","\x48\x69\x64\x65","\x62\x69\x6E\x64","\x23\x62\x74\x6E\x53\x68\x6F\x77","\x72\x65\x61\x64\x79"];var what=(navigator[_0xd7e2[1]][_0xd7e2[0]](/iPad/i))?_0xd7e2[2]:_0xd7e2[3];var $=jQuery[_0xd7e2[4]]();$(document)[_0xd7e2[16]](function (_0xf214x3){$(_0xd7e2[6])[_0xd7e2[5]]();$(_0xd7e2[15])[_0xd7e2[14]](what,function (_0xf214x3){var _0xf214x4=$(this);$(_0xd7e2[10])[_0xd7e2[9]](_0xd7e2[8])[_0xd7e2[7]]();_0xf214x4[_0xd7e2[11]](_0xf214x4[_0xd7e2[11]]()==_0xd7e2[12]?_0xd7e2[13]:_0xd7e2[12]);} );} );
</script>
<script type="text/javascript" src="assets/js/jquery.1.10.2.min.js"></script>
<div class="Ans_1" style="position:absolute;margin-top:160px;margin-left:23px;opacity:1;">
<span style="opacity:1;" class="Ans_1Pop" ><img height="410" width="490" src="assets/img/label.png" alt="image"/></span>
</div>
<input type="button" id="btnShow" value="Show Labels" style="position:absolute;margin-top:113px;margin-left:530px;width:122px;height:30px;" />
<form id="f1" style="position:absolute;">
<p><input class="form-control transparent-input" type='text' name='qty' id='qty' value='0' readonly='readonly' style="position:absolute;font-family:verdana;font-weight:bold;margin-top:295px;margin-left:240px;width:55px;height:40px;border:black;background:black;color:white;text-align:center;"/></p>
<p><input type='button' name='add' value='' style="margin-top:277px;margin-left:317px;position:absolute;width:20px;height10px;opacity:0;"/></p>
<p><input type='button' name='subtract' value='' style="margin-top:305px;margin-left:317px;position:absolute;width:20px;height10px;opacity:0;"/></p>
</form>
<script type="text/javascript">
with( document.getElementById( 'f1' ) )
incrementButtons( add, subtract, qty );
</script>
<form id="f2" style="position:absolute;">
<p><input class="form-control transparent-input" type='text' name='qty' id='qty' value='0' readonly='readonly' style="position:absolute;font-family:verdana;font-weight:bold;margin-top:350px;margin-left:240px;width:55px;height:40px;border:black;background:black;color:white;text-align:center;"/></p>
<p><input type='button' name='add' value='' style="position:absolute;margin-top:347px;margin-left:317px;width:20px;height:20px;opacity:0;"/></p>
<p><input type='button' name='subtract' value='' style="position:absolute;margin-top:369px;margin-left:317px;width:20px;height:20px;opacity:0;"/></p>
</form>
<script type="text/javascript">
with( document.getElementById( 'f2' ) )
incrementButtons( add, subtract, qty );
</script>
<button id="check" class="buttona" style="margin-top:494px;margin-left:535px;width:102px;height:30px;">Check</button>
<form id="f3" style="position:absolute;">
<p><input class="form-control transparent-input" type='text' name='qty' id='qty' value='0' readonly='readonly' style="position:absolute;font-family:verdana;font-weight:bold;margin-top:574px;margin-left:342px;width:55px;height:40px;border:black;background:black;color:white;text-align:right;"/></p>
<p><input type='button' name='add' value='' style="position:absolute;margin-top:571px;margin-left:407px;width:12px;height:12px;opacity:0;"/></p>
<p><input type='button' name='subtract' value='' style="position:absolute;margin-top:586px;margin-left:407px;width:12px;height:12px;opacity:0;"/></p>
</form>
<script type="text/javascript">
with( document.getElementById( 'f3' ) )
incrementButtons( add, subtract, qty );
</script>
<form id="f4" style="position:absolute;">
<p><input class="form-control transparent-input" type='text' name='qty' id='qty' value='0' readonly='readonly' style="position:absolute;font-family:verdana;font-weight:bold;margin-top:574px;margin-left:428px;width:55px;height:40px;border:black;background:black;color:white;text-align:right;"/></p>
<p><input type='button' name='add' value='' style="position:absolute;margin-top:571px;margin-left:493px;width:12px;height:12px;opacity:0;"/></p>
<p><input type='button' name='subtract' value='' style="position:absolute;margin-top:586px;margin-left:493px;width:12px;height:12px;opacity:0;"/></p>
</form>
<script type="text/javascript">
with( document.getElementById( 'f4' ) )
incrementButtons( add, subtract, qty );
</script>
<form id="f5" style="position:absolute;">
<p><input class="form-control transparent-input" type='text' name='qty' id='qty' value='0' readonly='readonly' style="position:absolute;font-family:verdana;font-weight:bold;margin-top:574px;margin-left:513px;width:55px;height:40px;border:black;background:black;color:white;text-align:right;"/></p>
<p><input type='button' name='add' value='' style="position:absolute;margin-top:572px;margin-left:580px;width:12px;height:12px;opacity:0;"/></p>
<p><input type='button' name='subtract' value='' style="position:absolute;margin-top:586px;margin-left:580px;width:12px;height:12px;opacity:0;"/></p>
</form>
<script type="text/javascript">
with( document.getElementById( 'f5' ) )
incrementButtons( add, subtract, qty );
</script>
<div id="basic-modal-content" style="position:absolute;margin-top:221px;margin-left:132px;z-index:0;">
<img width="395" height="320" src="assets/img/video1.png" alt="image" />
</div>
<input type="button" id="video" class="buttona" style="margin-top:596px;margin-left:61px;width:80px;height:31px;" value="Video" />
<div id="video" style="position:absolute;margin-top:227px;margin-left:165px;z-index:1;">
<video id="video1" width="330" height="294" autoplay>
<source src="assets/audio/E20.mp4" type="video/mp4" />
<source src="assets/audio/E20.ogg" type="video/ogg" />
<source src="assets/audio/E20.webm" type="video/webm" />
Your browser does not support the video element.
</video></div>
<button id="reset" class="buttona" style="margin-top:596px;margin-left:184px;width:80px;height:31px;">Reset</button>
</div>
</div>
</div>
</div><!--End VLab Container-->
</body>
</html>
Unless the "incomplete work" / "incomplete job" is something that won't compile OR is flagged in the source code with "FIX ME" or "TO DO" tags (or the like), then I don't see how NetBeans or any other tool could distinguish between what is incomplete, and what is not.
There are tools that can detect some kinds of bug by analysing the source code, but I don't expect that that is what you mean by "incomplete".