RFI - Include HTML Fragment On A Page - Prototype.js ?
Jan 29, 2009
I'm trying to embed an HTML fragment from one web page into another web page, using AJAX (as the fragment will change frequently). I'm using prototype.js for AJAX.
I've managed to fetch the HTML content of the slave page, but I can't figure out how to get just the part I want from the XML string returned in the AJAX request. The prototype.js AJAX function just returns a text sttring that I need to parse...but how?
Child Page: hello.html
Code HTML4Strict:
I want to include the <h1>Hello</h1> in the parent page.
Parent page: demo.html
Code JavaScript:
Obviously it's the fragment = resultDoc.getElementByClassName( source_fragment_name ); part that I'm having difficulty... It may not even be the right function - HELP.
The resultDoc=parser.parseFromString(transport.responseText,"text/xml"); seems to work, because the subsequent alert() works fine, but how do I get the page fragment identified by the source_fragment_name.
The alert("Fragment = " + fragment ); never happens, so the previous line has serious problem.
So, just to clarify, I simply want to parse the content out of one page, and embed it into another, in real-time, using AJAX.
View 4 Replies
ADVERTISEMENT
Jul 5, 2009
A question for the experts - let me first say that I'm not a coder, but I'm sufficiently competent to mess around with somebody elses code!
This is what I need:
I'm developing a website for a private railway, and wish to display a 'today's trains' panel on the front page of the site - there are up to twenty timetable diagrams, each of which has its own small html page file.
I need to figure a way of calling a different timetable panel to be displayed according to day of the year (ensuring that the correct timetable is displayed each day). Obviously I have a copy of the complete timetable, and it seems I need some code that will call a particular page according to what's happening that day.
Does anybody have any idea how a simpleton like me can set this up?
View 3 Replies
View Related
Dec 20, 2009
I have recently worked on a flash based learning course and built functionality where users throughout the course can type in their own notes based on the course, and they can revisit these everytime they launch the course, the functionality is simply using flash cookies to store the notes on the users machine. I wanted to build functionality so that they could then save these notes to their hard disk and e-mail them on. To do this I call a javascript function from flash which opens a new webpage, passes through the notes from flash and uses document.write to write the notes to the new webpage. Then the user Saves (as web page html only) to save a copy to their machine.
The problem is I want to do this web page up a bit more, add graphics etc. but if I save as web page html only it won't include any images I add to the html page, and if I change it so that they save as (Web Page Complete) rather than write the webpage out with the notes it will write the webpage with the code document.write(string) but as this is on the users hard disk now string will be undefined as it no longer run alongside the course. Is their any other way anyone can think of doing this type of functionality, I am trying to stay away from using PHP
View 1 Replies
View Related
Jan 5, 2012
A REALLY simple example, surprising to me this doesn't work...
This is my php code:
And here the html from which the php-script is called:
Here's supposed to be the output: <div class="output" id="output">test</div>
The text "test" inside the div gets replaced by nothing. and if i use the line i commented out instead of " $('.output').html(data)", i get the following output: "[object XMLDocument]"
Btw really susprised to see a forum on a website like this without proper code-tags with monospaced font...
View 16 Replies
View Related
Feb 7, 2010
I have a login button which takes the user to the login page. Now... this to me seems like a slow way of logging in. I would like users who have javascript enabled to click the login button. Instead of them being forwarded to the login page, I want the login form to magically pop up on top of the web page.
I can do this, I can creative a div, add the html and probably with a bit of trying - get the user to login. However I have a question. For maintainability, I want to have create a separate HTML file, how would I insert this into my page using Javascript?
Furthermore speed is crucial, is there a way to have this fragment load in the background on every page? I am not sure what would be best, i just don't want a second or two wait when the button is pressed. Basically - in short - how to I load this file fragment? What is the fastest way to do this?
View 3 Replies
View Related
Oct 19, 2010
<html>
<head>
<script type='text/javascript' src='jquery-1.4.2.js'></script>
<script type='text/javascript'>
$(document).ready(function(){
[Code]...
The above is a simplified example of the problem I'm facing. I could merge functions into one big self-referencing function (i.e. recursive function), but that's ugly and causes other problems (such as when insert form elements and wanting to harvest the user input afterwards). I considered declaring a variable in the top ".ready" function, and have all child functions stuff their HTML changes in it, but that seems to be a pain to keep track of and removes much of the value of using jQuery in the first place...
Is there a nice solution for this? To, after inserting HTML, somehow update the HTML state referred to by jQuery in the non-local scope(s)?
View 3 Replies
View Related
Apr 14, 2011
I tried this code in [URL]... jquery reports as 4 elements in firefox/chrome browsers correctly where as 0 in internet explorer 6.0 How do i fix this? Should I report this as bug?
View 1 Replies
View Related
Feb 13, 2011
I am loading an entire page in ajax, but I just want to load a fragment from it. Using the .load() function, you can do this by adding a selector after your url like 'getPage.php #myDiv' etc, how to do it using the .ajax method.
I did some googling and found this solution:
$.ajax({
url: 'AjaxTest2.htm',
data: {},
cache: false,
[Code].....
I'm trying to get the "d1" div to be populated with the contents of the "my2" div on the second page. I don't want to use the .load() function, I want to use the .ajax() function. I can get this to work if I just use: $('#d1').html(data); instead of $('#d1').html($(data).find('#my2')); but the former results in the entire html contents of the second page being placed into the "d1" div, and I only want the fragement.
View 6 Replies
View Related
Dec 10, 2010
Is there a way to load more than one html fragment using .load()? That is, I want my homepage to pull in multiple pages of content into the main page so that I can create a one-page site that slides vertically.
An example of what I've got is
$(document).ready(function(){
$('#footer').load('about.html #content');
$('#footer').load('locations.html #content');
$('#footer').load('contact.html #content');
});
Which of course only loads the first about.html page's #content into the #footer of the home page.
View 3 Replies
View Related
Nov 17, 2011
I am just wondering if jQuery has to be included within every .html file (considering the page does not use any CMS). Is it possible to include jQuery in index.html only but have it accessible in any other page?
View 1 Replies
View Related
Feb 28, 2001
I would like to know if I can include a html-file in a cell in a table by using javascript?
View 4 Replies
View Related
Apr 4, 2011
I'm a bit curious. how could we include an HTML file from jquery? Let's assume this story; Page 1:Has a link (once clicked it will execute something) Has a div (extracted from what it read from step above)
Page 2:
Only containing some Html elements
Such as Table only.
Page 3:
Only cointaining some image elements
Showing loading Gif file.
[Code]...
View 1 Replies
View Related
Jan 31, 2010
I created a page (index.html, including the embedded javascript) with a div loaded by an external html content. But in this new content the click function I defined in the index.html page does not work in the new content. Then my question is: do i need to include all javascript in the external html content?
View 1 Replies
View Related
Jan 26, 2007
I'm kinda stuck I would like to use a php include on my asp page.
View 5 Replies
View Related
May 27, 2009
I have been staring at this problem for too long and most likely missing a simple solution so I hope somebody can take my blindfold off and show me the way The markup (which comes from a CMS and I cannot change it) I am working with is akin to:
<div id="faq">
<p><strong class="open">FAQ 1</strong></p>
<p>FAQ 1 content lorem ipsem lorem ipsem ad infinitum</p>
[code]....
Notice how the second fo 3 FAQ sections has 2 paragraphs under the 'trigger' rather than 1? Therein lies my problem, because what I am doing with prototype.js is:
1.) Loop through page and collect all <p>'s
2.) do a .each iteration and attach an onclick event on $$('p strong.open') - assume this node for each iteration is now var 'trigger'
3.) run Element.hide() on trigger.next()
4.) in the onclick event, run Element.show() for trigger.next()
- If you are still following so far - my problem is that next() only shows/hides one single element and that is the <p> holding the content - which is fine except when there are 2 or even more <p>'s with content I need to act on. I;ve experimented with nextSiblings and adjacent() and I end up with too many nodes - basically every <p> in the entire document. I just want 'hide all P's after the trigger P up until the next p > strong.open
View 3 Replies
View Related
Jan 18, 2006
I have written a function that adds up numeric values from a multiple
textfields on a page and writes the sum to the total textfield. I would like
to move this from the page to an include so I can re-use on multiple pages.
How do i reference the active page in my script. This is an excerpt from the
function...
<script type="text/javascript">
function calctot(section)
{
if (section == "A")
{
/* Section A1 */
A = (document.frmSRData.A_BCI_RI_Public_Prod.value * 1) +
(document.frmSRData.A_BCI_RI_Public_Perf.value * 1);
document.frmSRData.A_BCI_RI_Public_SubTot.value = A;
B = (document.frmSRData.A_BCI_RI_Private_Prod.value * 1) +
(document.frmSRData.A_BCI_RI_Private_Perf.value * 1);
document.frmSRData.A_BCI_RI_Private_SubTot.value = B;
....
Do i need to pass a parameter to the function for the active page?
View 1 Replies
View Related
Aug 18, 2010
I know this is not supposed to be that way, but somehow that's the only way it works for me. First I include
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="fadeslideshow.js"></script>
where fadeslideshow.js is jQuery-based http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm
But I also want to use jQueryUI, so I have to include it:
[Code]...
View 2 Replies
View Related
Mar 20, 2007
I spent the best part of yesterday trying to get my form to be sent to the server however for the life of me I cannot figure out the problem. I haven't used prototype before but here is my code that I think should work perfectly fine,The php script works perfectly, i've entered test data into it and it makes a connection to the third party server using curl and then requests information that I get back i.e. the routing id comes back. But I cannot test the data using the form as the request isn't working for some reason.
View 3 Replies
View Related
Jul 20, 2005
I want to set up an Include page in a cell of a table. Then I want to be able to change which page is included on the fly as the user moves the mouse of the various links on the page. How can I do this?
THe include page was set up via FrontPage so it put it's Bot stuff in there, but if someone could tell me the "standard" way to use an include page and if there's a way using onMouseover etc to then change that and refresh it on the fly, that'd be great.
View 7 Replies
View Related
Jan 11, 2011
I have a JQuery script that gives a neat effect on the navigation and want to include a simple fading slideshow on the same page.Any script I have tried for the slideshow either uses JQuery or Mootools and it conflicts with the navigation script.Can anyone recommend a smooth fading slideshow that wouldn't conflict or suggest how I can get around this. I read a bit about 'no conflict' but don't understand how to implement it.
View 3 Replies
View Related
Mar 18, 2006
got the following problem: I need to include an HTML file that sits on
another server B in an HTML file that sits on server A, and I need to
include this at a particular place in the file. The "include" command
doesnt work obviously as it is server-side.
In other words: say I have a webpage, at a particular place, for
example halfway down, I want to include HTML that sits on another
server.
View 3 Replies
View Related
Jun 8, 2010
Impatience got the better of me. For the fragment method using .load(), how can I load more than one fragment?
View 1 Replies
View Related
Aug 27, 2009
The problem is, I might want to change the html I include based upon variables passed between web pages.My problem is I don't know how to include html files in html files using javascript! How would you do this?
View 1 Replies
View Related
Sep 8, 2010
I am using this script.
[URL]
**It is not possible to apply Tipmage to more than one image in a single page**
Is this possible to apply this class to more than one image?
View 1 Replies
View Related
Mar 26, 2007
The page I'm working on has a week's worth of data blocks like this - pseudo code & markup:
<form 1>
field a 1
field b 1
submit 1
response 1
</form 1>
<form 2>
field a 2
field b 2
submit 2
response 2
</form 2>
and so on for either 7 or 14 days.
I'm trying to conceptualize an prototype based js function that can handle all the forms to submit the data to the backend.
What I have now, that works is like the following
Event.observe(window, 'load', ajax_init, false);
function ajax_init () {
Event.observe('form_1', 'submit', send_form_1);
Event.observe('form_2', 'submit', send_form_2);
}
function send_form_1 (e) {
$('response_1').innerHTML = 'doing the deed for 1!'
var myAjax = new Ajax.Updater('response_1', 'ajax_server.php', {method: 'post', parameters: Form.serialize(this)});
Event.stop(e);
}
function send_form_2 (e) {
$('response_2').innerHTML = 'doing the deed for 2!'
var myAjax = new Ajax.Updater('response_2', 'ajax_server.php', {method: 'post', parameters: Form.serialize(this)});
Event.stop(e);
}
But, in my mind, there has to be a way to streamline this so that one function 'send_form' can do the magic rather than having multiple iterations of it. I was looking at the bind functions in prototype, but perhaps it was the late night and lack of coffee, but I wasn't seeing the application of bindAsEventListener in this context.
View 4 Replies
View Related
Nov 25, 2011
According to ECMAScript, the root of the prototype chain is Object.Prototype. Each object has an internal property [[Prototype]] that could be another object or NULL.... However, it also says that every function has the Function prototype object: Function.Prototype, it confused me, because a function is an object, for a function object, what is its function prototype and object prototype..For example:
var x = function (n) {return n+1;};
what is the relationships of x, Object.Prototype and Function.Prototype
View 5 Replies
View Related