SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Guru quenting's Avatar
    Join Date
    Dec 2002
    Location
    Switzerland
    Posts
    735
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    loading parts of a page dynamically from server ?

    hi,
    I'd like to load some part of a page for example on an onclick event. 3 questions :

    1) let's say i have a <div> tag with an ID, i'd like for example to fill is on the click of a button without having to reload the whole page. I saw there was a function "insertAdjacentHTML" but it seems to be IE only.

    is there a way i can make this function cross-browser / is there a better function i could use ?

    2) The other problem is that i'd like the inserted html to be loaded dynamically on event and not on page load.
    Is there a way i can retrieve html code from another file (on the server) on the click event, store it into a string, and then pass it to the above function ?

    3) I figured i could use the "src" property to do this, for example if i had an image i could set its src to the file i want on click and it would load dynamically. But is there a tag to do this with not only images but html code ? The only one i could think of is <iframe> which in my memory has a src attribute, but i think it is also an IE-only thing. is there any other function / better way / crossbrowser trick i can use to do it ?

    Thanks for any input.
    Quentin

  2. #2
    Sultan of Ping jofa's Avatar
    Join Date
    Mar 2002
    Location
    SvÝ■jˇ­
    Posts
    4,080
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Example: http://www.sitepointforums.com/showt...949#post553544
    NB! This example is IE only, for Mozilla you have to look up XMLHttpRequest

  3. #3
    ♪♪ ♪ ♪ ♪ ♪♪ ♪ ♪♪ Markdidj's Avatar
    Join Date
    Sep 2002
    Location
    Bournemouth, South UK
    Posts
    1,551
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    innerText, innerHTML

    Try using innertext or innerHTML(more corss browser) with the span tag.
    If you set up the HTML as variables; eg

    PHP Code:
    PictureAndDescription="<img src=picofme.gif>Here is a picture of me, if you want more info click <a href=newpage.html>here" 
    set up the function;-
    PHP Code:
    function newdescription(thisdesc){document.getElementById("moshe").innerHTML=thisdesc
    then use the span tag;
    PHP Code:
    <SPAN id="moshe" name="moshe">here you can put original text and pics that will be replaced</span
    and call on the function using;
    PHP Code:
    onclick=newdescription(PictureAndDescription
    or you could use this......
    PHP Code:
    <div onmouseover="this.innerHTML='<B>Mouse out to change back.</B>'"
        
    onmouseout="this.innerHTML='<I>Mouse over again to change.</I>'"


        <
    I>Mouse over this text to change it.</I>
    </
    div
    It works well but the content will not be picked up on by search engine robots
    LiveScript: Putting the "Live" Back into JavaScript
    if live output_as_javascript else output_as_html end if

  4. #4
    SitePoint Guru quenting's Avatar
    Join Date
    Dec 2002
    Location
    Switzerland
    Posts
    735
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks guys,
    the second example has the problem that the html code (even though not the pictures) has to be loaded with the first page, which i don't want (i'm creating an online help, quite huge, and only want to display the help topics needed / requested).
    the first example seems to be exactly what i want to do.
    Just have to write that code for netscape and i'll be done, thanks a lot ! :-)

    Quentin

  5. #5
    ♪♪ ♪ ♪ ♪ ♪♪ ♪ ♪♪ Markdidj's Avatar
    Join Date
    Sep 2002
    Location
    Bournemouth, South UK
    Posts
    1,551
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    put the data in external .js

    If you put the variable as a stand-alone external .js this should sort the problem out
    LiveScript: Putting the "Live" Back into JavaScript
    if live output_as_javascript else output_as_html end if


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •