Call external javascript function frm JSP - java

I'm brand new to the javascript. I'm trying to call a javaScript function from my jsp.Its not working. I was trying to debug it through bugzila. It saying "No Javascript on this page"
<%# 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>
<script type="text/javascript" src="ajaxs.js"></script>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<%
out.println("Bismillahir Rahmanir Rahim");
%>
<jsp:useBean id="numBean" class="beans.NumberBean">
<jsp:setProperty name="numBean" property="*" />
</jsp:useBean>
<form action="index.jsp" method="post">
<table>
<tr>
<td>Enter Integers:</td>
<td><input type="text" id="inputString" name="inputString"
value="<jsp:getProperty name="numBean" property="inputString" />"
/> </td>
<td>(Use semi-colon to separate number)</td>
</tr>
<tr>
<td>M - number of largest element to find.:</td>
<td>
<input type="text" id="nthHighest" name="nthHighest"
value="<jsp:getProperty name="numBean" property="nthHighest" />" />
</td>
</tr>
</table>
<input type="submit" value="Identify" onclick="ajaxFunction()" />
<div id="result"></div>
</form>
</body>
</html>
I'm trying to call "ajaxFunction()" on onclick event.
I included js file as following at the top:
<script type="text/javascript" src="ajaxs.js"></script>
can u pls help me to identify what I'm doing wrong here...
Thanks in advance

Try with including script tag with "src="ajaxs.js" (your current script that including "src="ajaxs.js") within head tag.The contents within head tag load at the loading page .
thanks....

Related

how to send data from table to jsp

I want to get table data from table to new database through jsp servlet this is my sample code in jsp this table contains database elements
I struggled for a week. Please help me.
I want to get table data from table to new database through jsp servlet this is my sample code in jsp this table contains database elements
<%#page import="java.sql.Connection"%>
<%#page import="java.sql.PreparedStatement"%>
<%#page import="Servlets.Db"%>
<%#page import="java.sql.ResultSet"%>
<%# 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">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<h1>Place your Order</h1>
<div class="jumbotron">
<form action="order" method="post">
<!--
<label>name</label>
<input class="form-control" name="name" type="text" >
<label>Member Id</label>
<input class="form-control" name="memberid" type="text" >
<label>Orders</label>
<div class="container">
<div class="row">
<div class="jumbotron">
-->
<table class="table">
<tr>
<th>id</th>
<th>name</th>
<th>quantity</th>
</tr>
<%
Connection con=Db.getCon();
String sql="SELECT * FROM drugs";
PreparedStatement ps=con.prepareStatement(sql);
ResultSet rs=ps.executeQuery();
while(rs.next()) {
%>
<tr>
<td><input type="text" name="id" value="<%=rs.getInt("id") %>"></td>
<td><input type="text" name="name" value="<%=rs.getString("name") %>"></td>
<td><input type="text" name="quntity"></td>
</tr>
<%
}
%>
</table>
<input type="submit" value="submit order">
</form>
</div>
</div>
<div class="row">
<%# include file="WEB-INF/Footer.jsp" %>
</div>
</div>
</body>
</html>
The work you done is get data from database and show data in jsp,if you want to put data into database,you should change sql to "add" and jsp to "input".

Java Servlet JSP not including CSS File

I am working on designing a web application using Java servlets and JSP and am having issues getting the JSP file to include the CSS file. Each JSP page that is called up includes references to header and footer JSP files and the header file includes the with link to the CSS. All of these files are in a secure resource folder "proforma" within my web application. Prior to trying to include the CSS, the security and the header/footer inclusions were working fine, and continue to do so - they are just not formatted per the CSS.
I have the CSS reference included in a header file as follows:
header.jsp
<%#page language="java" contentType="text/html" pageEncoding="UTF-8"%>
<%#taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="${pageContext.request.contextPath}/proforma/cssGuide.css" type="text/css"/>
<title>Pro Forma</title>
</head>
<body>
<h1>Pro Forma</h1>
When I use the pageContext Expression Langugae (${}) like the above, the page content that is loaded is the actual CSS content itself, not the actual content I am looking for.
However, if I use the following JSP code, I get the correct HTML content and the browser source review shows the loaded correctly, but there is no CSS source code:
Alternative header.jsp file (ProForma is the name of the application):
<%#page language="java" contentType="text/html" pageEncoding="UTF-8"%>
<%#taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="../ProForma/proforma/cssGuide.css" type="text/css"/>
<title>Pro Forma</title>
</head>
<body>
<h1>Pro Forma</h1>
Here is a sample content page that I am trying to format:
<%#include file="../proforma/header.jsp" %>
<table>
<tr>
<td>
${createProjectResponse}
</td>
</tr>
<tr>
<td>
<form action="/ProForma/downloadInput" method="post">
<input type="submit" name="downloadInputButton" value="Download Input File" class="controlCenterButton"/>
</form>
</td>
</tr>
<tr>
<td>
<form action="/ProForma/AddProject" method="post">
<input type="hidden" name="actionValue" value="addProject"/>
<input type="submit" name="addPortfolioSubmit" value="Add Project" class="controlCenterButton"/>
</form>
</td>
</tr>
<tr>
<td>
<form action="/ProForma/SelectProjectController" method="post">
<input type="hidden" name="actionValue" value="selectProject"/>
<input type="submit" name="selectProjectSubmit" value="Select Project" class="controlCenterButton"/>
</form>
</td>
</tr>
</table>
<%#include file="../proforma/footer.jsp" %>
Here is the CSS file (very simple at this point until I get it working):
input.controlCenterButton{
width: 20em;
height: 2em;
}
For what it is worth, here is the footer.jsp file:
<p id="footer_p">Company</p>
</body>
</html>
Is there something that I am missing that is preventing the CSS file from being included? I appreciate any help.

How to put html tag inside html tag in jsp page

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>

Creating web dynamic project with Eclipse EE IDE

I am a newbie trying to create a simple web application using JSP and Mysql.
I am using following thing:
Eclipse EE IDE
Tomcat 7.0
Dtabase: MySQL
MySQL Connector
In my page I have row user add row dynamically that s work fine. I want my values should get stored in database after submit.I have searched lot on net but not find anything which can solve problem.I am giving code of current page.I know have to do connection also however I tried but not succeeded.
Thanks in advance.
JSP & Javascript:
<%# 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>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#add").click(function() {
$('#mytable tbody>tr:last').clone(true).insertAfter('#mytable tbody>tr:last');
$('#mytable tbody>tr:last #name').val('');
$("#mytable tbody>tr:last").each(function() {this.reset();});
return false;
});
});
</script>
</head>
<body>
<form>
<a id="add" href="javascript:void(0)">Add another Credit card</a>
<table id="mytable" width="300" border="1" cellspacing="0" cellpadding="2">
<tbody>
<tr class="person">
<td><input type="text" name="name" id="name" /></td>
<td><input type="button" value="name" /></td>
<td><select>
<option>value1</option>
<option>value2</option></select>
<td><input type="text" name="name" id="name" /></td>
</tr>
</tbody>
</table>
<input type="submit" value="submit">
</form>
Logout
</body>
</html>

struts 2 jquery plugin not working

I have jsp loginSuccess.jsp as follows:
<%# 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">
<%# taglib prefix="s" uri="/struts-tags"%>
<%# taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
<head>
<s:head />
<sj:head />
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="style.css" media="all" />
<title>Login</title>
</head>
<body>
<div id="MainPage">
<jsp:include page="header.jsp"></jsp:include>
<jsp:include page="menubaruser.jsp"></jsp:include>
<div id="mainContent" >
<div style="width:898px"><br><center>Welcome Mr. <b><s:property value="#session.name"/> </b></center> </div>
<div id="ajaxdiv">
<div id="ContentLeft">
<jsp:include page="search.jsp"></jsp:include>
</div>
<div id="contentRight">
<jsp:include page="topdeals.jsp"></jsp:include>
</div>
</div>
<br>
<div>
<jsp:include page="userHistoryWidget.jsp"></jsp:include>
</div>
</div>
<jsp:include page="footer.jsp"></jsp:include>
</div>
</body>
</html>
This page include many widgets , two of which are search.jsp and userHistoryWidget.jsp. Now when i run this page, everything is fine but the jquery datepicker tag doesn't work.I mean the calender doesn't show up. If i remove the head tag from loginSuccess.jsp, then the datepicker starts working but then the submit button that are coded to send asynchronous request in userHistoryWidget.jsp stops working. They don't respond to clicks.
userHistoryWidget.jsp is as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%# taglib prefix="s" uri="/struts-tags"%>
<%# taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
<head>
<s:head />
<sj:head />
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="style.css" media="all" />
</head>
<body>
<div id="searchHeaderHistory">User History</div>
<div class="CSSTableGenerator">
<table>
<colgroup>
<col span="1" style="width: 5%;">
<col span="1" style="width: 10%;">
<col span="1" style="width: 8%;">
<col span="1" style="width: 15%;">
<col span="1" style="width: 15%;">
<col span="1" style="width: 6%;">
<col span="1" style="width: 6%;">
<col span="1" style="width: 17%;">
<col span="1" style="width: 18%;">
</colgroup>
<tr>
<td>Ticket ID</td>
<td>Booking Date</td>
<td>Flight ID</td>
<td>From</td>
<td>To</td>
<td>Total Fare</td>
<td>Net Fare</td>
<td></td>
<td></td>
</tr>
<s:iterator value="ticketsList" var="ticket" status="stat">
<tr>
<td align="center"><s:property value="#ticket.tid" /></td>
<td align="center"><s:property value="#ticket.bookingdate" /></td>
<td align="center"><s:property
value="#ticket.scheduleDetails.flightDetails.fid" /></td>
<s:if test="#ticket.flag==3">
<td><s:property
value="#ticket.scheduleDetails.flightDetails.routeDetails.via" /><br>
<s:property value="#ticket.scheduleDetails.via_dep_date" /> <s:property
value="#ticket.scheduleDetails.via_dep_time" />hrs</td>
</s:if>
<s:if test="#ticket.flag==1 ||#ticket.flag==2||#ticket.flag==4">
<td><s:property
value="#ticket.scheduleDetails.flightDetails.routeDetails.source" /><br>
<s:property value="#ticket.scheduleDetails.source_dep_date" /> <s:property
value="#ticket.scheduleDetails.source_dep_time" />hrs</td>
</s:if>
<s:if test="#ticket.flag==1 ||#ticket.flag==2||#ticket.flag==3">
<td><s:property
value="#ticket.scheduleDetails.flightDetails.routeDetails.destination" /><br>
<s:property value="#ticket.scheduleDetails.dest_arr_date" /> <s:property
value="#ticket.scheduleDetails.dest_arr_time" />hrs</td>
</s:if>
<s:if test="#ticket.flag==4">
<td><s:property
value="#ticket.scheduleDetails.flightDetails.routeDetails.via" /><br>
<s:property value="#ticket.scheduleDetails.via_arr_date" /> <s:property
value="#ticket.scheduleDetails.via_arr_time" />hrs</td>
</s:if>
<td align="center"><s:property value="#ticket.fare" /></td>
<td align="center"><s:property value="#ticket.dealFare" /></td>
<td style="width: 150px" align="center">
<s:url id="getPassengers" value="/getPassengers.action">
<s:param name="Tid" value="#ticket.tid" />
</s:url>
<sj:a id="link_%{#stat.index}" href="%{getPassengers}" targets="ajaxdiv" cssClass="orangebuttonsmall">
View Details
</sj:a>
</td>
<td style="width: 150px" align="center">
<s:a action="cancel" id="button1" style="float:left" cssClass="orangebuttonsmall">Cancel Ticket
<s:param name="Tid" value="#ticket.tid"></s:param>
</s:a>
</td>
</tr>
</s:iterator>
</table>
</div>
</body>
</html>
search.jsp is as follows:
<%# 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">
<%# taglib prefix="s" uri="/struts-tags"%>
<%# taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
<head>
<s:head />
<sj:head />
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="style.css" media="all" />
<link rel="stylesheet"
href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
$(function() {
$("#datepicker").datepicker();
});
</script>
<title>Search</title>
</head>
<body>
<s:form action="searchFlight" method="post" theme="css_xhtml" cssClass="form1small">
<div class="searchHeadersmall">Search Flight</div>
<div id="searchForm1">
<s:select list="cityList" headerValue="--------Select--------" headerKey="-1"
name="searchFlightDetails.from" label="Leaving From"></s:select>
<s:select list="destlist" headerValue="---------Select-------" headerKey="-1"
name="searchFlightDetails.to" label="Going To"></s:select>
<s:textfield label="Date" name="searchFlightDetails.date_of_travel"
id="datepicker" />
<s:select list="#{'1':'1','2':'2','3':'3','4':'4','5':'5'}"
headerValue="" headerKey="-1"
name="searchFlightDetails.no_of_passengers" label="No of tickets"
style="width:50%; float:left"></s:select>
<div class="inputsmall nobottombordersmall">
Type
<s:radio label="Type" name="searchFlightDetails.nonstop"
list="#{'Y':'NonStop','N':'Normal'}" theme="simple" />
</div>
<div id="submitdivid1">
<sj:submit id="submitsearch" value="Show Flights" targets="mainContent"/>
</div>
</div>
</s:form>
</body>
</html>
Can somebody help me solve this problem? Thanks in advance..
If your intention is just to include the JSPs in other pages to form a complete page, then I suggest remove the repeated part (html, head, body & other similar tags) and contain only specific part, so that the resulting html contains only ONE html, head & body tag.
Secondly, sj plugin requires <sj:head jqueryui="true"/> for the UI components to work. Looking at your code, it appears the the parent page is loginSuccess.jsp & hence, it's <head> should contain this sj:head definition.
Try removing the redundant code and hopefully, it should work.

Categories