enter image description here from this page i want this list to transfer it to another page in html or jsp page i have given the code below
<%@page import="com.entity.prregister"%>
<%@page import="com.services.prservice"%>
<%@page import="com.connection.jdbc_connection"%>
<%@page import="com.services.regservice"%>
<%@page import="java.util.List"%>
<%@page import="com.entity.cregister"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@include file="index.jsp" %>
<%@include file="sidebar.jsp" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1>Sale Invoice</h1>
</div>
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active">Advanced Form</li>
</ol>
</div>
</div>
</div><!-- /.container-fluid -->
</section>
<!-- Main content -->
<section class="content">
<div class="container-fluid">
<!-- SELECT2 EXAMPLE -->
<div class="card card-default">
<div class="card-header">
<h3 class="card-title">Add list details</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-card-widget="collapse">
<i class="fas fa-minus"></i>
</button>
<button type="button" class="btn btn-tool" data-card-widget="remove">
<i class="fas fa-times"></i>
</button>
</div>
</div>
<!-- /.card-header -->
<form action="result.jsp" method="get">
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label>Bill No</label>
<input type="text" name="billno" id="billno" class="form-control select2" style="width: 100%;"></input>
</div>
<div class="form-group">
<label>Select Product</label>
<select name="product" id="product" class="form-control select2" style="width: 100%;">
<label>Select HSN</label>
<%
try{
prservice pr=new prservice(jdbc_connection.getconnection());
List<prregister> li=pr.totalList();
int j=0;
for(prregister pg:li){
j++;
%>
<option><%=pg.getPname() %></option>
<option><%=pg.getHsn() %></option>
<%
}
} catch(Exception e){
e.printStackTrace();
}
%>
</select>
</div>
<div class="form-group">
<label>Per/Kg</label><br>
<input type="text" name="perkg" id="perkg" class="form-control select2" multiple="multiple" data-placeholder="Select a date" style="width: 25%;">
<label>Quantity</label>
<input type="text" name="quantity" id="quantity" class="form-control select2" multiple="multiple" data-placeholder="Select a date" style="width: 25%;">
<label>Rate</label>
<input type="text" name="rate" id="rate" class="form-control select2" multiple="multiple" data-placeholder="Select a date" style="width: 25%;">
</div>
</div>
<!-- /.col -->
<div class="col-md-6">
<div class="form-group">
<label>Bill Date</label>
<input type="date" name="billdate" id="billdate" class="form-control select2" multiple="multiple" data-placeholder="Select a date" style="width: 100%;">
</div>
<div class="form-group">
<label>Select HSN</label>
<select name="hsn" id="hsn" class="form-control select2" style="width: 100%;">
<label>Select HSN</label>
<%
try{
prservice pr=new prservice(jdbc_connection.getconnection());
List<prregister> li=pr.totalList();
int j=0;
for(prregister pg:li){
j++;
%>
<option><%=pg.getPname() %></option>
<option><%=pg.getHsn() %></option>
<%
}
} catch(Exception e){
e.printStackTrace();
}
%>
</select>
</div>
<div class="form-group">
<label>Submit details :</label><br>
<input type="button" name="button" id="btn" class="btn btn-primary"value="Add to Cart" onclick="AddRow()">
</div>
</div>
</div>
</div>
</form>
<!-- /.col -->
</div>
<!-- /.row -->
</div>
<!-- /.card-body -->
</section>
<!-- /.card -->
<!--below this is code for productlist -->
<section class="content">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h3 class="card-title">Invoice List</h3>
</div>
<!-- /.card-header -->
<div class="card-body">
<table id="example2" class="table table-bordered table-hover">
<thead>
<tr>
<th>Bill No</th>
<th>Product Name</th>
<th>HSN</th>
<th>Per Kg</th>
<th>Quantity</th>
<th>Rate</th>
<th>Bill Date</th>
</tr>
</table>
<br>
<a href="result.jsp"><button type="submit" class="btn btn-primary">Generate Bill</button></a>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</div>
<!-- /.container-fluid -->
</section>
<script>
var list1 = [];
var list2 = [];
var list3 = [];
var list4 = [];
var list5 = [];
var list6 = [];
var list7 = [];
var n=1;
var x=0;
function AddRow(){
var AddRown = document.getElementById('example2');
var NewRow = AddRown.insertRow(n);
list1[x]= document.getElementById("billno").value;
list2[x]= document.getElementById("product").value;
list3[x]= document.getElementById("hsn").value;
list4[x]= document.getElementById("perkg").value;
list5[x]= document.getElementById("quantity").value;
list6[x]= document.getElementById("rate").value;
list7[x]= document.getElementById("billdate").value;
var cel1 = NewRow.insertCell(0);
var cel2 = NewRow.insertCell(1);
var cel3 = NewRow.insertCell(2);
var cel4 = NewRow.insertCell(3);
var cel5 = NewRow.insertCell(4);
var cel6 = NewRow.insertCell(5);
var cel7 = NewRow.insertCell(6);
cel1.innerHTML = list1[x];
cel2.innerHTML = list2[x];
cel3.innerHTML = list3[x];
cel4.innerHTML = list4[x];
cel5.innerHTML = list5[x];
cel6.innerHTML = list6[x];
cel7.innerHTML = list7[x];
n++;
x++;
}
</script>
</div>
</body>
</html>
expecting to get above list in another html page this code creates temporary list in above page but now i need to send that to another page i really need to get this code solved