When i try to click on Button i have an Error, i have tried a lot of solutions from stackoverflow but none of these seems to work
there is an error in <button type="button" onclick="getZawartosc();">Basic</button>
this is error from console
My source file
<%# page import="java.sql.*" %>
<%# page import="com.microsoft.sqlserver.jdbc.*" %>
<%ResultSet resultset =null;%>
<HTML>
<HEAD>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</HEAD>
<BODY BGCOLOR=##f89ggh>
<div>
<%
try{
String hostName = "xxxxx";
String dbName = "xxxxx";
String user = "xxxxx";
String password = "xxxxx";
String url = String.format("jdbc:sqlserver://%s:1433;database=%s;user=%s;password=%s;encrypt=true;hostNameInCertificate=*.database.windows.net;loginTimeout=30;", hostName, dbName, user, password);
Connection connection = null;
connection = DriverManager.getConnection(url);
Statement statement = connection.createStatement() ;
resultset =statement.executeQuery("SELECT TABLE_NAME FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_TYPE = 'BASE TABLE' AND TABLE_CATALOG='malarzeBaza'") ;
%>
<left>
<h1> Drop down box or select element</h1>
<select>
<% while(resultset.next()){ %>
<option><%= resultset.getString(1)%></option>
<% } %>
</select>
</left>
<center>
<button type="button" onclick="getZawartosc();">Basic</button>
</center>
<script type="text/javascript">
function getZawartosc(){
<%
resultset =statement.executeQuery("SELECT * FROM dbo.Malarze") ;
%>
console.log(<%resultset.getString(2);%>);
}
</script>
<%
//**Should I input the codes here?**
}
catch(Exception e)
{
out.println("wrong entry"+e);
}
%>
</BODY>
</HTML>
Related
I have an HTML page where we enter the name of a movie and if that movie is present in the database,then the name is displayed. I am trying to connect to the database using JavaScript, Ajax and PHP. The database is in the MySQL Workbench Server.
This is what I have done:
pc.html
<html>
<head>
<script type="text/javascript">
function Search_Data()
{
var httpr = new XMLHttpRequest();
var movie_name=document.getElementById("moviename").value;
console.log(movie_name);
httpr.open("GET","get_data.php",true);
httpr.send();
httpr.onreadystatechange = function()
{
if(this.readyState==4 && this.status==200)
{
alert(this.responseText);
}
}
}
</script>
<body>
<input type="text" name="moviename" id="moviename" placeholder="Enter a movie...">
<br/>
<input type="button" name="search" value="Search" onclick="Search_Data()">
<br/>
<span id="response"></span>
</body>
</head>
</html>
get_data.php
(Below code is a trial code to see if its working)
<?php
echo "Hello World"
?>
In the browser,the result I am getting is:
The files are in the following location:
C:\Users\Admin\AppData\Roaming\MySQL\Workbench\scripts
The entire code is getting displayed instead of just "Hello World".I am new to web development and PHP and I am not sure what seems to be the problem.
what are you using is ajax with normal java-script i suggest to use jquery ajax and this is a full example how to connect it to php and how to get the value or list
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="main.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<button type="button" name="search" id="search" class="btn btn-info">Search</button>
<td width="90%"><span id="employee_name"></span></td>
second
<input type="input" id="inputs" value="submit">
<p id="email"></p>
<p id="pass"></p>
<p id="permission"></p>
<script>
$(document).ready(function(){
$('#search').click(function(){
var val = document.getElementById("inputs").value;
var id= $('#employee_list').val();
setInterval(function(){
$.ajax({
url:"db.php",
method:"POST",
data: {val : val},
dataType:"JSON",
success:function(data)
{
$('#email').text(data[val].email);
$('#pass').text(data[val].pass);
$('#permission').text(data[val].perm);
}
})
}, 1000);
});
});
</script>
</body>
</html>
the php file
<?php
$items = array();
$url="localhost";
$user= "root";
$pass="";
$dbname="test";
$value= 0;
if(isset( $_POST['val'])){
$value= $_POST['val'];
}
$num=0;
$connect=mysqli_connect($url,$user,$pass,$dbname);
$result="SELECT email,pass,permission FROM test where id=$value";
$sql=mysqli_query($connect,$result);
while($row=mysqli_fetch_assoc($sql) ){
/* add a new item */
$num++;
$items[$value] = array(
'email' => $row['email'],
'pass' => $row['pass'],
'perm' => $row['permission']
);
}
$json_response = json_encode($items);
echo $json_response;
?>
This is my First JSP Page
I want to create a Multiple checkbox Filter page using Ajax my problem is that when i checked more than one checkbox it can replace previous checkbox value i attached 3 files in this...so please give me solution for this problem Thankyou very much.
<%--
Document : Filter
Created on : Jan 14, 2018, 3:16:01 PM
Author : Lenovo
--%>
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<%#page language="java" %>
<%#page import="java.sql.*" %>
<%#page import="java.util.*" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link type="text/css" rel="stylesheet" href="Bootstrap/bootstrap.css"/>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<title>Filter</title>
<style>
header
{
background-color: lightblue;
height: 100px;
}
li
{
list-style-type: none;
}
#remove
{
display: none;
}
</style>
</head>
<body>
<div class="container-fluid">
<div class="row">
<header>
</header>
</div>
</div>
<br>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3">
<div class="thumbnail" style="padding:20px;">
<h4>BRAND</h4>
<ul>
<%
String bname=null;
try
{
Class.forName("com.mysql.jdbc.Driver");
Connection con=DriverManager.getConnection("jdbc:mysql://localhost:3306/sample","root","root");
Statement st=con.createStatement();
ResultSet rs;
rs=st.executeQuery("SELECT * FROM brands ORDER BY b_name");
int a=1;
while(rs.next())
{
bname=rs.getString("b_name");
%>
<li><input class="brand" id="brand<%=a++%>" type="checkbox" name="chk" value="<%=bname%>" /><%=bname%></li>
<%
}
}
catch(Exception e)
{
out.println(e);
}
%>
</ul>
<hr>
<h4>RAM</h4>
<ul>
<%
String ram=null;
try
{
Class.forName("com.mysql.jdbc.Driver");
Connection con=DriverManager.getConnection("jdbc:mysql://localhost:3306/sample","root","root");
Statement st=con.createStatement();
ResultSet rs;
rs=st.executeQuery("SELECT * FROM ram ORDER BY ram");
while(rs.next())
{
ram=rs.getString("ram");
%>
<li><input type="checkbox" name="chk" value="<%=ram%>" /><%=ram%></li>
<%
}
}
catch(Exception e)
{
out.println(e);
}
%>
</ul>
<hr>
<h4>PRICE</h4>
<ul>
<li><input id="price" type="range" min="3000" max="100000" step="1000" value="3000" /></li>
<div id="showPrice">
</div>
</ul>
</div>
</div>
<div class="col-sm-9" id="load">
<span id="remove">
Clear filter <i class="fa fa-times"></i>
</span>
<br><br>
<div id="filter">
</div>
</div>
</div>
</div>
<script type="text/javascript" src="Bootstrap/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="Bootstrap/bootstrap.js"></script>
<script type="text/javascript" src="FilterJS.js"></script>
</body>
</html>
This is my Jquery & Ajax page
$(document).ready(function()
{
$('.brand').on('change',function()
{
if($(this).is(":checked"))
{
var brand=$(this).val();
$.ajax({
url:"FilterAjaxDB1.jsp",
method:"post",
data:{brand:brand},
success:function(data)
{
$('#filter').html(data);
$('#remove').css({"border-radius":"40px"}).show().fadeIn('fast');
$('#remove').click(function ()
{
$('.brand').prop("checked",false);
});
}
});
}
else
{
$('#filter').html("Not");
$('#remove').hide().fadeOut('fast');
}
});
});
This is my AjaxDB file
<%--
Document : FilterAjaxDB1
Created on : Jan 14, 2018, 5:09:48 PM
Author : Lenovo
--%>
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<%#page language="java" %>
<%#page import="java.util.*" %>
<%#page import="java.sql.*" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link type="text/css" rel="stylesheet" href="Bootstrap/bootstrap.css"/>
<title>JSP Page</title>
</head>
<body>
<div class="thumbnail">
<%
String bname=request.getParameter("brand");
try
{
Class.forName("com.mysql.jdbc.Driver");
Connection con=DriverManager.getConnection("jdbc:mysql://localhost:3306/sample","root","root");
Statement st=con.createStatement();
ResultSet rs;
rs=st.executeQuery("SELECT * FROM mobiles WHERE b_name='"+bname+"'");
while(rs.next())
{
String name=rs.getString("m_name");
String ram=rs.getString("ram");
int p=rs.getInt("price");
out.print(name+"<br>");
out.print(ram+"<br>");
out.print(p+"<br>");
}
}
catch(Exception e)
{
out.print(e);
}
%>
</div>
<script type="text/javascript" src="Bootstrap/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="Bootstrap/bootstrap.js"></script>
</body>
</html>
I want to create a Multiple checkbox Filter page using Ajax my problem is that when i checked more than one checkbox it can replace previous checkbox value
there is something you should know,in the Multiple checkbox,if you choose more than one,you will only get one value by checkbox.value.
If you want to get all the values,you have to use for loop to check all the checkbox if the one you are checking are checked or not
How can i select a faculty and it will only show me the departments in that faculty alone. My database name is getDbase and inside here i have three tables: 1. transfaculties table with two rows (faculty_id and facultyname
2. transdepartments table with two rows (department_id and departmentname)
3. transfacdept table with three rows (transfacdept_id, faculty_id and department_id).This is the code I've written
This is my first jsp page code called Faculty.jsp
<%#page import="com.sua.db.DbManipulation"%>
<%#page import="java.sql.*" contentType="text/html" pageEncoding="UTF-8"%>
<%#page import="com.sua.db.DbConnection"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
<link href="layout.css" rel="stylesheet">
<link href="forms.css" rel="stylesheet">
<script type="text/javascript" src="jquery-1.11.3-jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function()
{
jQuery('.faculty').change(function()
{
var idsss=$(this).val();
var dataString = 'fac_id='+ idsss;
jQuery.ajax
({
type: "POST",
url: "Department.jsp",
data: dataString,
cache: false,
success: function(html)
{
jQuery('.dept').html(html); // result should be the class name of 'dept' dropdown (representing the Department)
}
});
});
});
</script>
</head>
<body>
<!-- ####################################################################################################### -->
<div id="container">
<div class="wrapper">
<div id="register">
<tr>
<td>Dropdown</td>
<td>
<select name="faculty" class="faculty" style="background-color: #ffffa0">
<option selected="selected">--Select Faculty--</option>
<% //HttpSession session = request.getSession();
String returnFacName = "SELECT `transfacdept`.`transfacdept_id`, `transfacdept`.`faculty_id`, "
+ "`transfacdept`.`department_id`, `transfaculties`.faculty_id, "
+ "`transfaculties`.facultyname "
+ "FROM `transfacdept`,`transfaculties` "
+ "WHERE `transfacdept`.`transfacdept_id` = `transfaculties`.faculty_id";
Connection con = new DbConnection().getConnection();
PreparedStatement st = con.prepareStatement(returnFacName);
//ResultSet rs = ps.executeQuery();
ResultSet rs1 = st.executeQuery();
while(rs1.next())
{
%>
<option value="<%=rs1.getInt("faculty_id")%>">
<%=rs1.getString("facultyname")%>
</option>
<%
}
%>
</select>
</td>
</tr>
<tr>
<td>Dropdown 2:</td>
<td>
<select name="dept" class="dept" style="background-color: #ffffa0">
<option selected="selected">--Select Dept--</option>
</select>
</td>
</tr>
</div>
</div>
<br class="clear" />
</div>
</div>
</body>
</html>
This is my second jsp page code called Department.jsp
<head>
<script type="text/javascript" src="jquery-1.11.3-jquery.min.js"></script>
</head>
<body>
<!-- ####################################################################################################### -->
<div id="container">
<div class="wrapper">
<div id="register">
<td>Dropdown2</td>
<td>
<% Connection con = new DbConnection().getConnection();
//Statement st = con.createStatement( );
String $select = request.getParameter("fac_id");
String returnDeptName = "SELECT `transfacdept`.`transfacdept_id`, `transfacdept`.`faculty_id`, "
+ "`transfacdept`.`department_id`, `transfaculties`.facultyname, "
+ "`transdepartments`.departmentname "
+ "FROM `transfacdept`, `transfaculties`, `transdepartments` "
+ "WHERE `transfaculties`.faculty_id = '"+$select+"' "
+ "AND `transfacdept`.`department_id` = `transdepartments`.department_id "
+ "AND `transfacdept`.`faculty_id` = `transfaculties`.`faculty_id` ";
PreparedStatement st2 = con.prepareStatement(returnDeptName);
ResultSet rs2=st2.executeQuery();
while(rs2.next())
{
%>
<option value="<%=rs2.getInt("department_id")%>">
<%=rs2.getString("departmentname")%>
</option>
<%
}
%>
</td>
</tr>
</div>
</div>
<br class="clear" />
</div>
</div>
<!-- ####################################################################################################### -->
</body>
</html>
Any idea where I'm going wrong?
It only gives me the faculty without calling the department from the Jquery
welcome to SO.
Firstly as mentioned in comment the way you are doing it is totally wrong.
my advice is to go threw some AJAX-JAVA tutorials or even before that if you have not done how to use servlet first learn that and then goto AJAX.
here is a link that has detailed answer which you can go threw.
stackoverflow example
Hope this helps.
Here is my jsp page code:
<%# page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%# page import="java.sql.*"%>
<%# page import="java.io.*"%>
<%# page import="java.util.*"%>
<%# page import="test.Obiekt"%>
<%# page import="test.ListaObiektow"%>
<%# page import="test.Termin"%>
<%# page import="test.ListaTerminow"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>menu główne</title>
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<meta name="android-mobile-web-app-capable" content="yes">
<meta name="android-mobile-web-app-status-bar-style" content="black">
<link href="css/ratchet.css" rel="stylesheet">
<link href="css/ratchet-theme-android.css" rel="stylesheet">
<script src="js/ratchet.js"></script>
<script type="text/javascript">
function Refresh(idObiekt){
location.href="pilkaNozna.jsp?idObiekt=" + idObiekt;
}
</script>
</head>
<body>
</br>
</br>
</br>
<header class="bar bar-nav">
<a class="icon icon-left-nav pull-left" href="wyszukaj.jsp"></a>
<h1 class="title">Wybierz obiekt</h1>
</header>
<div id="content">
<div class="tabelawybor">
<b>Wybierz obiekt:</b>
<%
ArrayList<Obiekt> list = new ListaObiektow().getObiekty();
%>
<form name="obiekt">
<select name="obiekt" onChange="Refresh(this.value)">
<%
for (Obiekt obiekt : list) {
String selectedObiekt = request.getParameter("obiekt");
%>
<option value="<%=obiekt.idObiekt%>"
<%= ((Integer.toString(obiekt.idObiekt)).equals(selectedObiekt))?"selected":""%>><%=obiekt.nazwa%>
<%=obiekt.adres%></option>
<%
int idObiekt = obiekt.idObiekt;
request.setAttribute("idObiekt", idObiekt);
%>
<%
}
%>
</select>
</form>
</div>
<div class="tabelawybor">
<td><b>Wpisz liczbę uczestników:</b><input type="text"
name="uczest" /></td>
</div>
<div class="tabelawybor">
<table class="center">
<tr>
<td>Nazwa obiektu:</td>
<td>Data:</td>
<td>Godzina</br> rozpoczęcia:
</td>
<td>Godzina</br> zakończenia:
</td>
<td></td>
</tr>
<%
ArrayList<Termin> lista = new ListaTerminow().getTerminy();
for (Termin termin : lista) {
%>
<tr>
<td><%=termin.nazwaObiektu%> <%=termin.adresObiektu%></td>
<td><%=termin.dzien%></td>
<td><%=termin.odKtorej%></td>
<td><%=termin.doKtorej%></td>
<td><form action="Rezerwuj" method="post">
<button class="btn btn-primary">Zarezerwuj</button>
</form></td>
</tr>
<%
}
%>
</table>
</div>
</div>
</body>
</html>
ListaTerminow.java
package test;
import test.ConnectionClass;
import test.ListaObiektow;
import test.Obiekt;
import java.io.IOException;
import java.sql.*;
import java.util.ArrayList;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import test.ListaObiektow;
public class ListaTerminow {
Connection conn;
int idObiekt;
public ListaTerminow() throws SQLException
{
conn = ConnectionClass.Polacz();
}
public ArrayList<Termin> getTerminy() throws SQLException, ClassNotFoundException
{
ArrayList<Termin> terminy = new ArrayList<Termin>();
ResultSet rs = null;
String query = "SELECT obiekty.nazwa,obiekty.adres, termin.dzien, termin.odKtorej, termin.doKtorej FROM termin LEFT JOIN obiekty ON termin.idObiekt = obiekty.idObiekt WHERE termin.czyZajety = false AND obiekty.idObiekt = ?";
PreparedStatement ps = conn.prepareStatement(query);
ps.setLong(1, idObiekt);
rs = ps.executeQuery();
while(rs.next())
{
Termin termin = new Termin();
termin.setNazwaObiektu(rs.getString(1));
termin.setAdresObiektu(rs.getString(2));
termin.setDzien(rs.getDate(3));
termin.setOdKtorej(rs.getString(4));
termin.setDoKtorej(rs.getString(5));
terminy.add(termin);
}
return terminy;
}
}
I found solution to refresh and remember value after select option from select form. But now, i want to show all "termins" in below select form. For example: When i select first option in select form (obiekt.idObiekt = 1) then i want to show all termins for obiekt with id 1 in . Can you help me ?
First of all, put your select inside a form. So that when you submit it during refresh you can get the value it was holding with String selectedObiekt=request.getParameter("obiekt"). Then modify your option to read
<option value="<%=obiekt.idObiekt%>" <%= ((Integer.toString(obiekt.idObiekt)).equals(selectedObiekt))?"selected":""%>><%=obiekt.nazwa%>
<%=obiekt.adres%></option>
So as the title says, I'm inserting information in mysql database but only the file that I'm uploading is inserted into database. Everything else is NULL. I suspect it has something to do with the creation of temporary directory on the server to save the file but then again I can't find the solution.
Here is the table I'm inserting into
CREATE TABLE DOC(IDD INT NOT NULL AUTO_INCREMENT, DOCN VARCHAR(50), AUTHOR VARCHAR(50), CAT VARCHAR(50),CONTENT MEDIUMBLOB NOT NULL, CRITN INT DEFAULT 0, PRIMARY KEY(IDD));
Here is the html form I'm fiiling
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
</head>
<body>
<form enctype="multipart/form-data" action="uploadfile.jsp" method="post" onsubmit="return verify()">
<table border='1'>
<tr>
<span style="color:black">Τίτλος</span> <input type="text" name="title"><p></p>
<span style="color:black">Συγγραφέας</span> <input type="text" name="author"><p></p>
<span style="color:black">Κατηγορία</span> <input type="text" name="cat"><p></p>
<td>
Επιλέξτε το άρθρο που θέλετε.
</td>
</tr>
<tr>
<td>
<input type="file" name="filename" id="filename"accept="application/pdf"/>
</td>
</tr>
<tr>
<td>
<input type="submit" value="Upload" />
</td>
</tr>
</table>
</form>
</body>
</html>
And here's the code for the jsp
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<%#page import="java.io.InputStream"%>
<%#page import="conPackage.MyConnection"%>
<%#page import="java.sql.PreparedStatement"%>
<%#page import="java.io.FileInputStream"%>
<%#page import="java.util.Enumeration"%>
<%#page import="com.oreilly.servlet.MultipartRequest"%>
<%#page import="java.io.File"%>
<%# page import="java.util.Properties.*" %>
<%# page import="java.security.MessageDigest;"%>
<%# page import="java.util.*"%>
<%#page import="java.sql.*"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
<%
String rtempfile = File.createTempFile("temp","1").getParent();
MultipartRequest multi = new MultipartRequest(request,rtempfile, 15*1024*1024);
Enumeration files = multi.getFileNames();
String docn =request.getParameter("title");
String author = request.getParameter("author");
String cat= request.getParameter("cat");
String st="insert into doc(docn, author, cat, content) values (?,?,?,?)";
PreparedStatement psmt=MyConnection.getConnection().prepareStatement(st);
String name="";
String fileExtesion="";
File ff =null;
FileInputStream fin =null;
while (files.hasMoreElements())
{
name=(String)files.nextElement();
ff = multi.getFile(name);
fileExtesion = ff.getName().substring(ff.getName().lastIndexOf("."));
// check user has select the correct file or not
boolean fileAllowed = fileExtesion.equalsIgnoreCase(".pdf");
if((ff!=null)&&fileAllowed)
{
try
{
fin=new FileInputStream(ff);
psmt.setString(1, docn);
psmt.setString(2, author);
psmt.setString(3, cat);
psmt.setBinaryStream(4,(InputStream)fin, (int)(ff.length()));
boolean sss = psmt.execute();
out.print("uploaded successfully..");
out.print("<br/> Go to <a href='downloadfile.jsp'>Download</a> page");
}
catch(Exception e)
{
out.print("Failed due to " + e);
}
finally
{
fin.close();
ff.delete();
}
}
else
{
out.print("Please select the correct file...");
}// end of if and else
}// end of while
MyConnection.CloseConnection(); // close the connection
%>
</body>
</html>
When using enctype multipart/form-data you have to use request.getPart for the regular parameters too, as request.getParameter always returns null with multipart/form-data. The other option for processing file uploads is the Apache Commons File Upload library, but in that case as well, you have to get the regular parameters wit the same method as you get the file.