Okay, I'm new to JSP and I'm trying to create a simple form with button in a JSP file index.jsp and link it to bootstrap. I just can't figure out how to call the bootstrap files from JSP. Here is my JSP code:
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link href=”Bootstrap/css/bootstrap.min.css” rel=”stylesheet” type=”text/css” />
<script type=”text/javascript” src=”Bootstrap/js/bootstrap.min.js”></script>
<title>Bootstrap Project</title>
</head>
<body>
<div class=”container”>
<form role=”form”>
<div class=”form-group”>
<label for=”exampleInputEmail1″>Email address</label>
<input type=”email” class=”form-control” id=”exampleInputEmail1″ placeholder=”Enter email”>
</div>
<div class=”form-group”>
<label for=”exampleInputPassword1″>Password</label>
<input type=”password” class=”form-control” id=”exampleInputPassword1″ placeholder=”Password”>
</div>
<div class=”form-group”>
<label for=”exampleInputFile”>File input</label>
<input type=”file” id=”exampleInputFile”>
<p class=”help-block”>Example block-level help text here.</p>
</div>
<div class=”checkbox”>
<label>
<input type=”checkbox”> Check me out
</label>
</div>
<button type=”submit” class=”btn btn-default”>Submit</button>
</form>
</div>
</body>
</html>
And here is my folder arrangement:
I'm using Eclipse IDE and Tomcat as the server. Where am I going wrong?
Thanks.
Related
This question already has answers here:
Calling a servlet from JSP file on page load
(4 answers)
Generate an HTML Response in a Java Servlet
(3 answers)
Closed 2 months ago.
I have this problem where I am trying to get items from an ArrayList from a servlet and display it to a JSP file but when I try to get the variables from the item in the ArrayList, they don't show up.
Here is my JSP file
<?xml version="1.0" encoding="UTF-8" ?>
<%# page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%# page import="java.util.*"%>
<%# page import="com.product.Product"%>
<!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 charset="utf-8" />
<meta name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<script src="https://kit.fontawesome.com/256fd9e75f.js"
crossorigin="anonymous"></script>
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap#4.1.3/dist/css/bootstrap.min.css"
integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
crossorigin="anonymous" />
<link rel="stylesheet" href="styles.css" />
<title>Home</title>
<link rel="icon" href="src/ShopLogo.png" type="image/x-icon" />
</head>
<body>
<nav class="navbar fixed-top navbar-expand-md navbar-light"
style="background-color: #f15c55"> <span
class="navbar-brand mb-0 h1">Store</span>
<button type="button" data-toggle="collapse" data-target="#navbarNav"
class="navbar-toggler" aria-controls="navbarNav" aria-expanded="false"
aria-label="Toggle Nav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item active"><a href="ProductLoaderServlet"
class="nav-link">Home</a></li>
<li class="nav-item active"><a href="product.html"
class="nav-link">Top Products</a></li>
<li class="nav-item active"><a href="cart.html" class="nav-link"><i
class="fa-regular fa-cart-shopping"></i></a></li>
</ul>
</div>
</nav>
<div class="image-overlay">
<img src="scr/main/resources/Shop.jpg" alt="" />
<h1 class="centered">Shop</h1>
</div>
<%
ArrayList<Product> products = (ArrayList) request.getAttribute("products");
for (Product product : products) {
%>
<div class="cards">
<div class="card" style="width: 18rem">
<img class="card-img-top" src="<%product.getImgUrl();%>" alt="Image" />
<div class="card-body">
<h5 class="card-title">
<%
product.getName();
%>
</h5>
Details
</div>
</div>
</div>
<%
}
%>
</body>
</html>
and this is what I see My View
I assume that I am able to get the items because I can see 5 cards
But I want to know why my variables such as (name, or the image) aren't showing up
Many Thanks for your help
Hey I'm writing a java application which should be able to connect the user to their facebook accounts. The application than should be able to post on their Facebook pages.
For now my workflow works quite good. But my java app is hostet by my customers. So I have no specified redirect url available. Because everey customer use a different Domain name.
There is the posibility to redirect to https://www.facebook.com/connect/login_success.html as described here https://developers.facebook.com/docs/facebook-login/manually-build-a-login-flow/.
For now my JSP File looks like:
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%
FBGraph fbConnection = new FBGraph();
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Java Facebook Login</title>
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh"
crossorigin="anonymous">
<script src="https://kit.fontawesome.com/30c4960fcc.js"
crossorigin="anonymous"></script>
</head>
<body style="text-align: center; margin: 0 auto;">
<div class="container">
<div class="row">
<div class="col-md-auto">
<div class="jumbotron">
<h1 class="display-4">Welcome to Hforms Social Login</h1>
<p class="lead">Use this page to login into Facebook to use
your Hforms Installtion with your Facebook Pages</p>
<hr class="my-4">
<a class="btn btn-primary btn-lg"
href="<%=fbConnection.getFBAuthUrl()%>" role="button" onclick="<%= fbConnection.onLinkClick()%>"> <i
class="fab fa-facebook"></i> <span>Login into Facebook</span></a>
</div>
</div>
</div>
</div>
</body>
</html>
getFBAuthUrl() for now returns https://www.facebook.com/v6.0/dialog/oauth?client_id=[mySecretID]&redirect_uri=https%3A%2F%2Fwww.facebook.com%2Fconnect%2Flogin_success.html&state=wdadwadawdwad&scope=manage_pages,publish_pages,pages_show_list
When klicking the Link I'm redirected to facbook and have to allow access to my app. When klicking OK there I'm redirected to the facebook success page where the URL is containing the key. But I have no idea how to get the key.
Maybe someone could give me a hint on that.
Thanks in advance
I am trying to print form validation next to each field. My jsp file looks like
<%# taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%# taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%# page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>
.error {
color: red; font-weight: bold;
}
</style>
<title>
FORM
</title>
</head>
<body>
<div id="wrap" >
<div class= "container" style="min-height:400px;">
<hr>
<form:errors path="applicant.applicant_email" cssClass="error"/>
<form:form method = "post" action = "${pageContext.request.contextPath}/addApplicant" modelAttribute = "applicant">
<form:errors path="applicant.applicant_email" cssClass="error"/>
<div class="form-group col-lg-4 col-md-4 col-sm-6">
<label>Email</label>
<input name = "applicant_email" class="form-control" id="inputEmail" placeholder="Email">
</div>
<div class="form-group col-lg-4 col-md-4 col-sm-6 ">
<input type = "submit" />
</div>
</form:form>
</div>
</div>
<!-- div Wrap ka End -->
<hr>
<br>
<br>
</body>
</html>
"Applicant" is the name of my model class.
Now it prints fine outside the form, but prints nothing if form:errors is used inside form:form tag. What am I missing. Any help is highly appreciated. Thank you.
I figured put what the problem was. All had to do was add path attributes to the input fields. Like in my example:
<input name = "applicant_email" class="form-control" id="inputEmail" placeholder="Email" path = "applicant_email">
I'm developing a web page, in that page at bottom I have to upload a file. I have code for upload, but that is in JSP. How I can include that JSP in my HTML page?
index.jsp
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>File Upload Example in JSP and Servlet - Java web application</title>
</head>
<body>
<div>
<h3> Choose File to Upload in Server </h3>
<form action="UploadServlet" method="post" enctype="multipart/form-data">
<input type="file" name="file" />
<input type="submit" value="upload" />
</form>
</div>
</body>
</html>
You can include an html file in a jsp file but cannot include a jsp file in a html file because html files are not parsed on the server-side (so how will the server know to do the include?) and jsp are (assuming you are using a servlet-container).
Make the main file a JSP, put the snippet in an html file, then include in your DIV by using
<div>
<jsp:include page="snippet.html" />
</div>
In my website, I download a full webpage from another site, modify something and extract it as a string. Now, I want to display it as a part of my .jsp page, with scrolling bar.
How can I do that? It shows me error when I try to put another <html> tag.
Thanks for your help.
EDIT!!!
Here is my .jsp
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<%#taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Create Your XSLT Here</title>
</head>
<body>
<form action="../AdminServlet">
URL <input type="text" name="txtUrl" value="" /><br/>
Start Promotion <input type="text" name="txtStart" value="" /><br/>
Produt Name <input type="text" name="txtProductName" value="" /><br/>
<input type="submit" value="View" name="action" />
</form>
<c:if test="${not empty requestScope.website}">
<div>
${requestScope.website}
</div>
</c:if>
</body>
</html>
requestScope.website is a full html page as a string, return from server. When I run, everything in the requestScope.website (such as background image) apply to all my page. I want to limit it to a part of my page, just like using iframe.
I think u can use the <jsp:include ...>tag.
Put the whole source code into a jsp and use the tag to include to your page.
Something like
<jsp:include page="mypagepath/page.jsp"></jsp:include>