Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    New to the CF scene
    Join Date
    Jul 2002
    Location
    Kent, Washington
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy Treating A Cell Kinda Like A Frame

    I've been told this is possible, but I don't know where to begin... I have a table with a lot of text, which can't fit on the page. So I want to treat that cell like a frame and be able to click a link which will change the contents of that cell (it's all text, no pics) and it'd work like that. So, am I wrong or can this actually be done?
    --
    Gigadestroyer

    P.S.
    I am EXTREMELY new at Javascript, so if, out of the goodness of your hearts, someone could help me write the script, that would be very much appreciated.

  • #2
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    put around text
    <div style="width:100;height:100;overflow:auto">

    </div>

  • #3
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    you can use innerHTML or DOM.

    here's an example of using innerHTML:

    Code:
    <html>
    <head>
    <script language="javascript">
    function changeText(id,txt){
    var obj = (document.getElementById) ? document.getElementById(id):(document.all)?document.all[id]:null;
    if (obj) obj.innerHTML = txt;
    }
    </script>
    </head>
    <body>
    <form>
    <table border="1">
    <tr>
    <td id="td1">This is td1</td><td><input type="button" value="Change" 
    
    onclick="changeText('td1','td1 text changed!')"></td>
    </tr>
    <tr>
    <td id="td2">This is td2</td><td><input type="button" value="Change" 
    
    onclick="changeText('td2','td2 text changed!')"></td>
    </tr>
    </table>
    </form>
    </body>
    </html>

  • #4
    New Coder
    Join Date
    Feb 2003
    Location
    ROMANIA
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile OK, I can see you're new...

    There's a property in JS newer versions, that is called "innerHTML".

    This property is a string and is readable-writable - if I may say so.

    In your case, just ad the ID attribute to your <TD> tag and access it using

    document.getElementById("the_Id_of_your_<TD>_tag").innerHTML

    To assign new content there, just use the "=" operator:

    document.getElementById("the_Id_of_your_<TD>_tag").innerHTML=" new html content "

    some example:

    <HTML><HEAD ... bla bla bla - html goes there.
    ...
    <SCRIPT LANGUAGE=javascript>
    <!--

    function change(text)
    {

    document.getElementById('MYCELL').innerHTML = text

    }

    //-->
    </SCRIPT>

    </HEAD>
    <BODY>

    ...
    <TD ID = MYCELL >This is my <B>first content</B></TD>
    </TABLE>

    <A HREF="javascript: change('And this is my <B>second</B> text!')">click here to change</A>

    ...
    </HTML>


    I didn't test it, but normaly it should work - if it doesn't it has to be for some silly syntax misspelling

    Bye
    Claudiu Iacob - Romania

  • #5
    New Coder
    Join Date
    Mar 2004
    Posts
    92
    Thanks
    0
    Thanked 0 Times in 0 Posts

    possible to add links?

    I'm having a problem with innerHTML. I'm trying to add links to a cell of a table? Is this even possible, if so how? The innerHTML function I created works great but just with adding plain text...

    -peace

  • #6
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    As the property name implies, you can set html tags not just plain text.

    document.getElementById("theId").innerHTML='<a href="page.htm">Link</a>'

  • #7
    New Coder
    Join Date
    Mar 2004
    Posts
    92
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by glenngv

    document.getElementById("theId").innerHTML='<a href="page.htm">Link</a>'
    Hrm, I don't understand why that works if i place that into a function. but this code wont work:

    function:
    Code:
    function leftnav(toptitle, linklist) {
    	document.getElementById('cell-title').innerHTML+="<img src=\""+toptitle+"\">";
    	document.getElementById('cell-links').innerHTML+=linklist;
    }
    </script>
    link:
    Code:
    <area shape="rect" coords="510,125,591,136" href="#" onClick="leftnav('images/accessories-title.jpg', '<a href="\test.htm\">Link I-I</a>Link I-II<br>Link I-III');return false;">
    Could you help me with the syntax I used? Help me to understand why it doesn't work and help me fix the problem? It's printing the text on the page itself which shouldn't be happening.

    -Thanks

  • #8
    New Coder
    Join Date
    Mar 2004
    Posts
    92
    Thanks
    0
    Thanked 0 Times in 0 Posts
    nvm i figured it out. i just set the stuff into a variable :-)

    -peace

  • #9
    New Coder
    Join Date
    Mar 2004
    Posts
    92
    Thanks
    0
    Thanked 0 Times in 0 Posts
    scratch that, it doesn't work :-(. This is driving me nuts not figureing it out

  • #10


  •  

    Posting Permissions

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