Why does my code not work? Shouldn't it print 222 to the element with ID p2?
<%# page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%#page import="java.io.*" %>
<!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>
<script type="text/javascript">
function compareData()
{
document.getElementById('p1').innerHTML = "111";
var inputs = document.getElemementsByTagName("input");
// why can't I display the "222" here??
document.getElementById('p2').innerHTML = "222";
}
</script>
</head>
<body>
<p id="p1"> a </p>
<p id="p2"> b </p>
<input type="button" onclick="compareData()" value="hello"/>
</body>
</html>
You have mis-spelled getElemementsByTagName. This results in a js error, thereby your code stops execution at that line.
Correct it as getElementsByTagName. Then your code would work fine.
Why you are using this? var inputs = document.getElemementsByTagName("input");
My fiddle
And you can use the way you are using like this : My fiddle but it was not working because Elements spelling is wrong document.getElemementsByTagName
It should be document.getElementsByTagName
You have a typo on this line:
var inputs = document.getElemementsByTagName("input");
What you want is probably this:
var inputs = document.getElementsByTagName("input");
It could be that the typo stops the execution of the script, and therefor the line after is never run.
Remove following line and it will work...
var inputs = document.getElemementsByTagName("input");
Related
I am defining a variable in scriptlet to get value from request headers, then we are using that variable c:set to set to variable to use in c:out .But i am not getting any value c:set variable, as a result c:out is giving result as ''.
please find the code snippet below and guide me if i am missing anything.
Code in jsp:
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%# 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=ISO-8859-1">
<title>DM</title>
<SCRIPT Language="JavaScript">
function submitform()
{
this.LoginForm.submit();
}
</SCRIPT>
</head>
<body onload="submitform()">
<%
String userName= request.getHeader("IV-USER");
System.out.println("name "+userName);
if (userName == null || userName.length()==0){
response.setHeader("IV-USER",userName);
response.sendRedirect("ULM.jsp");
}
%>
<c:set var="uName" value="<%=userName%>"/>
<p>Welcome1 ${uName}</p>
<form name="LoginForm" action="/ICDDMContent/STGDM.html" method="post">
<input type="hidden" name="UserId" value='<c:out value="${uName}"/>'/>
<!--
<input type="hidden" name="UserId" value="<%=userName%>" >
-->
<input type="hidden" name="Token" value="dummy">
<p>Welcome1 <c:out value="${uName}"/></p>
</form>
</body>
</html>
String userName= request.getHeader("IV-USER");
System.out.println("name "+userName);
if (userName == null || userName.length()==0){
response.setHeader("IV-USER",userName);
response.sendRedirect("ULM.jsp");
}
Is redundant piece of code, if userName is empty, you will just assign empty value to IV-USER header, if "ULM.jsp" is the same page as you've attached, and that redirect is just to set variable - here is your problem
How do I get a variable in an iframe from the parent if I do not know how many iframes are on the parent page and the order of the one in question. For instance, I know the iframe in question is the second one, so I can select windows.frames[1]. But if I didn't know know it was the second one, how would I select it by ID.
<!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=ISO-8859-1" />
<title>Testing</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js" type="text/javascript"></script>
<style type="text/css">
</style>
<script type="text/javascript">
$(function(){
$('#getValues').click(function(){
//This works, but I don't want to select the iframe by the number since I don't know it.
console.log(
window.frames[1],
window.frames[1].window,
window.frames[1].window.getMe
);
console.log(
window.frames['myIFrame'],
window.frames['myIFrame'].document,
window.frames['myIFrame'].window,
document.getElementById('myIFrame'),
document.getElementById('myIFrame').window
);
});
});
</script>
</head>
<body>
<button id="getValues">getValues</button>
<div><iframe src="otherIframe.html"></iframe></div>
<!-- iframe3_get.html only sets global variable getMe to something. -->
<div><iframe id="myIFrame" src="iframe3_get.html"></iframe></div>
</body>
</html>
In the bellow example, getM1 and getMe2 will be equal. This doesn't seem to be a very good answer, but it is the only one I have. If it is a bad answer and you elect to vote it down, please provide a better answer.
$('#getValues').click(function(){
var getMe1=window.frames[1].window.getMe;
for (var i = window.frames.length - 1; i >= 0; i--) {
if(window.frames[i].frameElement.id=='myIFrame'){
var getMe2=window.frames[i].frameElement.getMe;
break;
}
}
});
I am looking to build a webpage that submits into a database (.asp) but also calculates a percentage.
The percentage amount is 8%.
Ideally I want the user to type an amount in an input box (for example lets say £100)
Then underneath there is another input box which automatically caluates the £100 + 8% (so £108)
I haven't got a clue how to start so I haven't got any code
Live jsFiddle: http://jsfiddle.net/5mB3Q/
This is your jQuery:
$("#val").on('keyup', function(){
$("#incPerc").text(parseInt($(this).val())*1.08);
});
you might want to use a library to limit the input to digits only.
something like this: Limit Textfield Input to digits only
added the second input http://jsfiddle.net/5mB3Q/1/
and the round of two digits:
$("#val").on('keyup', function(){
var withPerc = parseFloat($(this).val())*1.08;
$("#incPerc").text(withPerc.toFixed(2));
$("#otherInput").val(withPerc.toFixed(2));
});
edit: ok, full code because of the comment:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-2.0.0.js" type="text/javascript"></script>
</head>
<body>
<form>
<input id="val">
<input id="otherInput">
</form>
<script type="text/javascript">
$(document).ready(function() {
$("#val").on('keyup', function(){
var withPerc = parseFloat($(this).val())*0.08;
$("#incPerc").text(withPerc.toFixed(2));
$("#otherInput").val(withPerc.toFixed(2));
});
});
</script>
</body>
</html>
You forgot the protocol when you linked the jQuery lib. (and doc.ready)
$('#output').text = (int)($('#input').text.Substring(0, $('#input').text.Length - 1)) * 1,08 + $('#input').text.Substring($('#input').text.Length - 1);
<!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>Untitled Document</title>
<script type="text/javascript">
//function del () {
var x= new Date ();
var date= x.getDate ();
var hours= x.getHours();
var minutes=x.getMinutes();
var sec= x.getSeconds();
document.write(minutes +":"+ sec )
if (minutes=="33"){
//alert ("time is over")
document.getElementById('airtel').removeChild(airtel);
}
//}
</script>
</head>
<body>
<div id="airtel">
<div id="vodafone">vodaphone</div>
<div id="idea">idea</div>
</div>
</body>
</html>
Using jQuery Library removes the pain from using Javascript for handling the DOM, i sugest you give it a try.
But if you just want that working in native Javascript, what you need to do is traverse to the parentNode and then remove the child you want.
var element = document.getElementById('airtel');
element.parentNode.removeChild(element);
Maybe you are better off using jQuery with it's remove method for this.
You should get the element of 'airtel' then remove it from it's parent, which is the Body tag.
var airtel= document.getElementById('airtel');
document.getElementsByTagName('body')[0].removeChild(airtel);
Hey all i am trying to use javascript with my jsp file as under:
JSP File:
<?xml version="1.0" encoding="UTF-8" ?>
<%# page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!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>title goes here</title>
<link rel="icon" href="scripts/assets/favicon.ico" type="image/x-icon"/>
<%--
Ajax code to refresh the main page's contents.
This ajax code is specific to the home page not
for all so it is kept outside the main script file.
--%>
<script type="text/javascript" src="scripts/AjaxRefresh.js"></script>
<script type="text/javascript" src="scripts/MainScript.js"></script>
<link rel="stylesheet" type="text/css" href="scripts/MainStyle.css" />
</head>
<body>
<div class="mainContainer">
<div class="header">
header
</div>
<div class="leftNavigation">
Home
<br/>
Home
<br/>
Home
<br/>
Home
<br/>
Home
<br/>
Home
<br/>
Home
<br/>
Home
</div>
<div class="mainContentArea">
Main Content Area
</div>
<div class="rightTabBar">
Right Tab Bar
</div>
<div class="footer">
Footer
</div>
</div>
</body>
</html>
and the MainScript.js file is as under:
window.onload = initAll();
function initAll(){
var navigationButton = document.getElementsByTagName("a");
for ( var int = 0; int < navigationButton.length; int++) {
if(navigationButton[int].className == "navigationButton")
navigationButton[int].onclick = animateLink;
}
}
function animateLink(){
this.className = "navigationButtonActive";
return false;
}
but when i tried to execute this code i found that javascript code is not working properly and with firebug i found the variable navigationBUtton is an empty array.
Actually i am from PHP background so don't know precisely the concepts of jsp so what sort of problem here is??
PS: I am using eclipse 3.5 with apache tomcat6 as web server in ubuntu 10.10 platform.
thanks :)
You're assigning the outcome of the function to the window.onload instead of letting it point to a function name.
Replace
window.onload = initAll();
by
window.onload = initAll;
or just do
window.onload = function() {
var navigationButton = document.getElementsByTagName("a");
for ( var int = 0; int < navigationButton.length; int++) {
if(navigationButton[int].className == "navigationButton")
navigationButton[int].onclick = animateLink;
}
}
See also:
window.onload documentation in MDC
Note that this problem is unrelated to JSP.