Dynamically adding drop down list to a jsp page

Question

I have inserted my code here.What i am trying to do is when the user selects an option in Phase menu then the activity menu should be dynamically produced.This code is running fine but when I select an option from phase menu it shows error at onchange function G() is not defined.

 <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1" import ="org.indresh.javanet.Employee" import="org.indresh.javanet.Database" import="org.indresh.javanet.MySqlConnector" import="java.util.HashMap" import="java.util.ArrayList" import="java.util.HashSet" import="java.util.Arrays" import="java.util.Iterator" import="java.util.Set"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <script type="text/javascript"> var create=0; function G(){ if (create == 1) { removeDrop(); } var a=document.getElementById('phase1'); var wheretoput=document.getElementById('acc'); var createselect=document.createElement('select'); createselect.setAttribute('name',"Activity"); wheretoput.appendChild(createselect); ArrayList<String> act=new ArrayList<String>(); act=actpha.get(a); for(var i=0;i<act.length;i++){ var createoption=document.createElement('option'); createoption.text=act.get(i); createoption.value=act.get(i); createselect.add(createoption,createselect.options[null]); } create = 1; } function removeDrop() { var d = document.getElementById('acc'); var oldmenu = document.getElementByName('Activity'); d.removeChild(oldmenu); } function timesheetrecorded(){ alert("Your TimeSheet has been recorded"); } </script> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <meta charset="UTF-8"> <title>Employee TimeLine</title> <meta name="description" content="Description of your site goes here"> <meta name="keywords" content="keyword1, keyword2, keyword3"> <link href="css/style.css" rel="stylesheet" type="text/css"> </head> <body> <%Employee e=(Employee)session.getAttribute("Employee"); String[][] phaseactivity; Boolean temp=(Boolean)session.getAttribute("Manager"); int i; ArrayList<String> pid=new ArrayList<String>(); Database db=new Database(); MySqlConnector scon=new MySqlConnector(); HashMap<String,String> pr=new HashMap<String,String>(); pr=db.getProjects(scon); pid=db.getAllProjectID(scon); HashMap<String,ArrayList<String>> actpha=new HashMap<String,ArrayList<String>>(); actpha=db.getphaseactivity(scon); Set<String> phases=new HashSet<String>(); phases=actpha.keySet(); ArrayList<String> ph=new ArrayList<String>(); Iterator it=phases.iterator(); while(it.hasNext()){ ph.add((String)it.next()); } %> <div class="main-out"> <div class="main"> <div class="page"> <div class="top"> <div class="header"> <div class="header-top"> <h1><span>Drivedge</span></h1> <p>Call Us: +91 (0)20 65231515.</p> <div class="namename"> <p>Hello <%=e.getEmployeeName() %></p></div> </div> </div> <div class="topmenu"> <ul> <li><%if(temp){%><a href="AddEmployeeToProject.jsp"><button type="button">Add Employees to your Project</button></a><%} %> <a href="logout.jsp"><button type="button">LogOut</button></a></li> </ul> </div> <div class="header-img"> </div> </div> <div class="content"> <div class="content-left"> <div class="row1"> </div> <div class="row2"> <form name="form1" action="timesheet" method="get" onSubmit="timesheetrecorded()"> <div Class="project"> Select Project:<select name="Project"> <option value="">--</option> <%for(i=0;i<pr.size();i++){%> <option value="<%=pid.get(i)%>"><%=pr.get(pid.get(i)) %></option><%} %> </select></div> <div class="phase"> Select Phase:<select name="Phase" id="phase1" onchange="G()"> <option value="">--</option> <%for(String p:ph){%> <option value="<%=p%>"><%=p %></option><%} %> </select></div> <div class="activity" id="acc"> Activity:</div> <div class="date">Date:<input type="date" name="date" format="yyyymmdd"/></div> <div class="time"> Time Devoted(Hrs):<input type="text" name="time"/></div> <div class="submit2"> <input type="submit" name="Submit" onclick="timesheetrecorded()"/></div> </form> </div> </div> <div class="content-right"> </div> </div> </div> <div class="bottom"> </div> </div> </div> </body> </html>

Answer 1

I think this link may help you

Reading a JSP variable from JavaScript

Answer copied from that question

<html> 
<head>
<script language="javascript"> 

function access(){ 
  <% String str="Hello World"; %>
   var s="<%=str%>"; 
   alert(s); 
} 

</script> 
</head> 

<body onload="access()"> 
</body> 

</html>

Get your ArrayList into any jSP variable

<%=ArrayList<String> act=new ArrayList<String>();
            act=actpha.get(a); %>

After that use that variable into JS

 var jsact="<%=act%>";

from there your code work fine. This code may not perfect but it may help you.

Dynamically adding drop down list to a jsp page

Question

1 answers

solution1
0 2016-06-13 06:35:10

Dynamically adding drop down list to a jsp page

Question

1 answers

solution1 0 2016-06-13 06:35:10

solution1
0 2016-06-13 06:35:10