size of image in javascript - javascript

I am trying to find the size of file but it is display nothing please help me
<%# 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>
<style>
div {
padding: 1px;
border-bottom: ridge;
width: 600px
}
this function is use to check whether or not user enter a image.
</style>
<script language="javascript">
function checkImage() {
if (document.form2.path.value == "") {
alert("Enter path of Image");
return false;
}
return true;
};
this function is not working properly
here i am try to check the size of file but it is not
working
function checkSize(){
var images=document.form2.path.value;
if (images != "") {
var f =document.getElementById("loadImage").files[0];
alert(f.size);
return false;
}
}
</script>
</head>
<body>
<center>
<div>
<h2>Image Management Utility</h2>
</div>
</center>
<br>
<br>
<br>
<form name="form2" action="images" method="post" onsubmit="return checkImage()">
<table width="800" align="center">
<tr>
<td>Please select an image file (maximum size 1MB)</td>
</tr>
<tr>
<td><input type="file" name="path" id="loadImage" /></td>
<td align="right"><input type="submit" name="submit"
value="submit" onclick="return checkSize()" /></td>
</tr>
</table>
</form>
</body>
</html>

Related

HTML form and WWW prefix issue

When I use form action URL with 'www' prefix, by pressing the submit button (or enter key) the form does not work: submits but won't send any variables. It does work, however, with JS submit by clicking the magnifier, even though JS code does not affect the URL (at least as far as I know).
When I remove 'www' it works both ways. Any idea what the reason is behind this?
http://www.hasznaltfaiparigep.hu/fr/index2.php
I made a gray div above the form to display POST variables.
Here's my code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html>
<head>
<title>Bonjour! :)</title>
<meta http-equiv="content-language" content="hu" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="tabs.css">
<link rel="shortcut icon" href="images/favicon.ico?v=1.2">
<script>
function addElementAndSubmitForm(formName,actionUrl,elName,elValue) {
var form = document.forms[formName];
form.action = actionUrl;
var el = document.createElement("input");
el.type = "hidden";
el.name = elName;
el.value = elValue;
form.appendChild(el);
form.submit();
}
</script>
</head>
<body>
<div id="page-wrap">
<form name="myForm" method="POST" action="http://www.hasznaltfaiparigep.hu/fr/index2.php">
<div id="debug" style="border:solid 1px black;padding:10px;margin:10px;background:#ccc;color:#555;width:96%">
<font style="font-weight:bold">POST vars:</font>
<?php
if( count($_POST) > 0 ) {
echo "<br/><span style=\"padding-left:4px\"> ";
print_r($_POST); echo "</span>";
}
?>
</div>
<div style="float:left;">
Chercher un mot: <input type="text" id="cherfield" name="chercher" />
<img style="padding: 0 5px; margin: 0 0 -8px 0;" src="images/chercher.jpg" onClick="javascript:addElementAndSubmitForm('myForm','#','chercher',document.getElementById('cherfield').value);"/>
<br />
<input type="submit" value="envoi" />
</div>
<input type="hidden" name="hidden_input" value="whatever">
</form>
</div>
</body>
</html>

Pop-up is working but changing the main page as well

Function: Enter a phone number (ex: 555-555-5555) into a text field. The text field prints the number out flat (hidden by CSS). Then Javascript picks up that number by ID and splits it apart by the hyphens and injects the array split up into a FoneFinder URL search string to display the results from that site in a pop-up window.
Problem: The pop-up is working fine, however when I click on the link to spawn the link it opens in the main page as well as the pop-up. The main page should not change.
The pop-up code works fine on other pages and doesnt overwrite the main page. It has to be how the javascript is injecting the html link into the page that is messing it up, but I cant figure out why.
Any help or insights would be appreciated.
<!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" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<style>
#target_num_result {
display: none;
}
#target_num_search {
font-size: small;
}
</style>
<!-- NewWindow POP UP CODE -->
<script LANGUAGE="JavaScript">
function NewWindow(mypage, myname, w, h, scroll) {
var winl = (screen.width - w) / 2;
var wint = (screen.height - h) / 2;
winprops = 'height='+h+',width='+w+',top='+wint+',left='+winl+',scrollbars='+scroll+',resizable'
win = window.open(mypage, myname, winprops)
if (parseInt(navigator.appVersion) >= 4) { win.window.focus(); }
}
</script>
<!-- Script to read the target phone number and split it by hyphens and show a Search link to Fonefinder.net -->
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
$('#target_num').on('keyup', function() {
var my_value = $(this).val();
$('#target_num_result').html(my_value);
var arr = my_value.split('-');
$("#target_num_search").html(" <a href=http://www.fonefinder.net/findome.php?npa=" + arr[0] + "&nxx=" + arr[1] + "&thoublock=" + arr[2] + "&usaquerytype=Search+by+Number&cityname= title=FoneFinder onclick=NewWindow(this.href,'FoneFinderLookup','740','680','yes');>!BETA!FoneFinder Search!BETA!</a>");
});
});//]]>
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<table cellpadding="2" cellspacing="0" style="width: 100%">
<tr>
<td style="width: 180px">Phone #:</td>
<td><label> <input class="text" type="text" name="target_num" id="target_num" /></label><span id="target_num_result"></span><span id="target_num_search"></span></td>
</tr>
</table>
<label>
<input class="button" type="submit" name="submit" id="submit" value="Create" />
</label>
</form>
</body>
</html>
what you need to add is the following:
$('#target_num_search').on('click', 'a', function (event) {
event.preventDefault();
var url = $(this).attr('href');
NewWindow(url,'FoneFinderLookup','740','680','yes');
})
This way you can remove the onclick attribute and move the function call to js. See the working jsfiddle
you should return false for prevents default action to go link 'href' when onlick event.
(please notes , - comma operator to whatever Function returns... It's just hack. don't use.)
BTW,
<!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" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<style>
#target_num_result {
display: none;
}
#target_num_search {
font-size: small;
}
</style>
<!-- NewWindow POP UP CODE -->
<script LANGUAGE="JavaScript">
function NewWindow(mypage, myname, w, h, scroll) {
var winl = (screen.width - w) / 2;
var wint = (screen.height - h) / 2;
winprops = 'height='+h+',width='+w+',top='+wint+',left='+winl+',scrollbars='+scroll+',resizable'
win = window.open(mypage, myname, winprops)
if (parseInt(navigator.appVersion) >= 4) { win.window.focus(); }
}
</script>
<!-- Script to read the target phone number and split it by hyphens and show a Search link to Fonefinder.net -->
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
$('#target_num').on('keyup', function() {
var my_value = $(this).val();
$('#target_num_result').html(my_value);
var arr = my_value.split('-');
var html_tpl = " <a href=http://www.fonefinder.net/findome.php?npa=" + arr[0] + "&nxx=" + arr[1] + "&thoublock=" + arr[2] + "&usaquerytype=Search+by+Number&cityname= title=FoneFinder onclick=\"return NewWindow(this.href,'FoneFinderLookup','740','680','yes'), false\" target='_blank'>!BETA!FoneFinder Search!BETA!</a>";
$("#target_num_search").html(html_tpl);
});
});//]]>
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<table cellpadding="2" cellspacing="0" style="width: 100%">
<tr>
<td style="width: 180px">Phone #:</td>
<td><label> <input class="text" type="text" name="target_num" id="target_num" /></label><span id="target_num_result"></span><span id="target_num_search"></span></td>
</tr>
</table>
<label>
<input class="button" type="submit" name="submit" id="submit" value="Create" />
</label>
</form>
</body>
</html>

jsonp : Uncaught SyntaxError: Unexpected token <

I need to load an aspx page that returns a string of text using jsonp since it is a cross domain call. The target page will be loaded inside a div tag and displayed as a modal window on the source page.
I am using a test form to pass 3 parameters that the target page expects, a submit button, very simple.
When I submit the page, I get an error message: Uncaught SyntaxError: Unexpected token <
When I click on the error I see the error points to this line:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
This is the first time I am working with json/ jsonp, and I am not sure how to fix this error. Is it possible to get some help to figure this out?
My invoking page:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
$(function () {
$("#dialog").dialog({
autoOpen: false,
modal: true,
title: "Details",
buttons: {
Close: function () {
$(this).dialog('close');
}
}
});
$("#btnSubmit").click(function () {
$.ajax({
type: "GET",
dataType: "jsonp",
crossDomain: true,
url: "http://localhost:81/order-error.aspx",
contentType: "application/json; charset=utf-8",
data: { 'order': $("#order").val(), 'site': $("#site").val(), 'env': $("#env").val() },
success: function (r) {
$("#dialog").html(r.d);
$("#dialog").dialog("open");
}
});
});
});
</script>
</head>
<body>
<table>
<tr>
<td>Name:</td>
<td><input type="text" id="order" value="" /></td>
<td><input type="text" id="site" value="" /></td>
<td><input type="text" id="env" value="" /></td>
</tr>
<tr>
<td><input type="button" id="btnSubmit" value="Submit" /></td>
</tr>
</table>
<div id="dialog" style="display: none">
</div>
</body>
</html>
My target/ response page (order-error.aspx):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<style type="text/css">
body {
margin: 0;
padding: 0;
font-size: 11px;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
#content {
width: 100%;
display: inline-block
}
.label {
position:relative;
float:left;
top:0;
margin-right:5px;
}
</style>
</head>
<body>
<div id="content">
<div class="order">
<div class="label">Web Order#: </div>
<div id="orderno" runat="server" class="value"></div>
</div>
<div class="error">
<div class="label">Message: </div>
<div class="value">
<asp:Label ID="lblOrderError" runat="server" Visible="false"></asp:Label></div>
</div>
</div>
</body>
</html>
And the code behind:
Partial Class order_error
Inherits System.Web.UI.Page
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
Dim siteKey As String = String.Empty
Dim orderId As String = String.Empty
siteKey = Request.QueryString("site").Trim
orderId = Request.QueryString("order").Trim
Me.lblOrderError.Text = Functions.GetAXErrorMessage(siteKey, orderId)
Me.orderno.InnerText = orderId.Trim
lblOrderError.Visible = True
End Sub
End Class
The output html of order-error.aspx:
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<div id="content">
<div class="order">
<div class="label">Web Order#: </div>
<div id="orderno" class="value">A1G759</div>
</div>
<div class="error">
<div class="label">Message: </div>
<div class="value">
<span id="lblOrderError"><Fault xmlns="http://schemas.microsoft.com/dynamics/2008/01/documents/Fault">
<Code />
<Reason>
<Text xml:lang="EN-US">User is not authorized for this Endpoint.</Text>
</Reason>
</Fault></span></div>
</div>
</div>
<!-- Visual Studio Browser Link -->
<script type="application/json" id="__browserLink_initializationData">
{"appName":"Chrome","requestId":"757708942b1d4af892b199f3590d85f5"}
</script>
<script type="text/javascript" src="http://localhost:63737/17a3dfffdc8f48ad9496d260bd296120/browserLink" async="async"></script>
<!-- End Browser Link -->
</body>
</html>
The error is clearly caused by your AJAX call return HTML instead of JSON.
In the success handler you have $("#dialog").html(r.d);. Here you try to parse the output of the call (r) to an object (r.d forces this), which fails for obvious reasons.
You should return JSON from your AJAX method, possibly using an HTTP handler or WebAPI.

hide div tag in jsp 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>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Welcome</title>
<script type="text/javascript">
$(document).ready(function()
{
if()==null)
{
}
}
);
</script>
</head>
<center>
<%# include file="Head.jsp" %>
</center>
<body>
<div id="tempDiv">
<h1>Message : ${message}</h1>
<h1>Author : ${author}</h1>
</div>
<a href='<c:url value="/j_spring_security_logout" />' > Logout</a>
<div align="center">
<table class="table1">
<tr>
<td align="center" width="800" height="400"><font size="10">
Welcome </font></td>
</tr>
</table>
</div>
</body>
</html>
How to hide div tag when $message value not come.
i want to hide my div tag. in jsp page. when user click on home page.
i tried here javascript code but did not get any answer to how to user jsp element in javascript.
or any code which usefull to hide div tag in my case do suggest. thank u....
Try this
<c:if test="${empty message}">
</c:if>
<c:if test="${not empty message}">
<div id="tempDiv">
<h1>Message : ${message}</h1>
<h1>Author : ${author}</h1>
</div>
</c:if>
You need to check if the variable is empty and depending on that print out on the html page...hope it works
or another way
<c:choose>
<c:when test="${empty message}">
</c:when>
<c:otherwise>
<div id="tempDiv">
<h1>Message : ${message}</h1>
<h1>Author : ${author}</h1>
</div>
</c:otherwise>
</c:choose>

How to convert javascript unicode notation code to utf-8?

Is there a command line tool or online service that can convert javascript unicode notation code to utf-8?
E.g. I got this json code, but it is hard to edit in common text editor.
{"name":"leon zhang","city":"\u4e0a\u6d77"}
I want to convert it to:
{"name":"leon zhang","city":"上海"}
You use the below javascript function to convert unicode to utf-8
function encode_utf8( s ){
return unescape( encodeURIComponent( s ) );
}( '\u4e0a\u6d77' )
You can also try it out in firebug console. It works.
<!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=gb2312" />
<title>UTF-8 To Unicode</title>
<style type="text/css">
<!--
td {
height: 24px;
line-height: 24px;
}
#content {
margin-top: 2px;
}
-->
</style>
</head>
<script type="text/javascript">
function encodeGB2312(){
var c = document.all.content.value;
var re = /(%)+/g;
var result = escape(c);
document.all.content.value = result.replace(re, "\\");
document.all.content.focus();
document.all.content.select();
}
function clearContent(){
document.all.content.value = "";
document.all.content.focus();
}
</script>
<body>
<h3 align="center">UTF-8 To Unicode</h3>
<table width="600" border="1" cellspacing="0" cellpadding="0" align="center" style="text-align:center;">
<tr>
<td>Input what you want to convert:</td>
<td><input type="text" name="content" id="content" size="50"/></td>
</tr>
<tr>
<td colspan="2">
<input type="button" name="encoding" value="Start Conversion" onclick="encodeGB2312()"/>
<input type="button" name="clear" value=" Cancel" onclick="clearContent();"/></td>
</tr>
</table>
</body>
</html>
This is a sample of convert utf-8 to unicode, do it in turn.

Categories

Resources