 |
|
|
| View previous topic :: View next topic |
| Author |
Message |
denden43
Joined: 03 Dec 2007 Posts: 5
|
Posted: Mon Dec 03, 2007 4:35 am Open Selected Images Using Checkboxes in New Window |
|
|
|
I'm relatively new to Javascript and have been searching the web for a way to open up to 8 pictures in a new browser window for printing. I have them sized to print 2 across and 4 down. For example, I may have a dozen pictures on the page, and I would like to be able to check from 1 to 8 pictures to present in an about:blank page so that they can be printed by themselves without all of the other page information.
I have the image links set in the main page as follows:
<input type="checkbox" name="image1"><img border="0" src="images/myimage1.jpg" width="288" height="192"> etc.
I have the new window opening fine, but I'm having trouble setting up the variable to pass the checked value (image location) to the new page.
I've seen many examples of opening a single image in a new window by clicking on it, but nothing quite like what I have described.
Any help would be deeply appreciated as I am trying to get this working for the holidays.
Thank you! |
|
camoman666

Joined: 24 Jun 2006 Posts: 373 Location: Fort Walton Beach, FL, USA
|
Posted: Mon Dec 03, 2007 1:25 pm |
|
|
|
Well luckily you have a few weeks to get this to work if we don't get it on the first try. I've never used about:blank windows before so there will probably be a few flaws on that part of the code but I'm sure it will be working just fine very soon. Anyway, this is what I'd do:
| Code: |
<script type="text/JavaScript">
<!--
var pics = "";
var picnum = 0;
function picWin(){
if(document.picf.pa.checked==true){
pics += "a";
picnum += 1;
}
if(document.picf.pb.checked==true){
pics += "b";
picnum += 1;
}
if(document.picf.pc.checked==true){
pics += "c";
picnum += 1;
}
if(document.picf.pd.checked==true){
pics += "d";
picnum += 1;
}
if(document.picf.pe.checked==true){
pics += "e";
picnum += 1;
}
if(document.picf.pf.checked==true){
pics += "f";
picnum += 1;
}
if(document.picf.pg.checked==true){
pics += "g";
picnum += 1;
}
if(document.picf.ph.checked==true){
pics += "h";
picnum += 1;
}
if(document.picf.pi.checked==true){
pics += "i";
picnum += 1;
}
if(document.picf.pj.checked==true){
pics += "j";
picnum += 1;
}
if(picnum<=8){
curL = 0;
curLA = new Array();
curLA = {"a", "b", "c", "d", "e", "f", "g", "h", "i", "j"};
newWin = window.open("about:blank");
rowNum = 2;
while(picnum>0){
if(rowNum==0){
newWin.write("<br>");
rowNum==2;
}
newWin.write("<img src=\"");
if(pics.indexOf(curLA[curL])!=-1){
window.write("picture"+curL+".gif");
}
curL++;
}
}else{
alert("Please Chose 8 or Less Pictures");
}
}
-->
</script> |
And you will need to edit the form a bit.
| Code: |
<form name="picf" action="javascript:picWin()">
<input type="checkbox" name="pa"><img src="picture.gif">
<input type="checkbox" name="pb"><img src="pictureb.gif">
<input type="checkbox" name="pc"><img src="picturec.gif">
<input type="checkbox" name="pd"><img src="pictured.gif">
<input type="checkbox" name="pe"><img src="picturee.gif">
<input type="checkbox" name="pf"><img src="picturef.gif">
<input type="checkbox" name="pg"><img src="pictureg.gif">
<input type="checkbox" name="ph"><img src="pictureh.gif">
<input type="checkbox" name="pi"><img src="picturei.gif">
<input type="checkbox" name="pj"><img src="picturej.gif">
<input type=submit value="View Pictures">
</form> |
Please let me if something doesn't work, as I'm sure will happen because like I siad, I don't normaly deal with about:blank windows. |
|
denden43
Joined: 03 Dec 2007 Posts: 5
|
Posted: Mon Dec 03, 2007 4:26 pm |
|
|
|
WOW! Do I really appreciate the quick response! Your code looks like a great place to start (or maybe even finish, with any luck). Having been a programmer for quite some time, only not in Javascript, just having a starting place is good.
I just got home from work and we'll give it a try later on. If we can put this together as a team, we'll post the final result, as based on my searches, I can't believe I'll the only one who wants to do something like this. The about:blank is the MINOR part of this project. It's just a variation of window.open that has no particular options (menus, toolbars,etc.). It works in both Firefox and I.E., and since most of my friends and family use one or the other, I'm not worried about other browsers.
We'll get back to you later.
THANK YOU!!! |
|
denden43
Joined: 03 Dec 2007 Posts: 5
|
Posted: Tue Dec 04, 2007 5:09 am |
|
|
|
camoman666
I'm heading to work, but I wanted to give you a bit of feedback before I left. I always like to keep learning on my own before I ask for help, so last night I just build a small page using your code and my graphics. The first run through I got a script error at the these two lines:
curLA = new Array();
curLA = {"a", "b", "c", "d", "e", "f", "g", "h", "i", "j"};
Dug into my Javascript for Dummies book (hey, it's a place to start, you know) and ended up combining the two lines into:
var curLA = new ("a","b","c","d","e","f","g","h","i","j");
Then I got an error on line:
if(document.picf.pi.checked==true){
pics += "i";
picnum += 1;
That's because I didn't change the "pi" to my checkbox name value. DUH!
I even added alert code:
alert('pi is checked');
etc. to each checkbox area to let me know that your code is working absolutely flawlessly on the random checking of pictures. The more I practice with this stuff, the better I hope to become.
As expected, I stopped last night when I got this error: newWin is undefined
on this line:
newWin.write("<img src=\"");
I think this is as we expected, but overall, we've had a VERY productive evening on this project.
I'll continue on this evening, but THANK YOU ever so much for your help thus far.
BTW, I've been using Microsoft Office 2003 script editor and it saves me a bunch of line counting when I have to see what lines are broken. Don't know if you have something more sophisticated or not, but it seems to catch things pretty well. It doesn't fix them for me though. HA! |
|
camoman666

Joined: 24 Jun 2006 Posts: 373 Location: Fort Walton Beach, FL, USA
|
Posted: Tue Dec 04, 2007 1:02 pm |
|
|
|
I don't have any sort of script editor it all comes from my head, but I think I found your problem. I defined the window wrong, I haven't been working with JavaScript recently I've been writing games in a language that's similar but has some differences. But the problem is where i have it as
| Code: |
| newWin = open("about:blank"); |
needs to be
| Code: |
| window.open("about:blank",newWin); |
Sorry about that. |
|
denden43
Joined: 03 Dec 2007 Posts: 5
|
Posted: Tue Dec 04, 2007 4:03 pm |
|
|
|
WOW. A game programmer? On-line games or for one of the commerical boxes out there? I can't even imagine the code neeeded for those. I'd love to see some of your work.
Anyhow, sometimes I am such an IDIOT! Your original code worked fine and the about:blank opened OK with the "newWin = window.open("about:blank");" statement . Somehow when I was pasting, I lost the semi-colon at the end of the line. So I used the original code that you gave me and the window is opening. However, it's now stuck at the "newWin.write("<img src=\"");" statement indicating that "object does not support this property or method".
If you catch this later this evening, that would be great. Meanwhile, I'll start digging myself to decipher the message. It's only the second evening and it looks like we are honing in on this thing pretty nicely. I added my style sheet code to the orginating "baby" page and nothing broke, so we are making GREAT progress!!
Again, THANKS! |
|
camoman666

Joined: 24 Jun 2006 Posts: 373 Location: Fort Walton Beach, FL, USA
|
Posted: Tue Dec 04, 2007 4:12 pm |
|
|
|
Alright, try changing the "newWin.write" to "newWin.document.write"
And by the way, no I don't work for one of those big game companies, I wish I did though but I'm way too young, I'll have to wait a good eight years 'till I get in and out of college to make it to a company like that. I don't do online games either I write games that you download and play ofline on your computer. I haven't gotten past the basics of games but I'm working towards it, all I have done now is Pong and Break Out which, if you want to, can be gotten from here. |
|
denden43
Joined: 03 Dec 2007 Posts: 5
|
Posted: Tue Dec 04, 2007 5:40 pm |
|
|
|
OK, I decided to take a break and visit your site. I just HAD to watch the Rubik's cube video. Unbelievable! Pong takes me back a bit, for sure. Nicely done!
Back to our stuff, I changed the code as follows:
newWin.document.write("<img src=\"");
if(pics.indexOf(curLA[curL])!=-1){
newWin.document.write("picture"+curL+".jpg");
I'm using jpegs, not gifs, so I modified that part.
It's giving me a permission error now when trying to do the newWin.document.write("<img src=\""); command, and I think I've seen that out on the 'net before. It's still hanging on that command. I think I know what you're trying to do with the "<img src=" line, since document.write kind of likes to write plain old HTML to the new window, but I'm thinking that we need to get the value of the variable (a,b,c,d, etc) in there somehow. This is probably why you don't see a lot of examples for what we are trying to accomplish out and about on the 'net.
I'm going to work with it a bit more this evening and see what I can come up with. If you are doing this from memory, you have probably forgotten more than I will ever learn. HA!
If you'd like to chat more directly, you can contact me at dendenatprodigy.net. Others on this forum may go "GASP-an E-mail address". But tell you what, I know what to delete and what not to. And I've had this E-mail since prodigy.com, one of the first on-line services in the country. WAY BEFORE AOL! ;~)
Have a good evening if I don't chat with you sooner. |
|
|
|
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum
|
|
|
|
|