How do I rewrite a page using Javascript?

Discussion in 'HTML & Website Design' started by VestRite, Jan 27, 2008.

  1. #1
    I don't want non-members accessing my article submitter and tutorial pages, so what I was thinking was to create a member page that you have to login to that would have a button that would rewrite the page into the article submission tool. The article submission tool is frame-based HTML.

    This is what I want to rewrite the page as:

    <html><frameset rows="100, *,100">
    <frame src="page1.html" scrolling="auto" />
    <frame name="name1" src="page2.html" scrolling="auto" />
    <frame src="page1.html" scrolling="auto" />
    </frameset></html>

    However, I can't find a script that will rewrite the entire page upon clicking a link or a button like this:

    <a href="javascript:myFunction();">Click here</a></p><p>

    OR

    <input type="button" value="Click here" onClick="myFunction();"></p>

    I've found scripts that pop up a new page or rewrite portions of the page, but I can't seem to find one that will rewrite the entire page. I've tried the usual just putting the HTML in a document.write script...but I used too many quotes or something. The I tried using scripts that would rewrite a page based on an input...

    <script type="text/javascript">
    function myFunction() {var var1 = textarea.value; document.write(var1);}
    </script>
    <form>
    <textarea id="textarea" name="textarea">HTML HERE</textarea>
    </form>

    but that ain't working. I'm a total noob on Javascript. Could someone help me out?
     
    VestRite, Jan 27, 2008 IP
  2. James Gober

    James Gober Guest

    Messages:
    40
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #2
    VestRite,

    I have a possible way to make this work.. give me a few to write the code and ill post it shortly.
     
    James Gober, Jan 27, 2008 IP
  3. James Gober

    James Gober Guest

    Messages:
    40
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Ok, this is a full HTML source, Ill go over what I did and how you can edit it in the future.

    For starters, I set the body tag with an ID so the JavaScript knows where to rewrite the content.

    <body id="editable">
    Code (markup):
    Next I set the JavaScript function where you can set the HTML in place to rewrite the page content in the body.

    <script type="text/javascript">
    <!--
    
     function my_function() { 
              document.getElementById('editable').innerHTML = '<b>FRAME CODE GOES HERE</b>' + 
                                                              '<br />' + 
                                                              '<i>new line</i>';
              return true;
     }
    
    -->
    </script>
    Code (markup):
    The above should be self explanatory.. ('editable') is the element id "the body" where we're going to re-write the content.. inside the single quotes you'll see the printout HTML markup.. just re-write that to match your needs.. each new line you'll need to add a + to continue.. as shown above and below in the full source.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    
    <script type="text/javascript">
    <!--
    
     function my_function() { 
              document.getElementById('editable').innerHTML = '<b>FRAME CODE GOES HERE</b>' + 
                                                              '<br />' + 
                                                              '<i>new line</i>';
              return true;
     }
    
    -->
    </script>
    
    </head>
    <body id="editable">
    
    <a href="#" onclick="javascript:my_function();">Click here</a></p><p>
    
    
    </body>
    </html>
    Code (markup):
    This should re-write your content using JavaScript.. if you have any questions or any problems let me know :D
     
    James Gober, Jan 27, 2008 IP
  4. VestRite

    VestRite Peon

    Messages:
    39
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    I cannot use the body as rewritable. The user-access only pages are designed in joomla. Although joomla allows HTML, it also has its own <body> tag too. So I can't exactly put a different <body> tag inside a body tag and have it rewrite the entire page.

    I'll show you a screenshot of the editor:

    [​IMG]
     
    VestRite, Jan 27, 2008 IP
  5. James Gober

    James Gober Guest

    Messages:
    40
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #5
    create a DIV tag.. and use it like i did the body tag
     
    James Gober, Jan 27, 2008 IP
  6. VestRite

    VestRite Peon

    Messages:
    39
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    And that will rewrite the entire page in frames? I guess I'll give it a shot and see what happens.
     
    VestRite, Jan 27, 2008 IP
  7. VestRite

    VestRite Peon

    Messages:
    39
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7
    Na man, it didn't work. Here is the code I used:

    <html>
    <head>
    <title>Article Submitter</title>
    <script type="text/javascript">
    <!--
    
     function my_function() { 
              document.getElementById('editable').innerHTML = '<b>
    <html><frameset rows="100, *,100">
      <frame src="page1.html" scrolling="auto" />
      <frame name="name1" src="page2.html" scrolling="auto" />
      <frame src="page1.html" scrolling="auto" /> 
    </frameset></html></b>' + 
                                                              '<br />' + 
                                                              '<i>new line</i>';
              return true;
     }
    
    -->
    </script>
    </head>
    <body><div id="editable">
    
    
    
    <a href="#" onclick="javascript:my_function();">Click here</a>
    
    </p>
    </div>
    </body>
    </html>
    
    HTML:
    Eh...idk what to do. Maybe I should open up the frames in a new window or something? That might be easier than rewriting the entire page as frames.
     
    VestRite, Jan 27, 2008 IP
  8. AstarothSolutions

    AstarothSolutions Peon

    Messages:
    2,680
    Likes Received:
    77
    Best Answers:
    0
    Trophy Points:
    0
    #8
    Given that javascript is sent to the client anyway if someone looks at the source code of the pages they will see all the user names, all the passwords and all the member area elements without having to be a member.

    Is this going to be an acceptable level of security for your site? If it isnt then there isnt much point playing about with getting it working
     
    AstarothSolutions, Jan 27, 2008 IP
  9. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #9
    Wouldn't a server-side script be better, where it doesn't matter that Joomla is used and it just spits out proper HTML from the server instead? Then the code can be kept secure, and people without Javascript get some possibilities too?

    (I've really been finding myself needing to turn NoScript off simply to click links and silly thing like that... once needed Javascript merely to click on a drop-down!! Friggin abuse is what it is... </rant>)
     
    Stomme poes, Jan 28, 2008 IP
  10. VestRite

    VestRite Peon

    Messages:
    39
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #10
    My pages are secure if you make them in joomla.

    Example page:

    http://www.vestrite.com/index.php?option=com_fireboard&Itemid=29&Itemid=31

    See? No content in the HTML of the forums page cuz you are not logged in. I'm not so much worried about the members having access to the source codes. That doesn't bother me. It's just that there is no way to secure a page made entirely out of frames if I don't rewrite an already secure page. At least not another way to do that of which I'm willing to look into.

    What I am willing to look into is rewriting the entire page using javascript. Or even opening a javascipted page in a new window? If I have to put a textarea on my page to host the source codes for the written page, I'll do it.

    Again, I don't care if my members see the source codes, but I do care if other sites are linking to these member-only pages.
     
    VestRite, Jan 30, 2008 IP
  11. VestRite

    VestRite Peon

    Messages:
    39
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #11
    Okay so now the question would be...

    How can I pop up a javascript window and put frames in THAT?

    Let me know if you tested it before you gave me advice.
     
    VestRite, Feb 2, 2008 IP