I need to know how to load user control after the page is completely loaded
Incremental Page Display OR Lazy Load concept
typically like Pageflakes ?
This is called Ajax: http://www.w3schools.com/Ajax/ajax_intro.asp
To address your comment below, here is a (VERY SIMPLE) example of such a thing, using the jQuery library. http://jquery.com/
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
$("#content").load("/myajaxpage.htm");
});
</script>
</head>
<body>
<div id="content"></div>
</body>
</html>
This would download the myajaxpage.htm page after loading, and put the contents into the div with the id "content".
Related
I'm using a servlet to show images on page. The links looks like
http://webappname.com/getImage?p=imagename.jpg
But the resulting image in the browser tab shows
getImage (100x200)
I would like to output there more useful information like string, so how can I do it?
As the response is an image, it cannot contain additional information (such as the page title) as an HTML response could. One possible workaround to this would be to return a simple HMTL page with your image in it.
You could trigger then trigger the regular download (the existing behaviour) with an additional URL parameter. So for example:
http://webappname.com/getImage?p=imagename.jpg
Would return this HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" src="img-dl-style.css">
<script type="application/javascript">
// JavaScript to trigger image download when #dlButton is clicked
</script>
<title>Full Image Name</title>
</head>
<body>
<div class="container">
<h1>Full Image Name</h1>
<img src="http://webappname.com/getImage?p=imagename.jpg&dl=1>
<button id="dlButton" type="button">Download this image</button>
</div>
</body>
</html>
Any direct access to this URL:
http://webappname.com/getImage?p=imagename.jpg&dl=1
Would return the image directly, complete with the default browser title.
To see this in action, take a look at Dropbox's shared file viewer. A link such as:
https://www.dropbox.com/s/qmocfrco2t0d28o/Fluffbeast.docx
Returns a full webpage with a preview of the shared file and a download button. Clicking the button triggers the download with this URL:
https://www.dropbox.com/s/qmocfrco2t0d28o/Fluffbeast.docx?dl=1
Hi I have a menu in aspx page which works finely. So, I create a asp page called classicmenu.asp which consists of this
<head>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$('#menu').load('Menuin.aspx');
});
</script>
</head>
<body>
<div id="menu" >
<label runat="server">afggh</label>
</div>
<label runat="server">asd</label>
</body>
</html>
Even here it works fine. I can see the menu . So, once include this in another asp page, I just get the labels defined in classicmenu.asp but not the menu i define in aspx page. So, can u guys help me out?
Where in the folder structure is the page that includes classicmenu.asp? If it's not in the same directory as Menuin.aspx, then the JS won't know where to find it when trying to load().
i want to access a javascript function which resides in a script file from another page with iframe.
my sample code :
Page from which javascript need to be accessed.
<iframe id="FRAMESET" src="default.htm" width="0%" height="0%">
<p>
Your browser does not support iframes.
</p>
</iframe>
default.htm
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="Scripts/main.js" type="text/javascript" />
</head>
<body>
</body>
</html>
main.js
function helloWorld() {
alert("hello World");
}
i want to access this function on main page. i tried document.getElementById('FRAMESET').contentWindow.helloWorld(); but gave me error "that document.getElementById('FRAMESET').contentWindow.helloWorld();" is not a function.
It's possible. You can do this in the page that contains the frame:
document.getElementById('FRAMESET').contentWindow.helloWorld();
It's impossible. All browsers (IE, FF, Chrome) now prevent js accessing to iframe content. Why don't you just load main.js into the main page?
I have one page from which i have to redirect to a page which is in some other application or can say in other domain.I want waiting screen till the page is loaded.I want to do it by jquery.Can any one help me-
blockUI would be an option
eg.
<html>
<head>
<meta http-equiv="refresh" content="3; URL=http://www.mydestination.com/">
<!-- script include for jQuery and blockUI -->
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
$.blockUI({
message: 'redirecting'
});
});
</script>
</body>
</html>
but if you want to keep the overlay on the redirected page while it is loaded, this would be only possible if you use eg. an iframe. but with that, you would have other problems eg. height, width of iframe
The Background
I run an ASP.NET site using Graffiti CMS for a local charitable/service organization.
The leaders of the organization want to start integrating a third-party back-end management system that exposes content as full HTML pages.
One of the pages, the officer list, uses inline script to load pictures or placeholders (depending on whether or not there is a picture for the given officer).
I've created a server-side proxy that enables loading the content from these pages using jQuery's .load() AJAX function.
I can display this content fine using an iframe, but that feels really kludgy, and if the size of the content changes, I may need to alter the size of the iframe to ensure it all displays (blech!).
The Problem
If I create a <div> in a Graffiti post, and use $("#divid").load(url) to load the content, the HTML content loads fine, but the inline script is stripped out, so neither the officer images nor the placeholders are displayed.
The Question
Understanding that the reason for the problem is that jQuery is almost certainly trying to protect against potentially bad stuff by removing the inline script before I load it into my DOM, is there a way using jQuery to grab this HTML and load it into my DOM that will preserve the script, but not open major security holes? I do trust the system from which I'm loading the content, if that makes a difference.
Suggestions? I'm looking to keep this as simple as possible...anything too complex, and I'm just as well off to stick with the iframe.
Thanks in advance!
#devhammer
There is an issue when you use document.write. If you have the ability to modify the source pages you can modify them to use the innerHtml technique instead.
To do so you would change something like this:
<div id="testDiv">
<script type="text/javascript">
document.write("<img src='image1.jpg' alt='' />");
</script>
</div>
To this:
<div id="testDiv">
<div>
<script type="text/javascript">
document.getElementByid('testDiv').innerHTML = "<img src='image1.jpg' alt='' />";
</script>
Doesn't work for me...
<!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>
<title></title>
</head>
<body>
<script src="Scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
var dynamic = 'begin <script type="text/javascript">alert("hello");<\/script> end';
$('#test').html(dynamic);
});
</script>
<div id="test"></div>
</body>
</html>
The alert box is showing.. but if you replace it with a document.write, nothing in the document.write appears... you have "begin end"
Hope this helps!
Try setting the HTML manually, like this:
$.get(url, function(htmlText) { $('#divid').html(htmlText); });
I'm pretty sure this will execute the scripts.