Update table cell without refreshing page


DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

Results 1 to 2 of 2

Thread: Update table cell without refreshing page

  1. #1
    Kurt Foster Guest

    Update table cell without refreshing page


    I have a site I am designing with a menu bar at the top. I don't want to use
    frames but I want a similar affect using tables. When someone clicks on a
    menu item it should update a cell in the table with the correct data. I was
    thinking of using include files but I just can't figure out how not to
    reload the whole page. At http://www.dcg3.com/home.asp they have done this
    with Flash but I need a non-flash ASP page.

    Thanks
    Kurt








  2. #2
    XinLi Guest

    Re: Update table cell without refreshing page


    Hi,

    Well this problem is of varying difficulty depending on your browser version.
    I don't know what you mean by updating a table cell with data. How much
    data are we talking about? Are you intending to just write in some text
    maybe an image, or are you essentially trying to load another URL into a
    table cell?

    For just updating a cell with some simple data (not loading another page)
    -------------------------------------------------------------------------
    IE 4 and up:

    Very easy. Give the <TD> cell an ID. Then simply do something like this:

    [HTML above]
    <TD id="content"></TD>
    [/HTML below]

    <SCRIPT>
    document.all.content.innerHTML = "Whatever HTML mark up you want";
    </SCRIPT>

    NS 4:

    a little bit trickier. Put a <DIV> layer with an id in the table cell.
    Set position to relative. Then resolve the layer and do a document.write

    [HTML above]
    <TD><DIV ID='content' STYLE='position:relative'></TD>
    [/HTML below]

    <SCRIPT>
    document.layers['content'].document.write("Hi");
    </SCRIPT>

    NS 6:

    Similar to IE 4. Give a TD an id and write into it

    [HTML above]
    <TD id="content"></TD>
    [/HTML below]

    <SCRIPT>
    document.getElementById("content").innerHTML = "Whatever HTML mark up you
    want";
    </SCRIPT>

    Loading a complete URL
    ----------------------

    IE 4 and up:

    use a IFRAME (I think IE4 had iframes..can't be sure. But IE5 surely does).
    Look that up. it's pretty simple to script. You can just give the iFrame
    a name. NOT an id, a name. And then just set the target attribute of your
    anchor link to point to the name of the iframe.

    Netscape 4:

    Oy...this one is tougher. Sorry I don't have time to write the code. But
    NS4 has a similar element called an ILAYER. it has a load method of sorts
    that lets you load in a URL. The trick is that the iLayer won't auto scroll.
    I believe it will expand with the size of the content. So if you want a
    scroller, you need to write that ILAYER inside of a standard <DIV> layer.
    Set the clipping for the DIV to be of a certain size rectangle and build
    your own up and down buttons to change the relative position of the ILAYER
    inside the DIV relative to the 0,0 coordinate of the outer DIV.

    Netscape 6:

    IFRAME.

    Xin Li

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center
 
 
FAQ
Latest Articles
Java
.NET
XML
Database
Enterprise
Questions? Contact us.
C++
Web Development
Wireless
Latest Tips
Open Source


   Development Centers

   -- Android Development Center
   -- Cloud Development Project Center
   -- HTML5 Development Center
   -- Windows Mobile Development Center