I am working on Intranet web application. it has developed using Strust2 and run on the weblogic 12c server. application working on dev environment without any issue IE(11) and Edge(41) Microsoft browser.
But after deploying Production it only working IE(11).it doesn't work on Edge.we can launch login page after that but can't navigate on Edge.
Edge browser console we can see below error.
CSP14321 Resource violated directive 'default-src 'self'' in Content-security-Policy:inline script https://xx.xxx.x.xx/dms/login.action at line
19 column 30.Resource will be blocked
Note: Our Web Application supports work with IE11 and Edge.
I tried with the different approach but couldn't navigate from the login page
1.i remove the meta tags like
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
2.add meta tags like
<meta http-equiv="Content-Security-Policy" content="default-src 'self'"/>
above approach doesn't work.to change Content Security Policy no any configurations files in our application .plase help with this
This is the login page.
<%# taglib prefix="s" uri="/struts-tags"%>
<%# taglib prefix="sx" uri="/struts-dojo-tags"%>
<%# page contentType="text/html;charset=UTF-8" language="java"%>
<%# page import="tvm.ka.TvsGlobals"%>
<%# page errorPage="/tvs/ka/common/KvsCommonError.jsp"%>
<head>
<title><s:text name="title.login" /></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="<%=KvsConfigMgr.strCSS%>" type="text/css" />
<script language="JavaScript" src="<%=kvsConfigMgr.strJS%>KvsCommon.js">
</script>
<script language="JavaScript" src="<%=KvsConfigMgr.strJS%>KvsLogin.js">
</script>
<script language="JavaScript">
var MSG_USERID = "<s:text name="msg.login.userid"/>";
var MSG_PASSWORD = "<s:text name="msg.login.password"/>";
</script>
</head>
<body background="<%=KvsConfigMgr.strLstBg%>" leftmargin="0"
topmargin="0" marginwidth="0" marginheight="0" onLoad="focusFirst()">
<s:form action="login" method="POST">
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td valign="top"><div align="center">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2" background="<%=KvsConfigMgr.strIMG%>topbg.gif">
<table width="100%" border="0" cellpadding="0" cellspacing="0"
background="<%=KvsConfigMgr.strIMG%>topbg.gif">
<tr>
<td><table width="100%" border="0" cellpadding="0"
cellspacing="0">
<tr>
<td width="13%"
background="<%=KvsConfigMgr.strIMG%>logo_bg.jpg"><img
src="<%=KvsConfigMgr.strIMG%>default_01.jpg" width="133"
height="77" alt=""></td>
<td width="87%"
background="<%=KvsConfigMgr.strIMG%>top_bg.jpg"><img
src="<%=KvsConfigMgr.strIMG%>default_02.jpg" width="645"
height="77" alt=""></td>
</tr>
</table></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<div align="left"></div></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td width="40%"> </td>
<td class="errorText">
<%-- <s:if
test="${not empty ${KmsGlobals.GLOBAL_ERR_MSG_LIST}.null}"
scope="request">
<s:iterator value="${KmsGlobals.GLOBAL_ERR_MSG_LIST}.null"
indexId="count" id="errMsg" type="java.lang.String">
<s:property value="errMsg.null" />
<br>
</s:iterator>
</s:if> --%> <s:if test="hasActionErrors()">
<div class="error">
<s:actionerror />
</div>
</s:if>
</td>
</tr>
<tr>
<td class="bodyTextSmall"> </td>
<td>
<table border="0" cellspacing="0" cellpadding="5">
<tr>
<td>To begin, please key in your user id and<br />password
below, and click on login.
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td> </td>
<td>
<table border="0" cellspacing="0" cellpadding="5">
<tr>
<td><img src="<%=KvsConfigMgr.strIMG%>tran.gif" width="80"
height="8" /></td>
<td><img src="<%=KvsConfigMgr.strIMG%>tran.gif" width="150"
height="8" /></td>
<td><img src="<%=KvsConfigMgr.strIMG%>tran.gif" width="80"
height="8" /></td>
</tr>
<tr>
<td class="bodyTextBold">User ID</td>
<td><input type="text" name="strUserId" size="20"
tabindex="1" /></td>
<td> </td>
</tr>
<tr>
<td class="bodyTextBold">Password</td>
<td>
<%--
<!--html:password property="strPasswd" autocomplete="off" size="20" tabindex="2"/ -->
I-WAPT-8 Password autocomplete attribute was enabled
Application Penetration Test Fix
--%> <input type="password" name="strPasswd"
autocomplete="off" size="20" tabindex="2" />
</td>
<td><input class="button" style="width: 70px" type="submit"
value="Login" onClick="return validate()" tabindex="3" /></td>
</tr>
<tr>
<td colspan="3" class="errorText">For authorised use only.
Unauthorised use is strictly prohibited.</td>
</tr>
</table>
</td>
</tr>
</table>
<%-- <s:hidden name="dispatch" value="login" /> --%>
<input type="hidden" name="dispatch" value="login" />
</s:form>
<div id="version-tag"><%=KvsConfigMgr.strVer%></div>
<style>
#version-tag {
position: absolute;
bottom: 0;
left: 0;
FONT-WEIGHT: normal;
FONT-SIZE: 11px;
COLOR: rgba(0, 0, 0, 0.6);
FONT-FAMILY: Arial, Verdana, Helvetica, sans-serif;
vertical-align: text-top;
border-color: #0085E0;
}
</style>
</body>
Along with content-security-policys you cannot use inline Javascript like onLoad="focusFirst()" and
<script language="JavaScript">
var MSG_USERID = "<s:text name="msg.login.userid"/>";
var MSG_PASSWORD = "<s:text name="msg.login.password"/>";
</script>
https://developer.chrome.com/extensions/contentSecurityPolicy#JSExecution
Inline Javascript code will simply not be executed.
Instead, create a Javascript file with this code:
document.addEventListener('load', focusFirst);
Make sure focusFirst function is known at that point.
Depending on what focusFirst does it might improve the performance if you instead attach the listener to the DOMContentLoaded event (which triggers when all HTML is parsed, whereas load only triggers much later once all linked resources like images etc. have been loaded).
Please note that inline <script> blocks will also not be executed with a content security policy active.
Related
I am taking in the data in from an sql statement and throwing it into a table.
I am trying to create a subtotal for the table that I can then send to a checkout page using a java servlet. Problem is that I am having issues getting the subtotal working after going through several examples on stackoverflow.
Thank you for your time.
<html>
<head>
<link rel="stylesheet" href="resources/css/main.css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="resources/scripts/jquery-1.8.2.min.js"></script>
<title>Home Page</title>
</head>
<body>
<br>
<br>
<script>
(function (global) {
document.getElementById("output").value = global.localStorage.getItem("mySharedData");
}(window));
</script>
<sql:setDataSource var="snapshot" driver="com.mysql.jdbc.Driver"
url="jdbc:mysql://localhost:3306/sakila"
user="root" password="nbuser"/>
<sql:query dataSource="${snapshot}" var="result">
Select F.title, (F.rental_rate * F.rental_duration) as 'Price'
from cart as C
join cartofitems as CI
on CI.cart_id = C.cart_id
join film as F
on CI.film_id = F.film_id
</sql:query>
<div align="center">
<table width="850" style="BACKGROUND-COLOR: #FFFFFF;" border="1">
<tr>
<td align="center">
<img src="images/cart.png">
</td>
</tr>
<tr>
<td align="center" colspan="3">
<table width="650">
<tr>
<td>
<div align="justify" style="color:#3e160e;">
This is a custom HTML header. This header may contain any HTML code, text,
graphics, active content such as dropdown menus, java, javascript, or other
content that you would like to display at the top of your cart pages. You create
custom HTML header yourself and specify its location in the CustomCart Administrator.
Also note the custom wallpaper (brown striped background), this is uploaded via the
administrator. You may change the wallpaper any time you wish to change the look of
your cart.
</div>
</td>
</tr>
</table>
</td>
<tr>
<tr>
</tr>
</table>
</div>
<div align="center">
<form action="checkout.jsp" method="post" border="">
<table width="850" border="1" class="cart">
<thead>
<tr>
<th>Action</th>
<th>Movie Title</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<c:forEach items="${result.rows}" var="cart">
<tr>
<td>Delete</td>
<td><c:out value="${cart.title}" /></td>
<td class="price"><c:out value="${cart.Price}" /></td>
</tr>
</c:forEach>
<tr class="totalColumn">
<td colspan="2" align="right" ><b>Subtotal: </b></td>
<td align="right" ><b><span id="subtotal"></span></b></td>
<script language="javascript" type="text/javascript">
var tds = document.getElementById('cart').getElementsByTagName('td');
var sum = 0;
for (var i = 0; i < tds.length; i++) {
if (tds[i].className == 'price') {
sum += isNaN(tds[i].innerHTML) ? 0 : parseInt(tds[i].innerHTML);
}
}
document.getElementById('price').innerHTML += '<tr><td>' + sum + '</td><td>total</td></tr>';
</script>
</tr>
</tbody>
</table>
<table width="850" border="1">
<tr>
<div style="width:650px;">
<button type="submit" name="your_name" value="totalCost" class="loginbtn">Checkout Cart</button>
</form>
<p><form action="faces/index.xhtml" method="post">
<button type="submit" name="your_name" value="your_value" class="adminloginbtn">Back To Search</button>
</form>
</div>
</tr>
</tbody>
</table>
</body>
</html>
On my login page I want to display a simple table row that says loading. I put a simple script tag with a jquery function in the aspx page to show the table row when the login button is clicked. Everything works fine the first time the user clicks the login button. The login button and table row to display are inside an UpdatePanel container.
When the user clicks login again , with good or bad credentials, the table row does not display.
Here is my code on the page:
<%# Page Language="c#" AutoEventWireup="false" StylesheetTheme="Theme1" Codebehind="Default.aspx.cs" Inherits="....Default" %>
<%# MasterType VirtualPath="~/..." %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<style type="text/css" media="screen">
* {margin:0;padding:0}
html,body{height:100%}
</style>
<script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
</head>
<div style="height: 100%; width: 100%; display: table; vertical-align: middle;">
<table cellpadding="0" cellspacing="0" border="0" style="height: 100%" width="100%">
<tr>
<td valign="middle" align="center">
<form id="frmLogin" runat="server" autocomplete="off">
<asp:scriptmanager ID="Scriptmanager1" runat="server"></asp:scriptmanager>
<asp:Panel ID="Panel1" runat="server" Width="371px" BackColor="white" BorderColor="Black" BorderStyle="Solid" BorderWidth="1px">
<asp:UpdatePanel ID="upLogin" runat="server" RenderMode="block" UpdateMode="always">
<ContentTemplate>
<table cellpadding="0" width="100%" style="background-color: white" cellspacing="0" border="0">
<tr>
<td colspan="2" align="right" class="reportHeader" style="height: 30px; padding-right: 10px">
<%= this.VersionName %>
</td>
</tr>
<tr>
<td valign="middle" style="height: 140px" class="Yellow">
<table cellpadding="0" cellspacing="0" border="0" style="height: 100%" width="100%">
<tr>
<td colspan="3"><b>Please Log In:</b></td>
</tr>
<tr>
<td>Username:</td>
<td><b><asp:TextBox Width="150" ID="txtUserName" runat="server" AutoCompleteType="Disabled" /></b></td>
</tr>
<tr>
<td>Password:</td>
<td>
<asp:TextBox Width="150" TextMode="password" ID="txtPassword" runat="server" AutoCompleteType="Disabled" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2" valign="middle" align="left" style="height: 30px; background-color: #f2dcac;">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="left" valign="bottom" style="padding-left: 5px">
<a class="menuLink" href="email.aspx">I forgot my password</a></td>
<td align="right" valign="bottom">
<asp:Button Text="Log In" CssClass="actionButton" ID="btnLogin" runat="server" onclick="BtnLoginClick1" /></td>
</tr>
</table>
</td>
</tr>
<tr id="trInvalidLoginMessage" visible="false" runat="server">
<td align="center" colspan="2" style="background-color: #f2dcac;">
<font class="pageError">Invalid login. Please try again.</font>
</td>
</tr>
<tr id="trLoading" visible="False" style="display: none; text-align: center">
<td align="center" colspan="2" style="background-color: #f2dcac">
<font class="pageBodyBold"><h3>Loading...</h3></font>
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
</form>
</td>
</tr>
</table>
</div>
<script type="text/javascript" language="javascript">
Sys.Application.add_load(page_load);
function page_load() {
var txt = $get('<%= this.txtUserName.ClientID %>');
txt.focus();
}
$(function () {
if (<%= Page.IsPostBack.ToString().ToLower() %> == false) {
$("#trLoading").css("display", "none");
$("#loading-div").css("display", "none");
}
$("#btnLogin").click(function () {
if ($("#trLoading").css("display") == 'none') {
$("#trLoading").css("display", "inline");
}
else {
$("#trLoading").css("display", "none");
}
});
});
</script>
</body>
</html>
Is it possible to get a jquery click event handler to work on the login button?
After some more searching, I found a solution posted in this answer.
Link to question
The solution was to use the OnClientClick attribute for the button and also disable submit behavior.
Code for button:
<asp:Button Text="Log In" CssClass="actionButton" ID="btnLogin" runat="server" onclick="BtnLoginClick1" OnClientClick="if (!Page_ClientValidate()){ return false; } this.disabled = true; this.value = 'Logging in...';" UseSubmitBehavior="False"/>
I am trying to submit form from one jsp to an another jsp by using html tag as below :
<%# 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>
<title>SendIt Bank</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link href="css/bank.css" rel="stylesheet" type="text/css">
<script language="JavaScript" type="text/JavaScript">
function checkUserInListAndSubmit() {
alert("hello");
document.getElementById('userLoginForm').submit();
//document.forms["userLogin"].submit();
}
</script>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<form name="userLoginForm" id="userLoginForm" action="accountdetails.jsp" method="POST">
<table width="202" height="154" border="0" align="center" cellpadding="5" cellspacing="0" bgcolor="#CCCCCC">
<tr>
<td colspan="2" valign="bottom" class="headermain"> </td>
</tr>
<tr>
<td colspan="2" valign="bottom" class="headermain"><div align="center" class="style4">Online
Banking Login</div></td>
</tr>
<tr>
<td class="loginbox style5">User ID:</td>
<td class="loginbox"><input name="userID" type="text" id="userID" size="12" maxlength="20"></td>
</tr>
<tr>
<td width="68" class="loginbox style5">Password: </td>
<td class="loginbox"><input name="password" type="password" id="password" size="12" maxlength="20"></td>
</tr>
<tr>
<td> </td>
<td width="103"><div align="left"><img src="images/btn-signin.png" alt="Sign In" name="submit" width="60" height="20" border="0" align="right"></div></td>
</tr>
<tr>
<td colspan="2"><p align="center"><span class="style2"><a href="FYP1.html">Forgot
your Password?</a><br>
</span> </p></td>
</tr>
</table>
</form>
</body>
</html>
When i click on href link, in my case i am clicking on a image. The contol goes to javascript function (). But, the form isn't getting submitted. When i try to debug in chrome i see this error in console.
Uncaught TypeError: object is not a function index.jsp:12
checkUserInListAndSubmit index.jsp:12
(anonymous function)
The error is at line document.getElementById('userLoginForm').submit();
Kindly help me resolving this and submit the form.
Any reason u aren't using input type="submit"?
Anyways this is your answer
<form id="userLoginForm'" action="" method="post">
<img src="images/btn-signin.png" alt="Sign In" name="submit" width="60" height="20" border="0" align="right" onclick="document.getElementById('userLoginForm'').submit();">
</form>
Also
onclick="parentNode.submit();
should work
From your markup, remove/rename the attribute
name="submit"
That is,
<tr>
<td> </td>
<td width="103"><div align="left"><img src="images/btn-signin.png" alt="Sign In" width="60" name="some-other-name" height="20" border="0" align="right"></div></td>
</tr>
Check this answer for more information.
Cheers!
Try with this anchor tag,
<a href="javascript:{}" onclick="document.getElementById('userLoginForm').submit();">
Or if you want to do more as js function,
<a href="javascript:{}" onclick="checkUserInListAndSubmit();return false;">
Updated Answer
specify your anchor with id, e.g;
<a href="#" id="mylink">
write js function for anchor tag onclick listener
document.getElementById("mylink").onclick = function() {
//do other coding here
document.getElementById("userLoginForm").submit();
return false;
}
I'm trying to add one picture to the left side of this page I know basic of HTML. Any suggestion?
Following is not woking? Do I need two container or something wrong?
<?
session_start();
$_SESSION['usertmp'];
$_SESSION['emailtmp'];
if(strlen($_SESSION['usertmp'])<1 ||is_null($_SESSION['usertmp']))
{
$_SESSION['usertmp'] = "";
}
if(strlen($_SESSION['emailtmp'])<1 ||is_null($_SESSION['emailtmp']))
{
$_SESSION['emailtmp'] = "";
}
?>
<!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>Show Information</title>
<style type="text/css">
html, body {height:100%; margin:0; padding:0;}
#page-background {position:fixed; top:0; left:0; width:100%; height:100%;}
#content {position:relative; z-index:1; padding:10px;}
#
</style>
</head>
<body>
<div id="page-background"><img src="images/main.jpg" width="100%" height="100%" alt="Smile"></div>
<left>
<div class="container" style="width:800px" id="content">
<div class="header"><img src="images/logoo.png" width="177" height="61" longdesc="main.php" />
</left>
<center>
<div class="container" style="width:800px" id="content">
<div class="header"><img src="images/logoo.png" width="177" height="61" longdesc="main.php" /> <!-- end .header --></div>
<center>
<div class="content" style="background-image:url(); height:427px; color: #FFF;vertical-align:middle">
<table width="300" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="">
<tr>
<form name="form1" method="post" action="checklogin.php">
<td>
<table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="">
<tr>
<td colspan="3"><strong>Member Login </strong></td>
</tr>
<tr>
<td width="78">Username</td>
<td width="6">:</td>
<td width="294"><input name="myusername" type="text" id="myusername"></td>
</tr>
<tr>
<td>Password</td>
<td>:</td>
<td><input name="mypassword" type="password" id="mypassword"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td><input type="submit" name="Submit" value="Login"></td>
</tr>
</table>
</td>
</form>
</tr>
</table>
<table width="300" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="">
<tr>
<form name="form2" method="post" action="signup.php">
<td>
<table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="">
<tr>
<td colspan="3"><p> </p>
<p><strong> Sign Up Here</strong></p></td>
</tr>
<tr>
<td width="78">Username</td>
<td width="6">:</td>
<td width="294"><input name="myusername" type="text" id="myusername" value = "<? echo $_SESSION['usertmp'] ?>"></td>
</tr>
<tr>
<td>Enter Password</td>
<td>:</td>
<td><input name="mypassword" type="password" id="mypassword"></td>
</tr>
<tr>
<td>Confirm Password</td>
<td>:</td>
<td><input name="mypassword2" type="password" id="mypassword2"></td>
</tr>
<tr>
<td>Email id</td>
<td>:</td>
<td><input name="myemail" type="text" id="myemail" value = "<? echo $_SESSION['emailtmp'] ?>"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td><input type="submit" name="Submit" value="Sign Up"></td>
</tr>
</table>
</td>
</form>
</tr>
</table>
</div>
</center>
</center>
</body>
</html>
There are many ways you could achieve what you are looking to do. You should try to simplify your markup if you can. If you want to keep your login credential table in the middle. Here is a way to do it using 3 main divs as 32.98% width columns. Float them left and use the first column for the pic that you want on the left. Here it is in jsbin. Of course the images aren't working bc it doesn't have access to the proper path http://jsbin.com/muxac/1/edit
<!doctype html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="styles/main.css">
<style>
.col-1, .col-2, .col-3 {
width: 32.98%;
float:left;
}
</style>
</head>
<body>
<div class="container">
<header class="header">
</header>
<div class="row">
<div class="col-1">
<div class="header"><img src="images/logoo.png" width="177" height="61" longdesc="main.php" /></div>
</div> <!-- End of COLUMN 1 -->
<div class="col-2"> <!-- Start of COLUMN 2 -->
<div class="header"><img src="images/logoo.png" width="177" height="61" longdesc="main.php" />
<table width="300" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="">
<tr>
<form name="form1" method="post" action="checklogin.php">
<td>
<table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="">
<tr>
<td colspan="3"><strong>Member Login </strong></td>
</tr>
<tr>
<td width="78">Username</td>
<td width="6">:</td>
<td width="294"><input name="myusername" type="text" id="myusername"></td>
</tr>
<tr>
<td>Password</td>
<td>:</td>
<td><input name="mypassword" type="password" id="mypassword"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td><input type="submit" name="Submit" value="Login"></td>
</tr>
</table>
</td>
</form>
</tr>
</table>
<table width="300" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="">
<tr>
<form name="form2" method="post" action="signup.php">
<td>
<table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="">
<tr>
<td colspan="3"><p> </p>
<p><strong> Sign Up Here</strong></p></td>
</tr>
<tr>
<td width="78">Username</td>
<td width="6">:</td>
<td width="294"><input name="myusername" type="text" id="myusername" value = "<? echo $_SESSION['usertmp'] ?>"></td>
</tr>
<tr>
<td>Enter Password</td>
<td>:</td>
<td><input name="mypassword" type="password" id="mypassword"></td>
</tr>
<tr>
<td>Confirm Password</td>
<td>:</td>
<td><input name="mypassword2" type="password" id="mypassword2"></td>
</tr>
<tr>
<td>Email id</td>
<td>:</td>
<td><input name="myemail" type="text" id="myemail" value = "<? echo $_SESSION['emailtmp'] ?>"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td><input type="submit" name="Submit" value="Sign Up"></td>
</tr>
</table>
</td>
</form>
</tr>
</table>
</div> <!-- End of COLUMN 2 -->
<div class="col-3"> <!-- COLUMN 3 -->
<!-- You can leave this empty if you want -->
</div>
<div class="row">
<div class="footer">
</div>
</div>
</div>
</div>
</body>
</html>
To position the picture You can use CSS. Here is the code(Insert it in the style attribute of the html tag):
position:absolute;left:0px;top:0px/*Here inserte the necesary pixels to position the picture*/
If what you want is just the header image to be at the top left, put inside the <style> this: .header img {display: inline-block; float: left;}
In the code i have tried to install the date picker inside a table but i have no idea how to insert .pls anyone help me to rectify the issue.
To be inserted to this tbl
<table id="TblDate" runat="server">
<tr>
<td width="50Px">
<asp:Label ID="lblDate" runat="server"></asp:Label>
</td>
<td width="150Px">
//here i want the date picker
</td>
<td width="40Px">
<asp:Image ID="Image1" runat="server" />
</td>
</tr>
</table>
Code:
<div align='center'>
Select Date: <input type='text' id='sel' onclick='dispCal()' size=10 readonly='readonly' />
<img src='img/calendar.png' onclick='dispCal()' style='cursor: pointer; vertical-align: middle;' />
<table class='calendar' id='calendar' border=0 cellpadding=0 cellspacing=0>
<tr class='monthdisp'>
<td class='navigate' align='left'><img src='img/previous.png' onclick='return prev()' /></td>
<td align='center' id='month'></td>
<td class='navigate' align='right'><img src='img/next.png' onclick='return next()' /></td>
</tr>
<tr>
<td colspan=3>
<table id='dispDays' border=0 cellpadding=4 cellspacing=4>
</table>
</td>
</tr>
</table>
</div>
On a ASP.Net webforms you can use AjaxControlToolkit calendar.
But you can use a JqueryUI datepicker too.