PDA

Click to See Complete Forum and Search --> : One last question before I give up on Javascript

karayan
06-08-2003, 10:01 PM
I am still stuck on my problem saving the contents of a page as a web page (images and all).

In summary, I need to have my users save a page that I create for them. They can use the Save As option under the File menu on IE to do that. However, the page contains self-modifying Javascript. As soon as they open the HTML file (from their disk) and load it on IE, the imbedded Javascript (based on user input) makes changes to the page. Then, the user needs to save the result. HOWEVER, when I use the Save As option, IE saves the ORIGINAL HTML file, NOT the modified page contents. :( If I cannot overcome this, I will have to abandon Javascript for this app -- to my great consternation, as it allows me to use IE's features. :mad:

So: How can I force IE to save the current page contents, rather than the original source that it loaded? Please help me. 80 hours of development are going down the drain.

George (who loves Javascript and wishes he can use it)


(P.S.: At Dave Clark's suggestion, I explored using ActiveX functionality. He gave me a great script doing simple txt file editing. The trouble is that when I try to use ActiveX, first IE asks the user if it would be allowed to use ActiveX (since it can be a security threat), AND then Norton Antivirus comes along and flashes a big window informing the user of a security threat! I can't have users buy my application and have it flash security warnings. So I can't really use ActiveX.
gsb
06-08-2003, 10:42 PM
Here's something I came across. Don't remember the link but...


Here are a couple of functions I've developed that work together. The first one, "showSource" actually calls the second one, "openWindowAndCopy". The showSource enables you to see what actually got rendered to the browser by iterating through the generated document and concatenating the outerHTML of each element. This then calls the openWindowAndCopy function (which can always be used separately). This function accepts any string, opens a separate popup window and writes the string into it, and provides a textearea with scrollbar plus another nice feature - a button that copies the contents to the Windows Clipboard so that you can paste it into your favorite HTML or XML editor. One important thing - you have to load the showShource as a separate JS file using the SRC="stuff.js" element in your script tag. Otherwise, this thing will recurse on itself and send your browser into LaLa Land. My Grandmother, who lived be 100 years old, explained it this way: "The way to understand recursion is to understand recursion". These little babies have saved me a lot of time, hope they are useful to you.

Sample HTML page showing usage of the "showSource()" function:

<HTML>
<HEAD>
<script language="JScript" src="stuff.js"></script>
</head>
<BODY onload="showSource();">
<table Cellspacing =2 cellpadding=2>
<TR><TD>HELLO</TD><TD>HOWDY</TD></TR>
</TABLE>
</BODY>
</HTML>

<!-- save everything below this line as "stuff.js"-->
function showSource()
{
var doc_stuff="";
for(i=0; i<document.all.length; i++)
{
if (document.all[i].tagName.toUpperCase() !="BODY" && document.all \
[i].tagName.toUpperCase() !="HEAD")
{
doc_stuff+= document.all(i).outerHTML;
}
}
openWindowAndCopy(doc_stuff);
blnDone=true;
}

/* Debugging function: writes selected text or XML into a separate
browser window inside a textarea for easy cut/paste
to the Windows Clipboard via "copy" button for paste to XML parser,
etc. PAB 4/2/01 */

function openWindowAndCopy(strText)
{
winBS='toolbar=no,location=no,directories=no,menubar=no,';
winBS+='scrollbars=yes,width=650,height=500';
winBS+=',left=10,top=25';
holyCow=window.open("","",winBS);
holyCow.document.open();
holyCow.document.write("<scr"+"ipt>function copy(){stuff.focus();\
stuff.select();window.clipboardData.setData('Text', stuff.value);}\
</scr"+"ipt>");
holyCow.document.write("<input type=button value=copy! \
onclick=copy();><BR>");
holyCow.document.writeln ("<textarea id=stuff rows=60 cols=70>");
holyCow.document.write (strText);
holyCow.document.writeln ("</textarea>");
holyCow.document.close();
holyCow.focus() ;
}

Hope it can help.
Khalid Ali
06-08-2003, 10:55 PM
I actually went through the whole process of creating a dynamic page and all.
Here is what I have found out.
NS browser let you save the dynamic changes you make in DOM...IE so far is not allowing me..but I will work on it to find out why..tomorrow.
karayan
06-08-2003, 11:26 PM
To Khalid:

Thanks for your help! Netscape does not save the page as a complete web page, like IE does. IE will not only save the HTML file, but it will create a folder and save the images in there as well. The saved HTML file will have the src's of the <img> tags modified to point to the saved images in the folder. Brilliant, but I can't use it, as I explained in my original post. Unless, of course, you can find why it's not doing it and how to make it do it.

I've even thought about giving Microsoft a call. :eek:

To gsb:

Thanks for the useful script. It's a very nice way to "discover" what's in the current DOM of a page. I wish I could save the results on the disk. :(

Your grandma was a wise woman!:cool:

George
gsb
06-09-2003, 09:38 AM
Just copy to clipboard and paste in a text editor. Then save.
An extra step, but...
Khalid Ali
06-09-2003, 10:31 AM
Ok this is what I have done so far.

make changes inthe poupwindow dynamically.

Pass the all of the code to a new window.
And save that window.But there istill is a tricky part here.

Save it as text file or just html file it will retian the changes
karayan
06-09-2003, 10:57 PM
Khalid:

I'm not sure what you mean. If I open a new window, I can specify a URL for it:

window.open("blabla.htm");

or not:

window.open("");

How do I pass the HTML code to the window?

(By the way, in the first case, the Save will save the source exactly as read from file blabla.htm. The second case will save an empty HTML file (<body></body>), because it did not open anything and the source is empty.)

George
Khalid Ali
06-12-2003, 10:36 AM
Here I have put this page together for you.
See if this helps you.
http://68.145.35.86/temp/SolutionForKarayansProblem.html
Once opened enter a numerical value in the top(small) text field.
Click on "Add" button.This will add options in select box.
Once done then click on Open WIndow button.
This will open a new window witht the new update dynamic page..
Now click on
file
+save as

make sure about these fields
Save as type [Web page,HTML only...]
Encoding [Unicode]

I hope this helps
karayan
06-12-2003, 12:24 PM
Nope, it doesn't work.

Thanks for your help, Khalid. As I had feared, however, it still doesn't work. I use your poage to create 2 new items in the pull-down list, and then I open the new window. The new window is populated with the 2 options, as expected. However, when I save it as a web page, it saves the original version, with the empty pull-down list!!!!!!

What is happening, I suspect, is that when you open the new window, you load it with blank.htm. That goes into the source in IE. Then, with document.write()'s you create the new look. That changes the way the window LOOKS, but NOT the page source. When you try to save, IE stupidly saves the (unchanged) SOURCE! Go figure.

Looks like it's VB for me. :mad: :mad: :mad: :mad:

Thanks, anyway, Khalid.

George
Khalid Ali
06-12-2003, 02:07 PM
Originally posted by karayan

Looks like it's VB for me.
Thanks, anyway, Khalid.

George

Hello George...I am just stumped here.The only think I can think of is that you are not implementing the solution exactly as I mentioned....because I just re-saved the whole thing with both NS6+ and IE6+....

Implementation of a solution correctly is totally dependant upon your end..:D :D