We help IT Professionals succeed at work.

Using Hyperlink URL and Onclick Javascript details inside a Javascript file (.js) using Document.write

Enflow
Enflow asked
on
3,699 Views
Last Modified: 2008-04-24
I have a .js file and need to put into it some table html, a  hyperlink URL + onclick javascript code and window sizing details...

like...

document.write (' etc...

here is the code i need to insert
<table cellpadding="0" cellspacing="0" border="0">
<tr><td align="center"><a href="http://livechat.boldchat.com/aid/2476792117374031072/bc.chat?cwdid=5472548157608506960" target="_blank" onClick="this.newWindow = window.open('http://livechat.boldchat.com/aid/2476792117374031072/bc.chat?cwdid=5472548157608506960&url=' + escape(document.location.href), 'Chat', 'toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=1,width=640,height=480');this.newWindow.focus();this.newWindow.opener=window;return false;"><img alt="Live chat by Boldchat" src="http://cbi.boldchat.com/aid/2476792117374031072/bc.cbi?cbdid=87893961508797932" border="0"></a></td></tr>
<tr><td align="center"><font size="1" face="Arial"><a href="http://www.boldchat.com" style="text-decoration: none"><font color="black">Live chat by </font><b><font color="#AD3100">Bold</font><font color="#003163">chat</font></b></a></font></td></tr>
</table>

i cannot figure the place ment of the  ' or " syntax

Cj
Comment
Watch Question

This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION
Commented:
This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION
b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
You have good information above but I wanted to add something.  Since Javascript (and even html) can use either the key is to remember which you used and (if Javascript) "escape" any use of it inside a string.  There are many ways to do the html you have above but the result needs to be consistent and valid.  For valid HTML use the same quote (double or single) to start and end an attribute's value.  For example ...

cellpadding="0"

OR

cellpadding='0'

I like to use double quotes in HTML so will often use a single quote or apostrophe (') for Javascript strings.  For example ...

Document.write ('<table cellpadding="0" cellspacing="0" border="0">');

This uses the block IconoclastX provided above and the result would be the same.  Notice that since I used single quotes I don't need to escape the double quotes used for the values of each attribute.  You could do the reverse instead (double quote for the Javascript string and single quote for each value).

Let me know if you have a question about this.  I hope it helps.

bol

Author

Commented:
Here is what i have so far in my sidebar2.js file...

Document.write ('<table cellpadding="0" cellspacing="0" border="0">')
Document.write ('<tr><td align="center"><a href="http://livechat.boldchat.com/aid/2476792117374031072/bc.chat?cwdid=5472548157608506960" target="_blank" onClick="this.newWindow = window.open("http://livechat.boldchat.com/aid/2476792117374031072/bc.chat?cwdid=5472548157608506960&url=" + escape(document.location.href), "Chat", "toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=1,width=640,height=480");this.newWindow.focus();this.newWindow.opener=window;return false;">')
document.write ('<img alt="Live chat by Boldchat" src="http://cbi.boldchat.com/aid/2476792117374031072/bc.cbi?cbdid=87893961508797932" border="0"></a></td></tr>')
document.write ('<tr><td align="center"><font size="1" face="Arial"><a href="http://www.boldchat.com" style="text-decoration: none"><font color="black">Live chat by </font><b><font color="#AD3100">Bold</font><font color="#003163">chat</font></b></a></font></td></tr>')
document.write ('</table>')

not working still need tweaks

http://www.ebuildingpermits.com/aaa.htm
 - that is the test page...

this is the .js file...
http://www.ebuildingpermits.com/sidebar2.js

thanks

Author

Commented:
i got the above to work with a tweak or two... it pops up the broswer window but does not resize it or hide address bar... etc...

here is code...

document.write('<br><br>')
document.write ('<table cellpadding="0" cellspacing="0" border="0">')
document.write ('<tr><td align="center"><a href="http://livechat.boldchat.com/aid/2476792117374031072/bc.chat?cwdid=5472548157608506960" target="_blank" onClick="this.newWindow = window.open("http://livechat.boldchat.com/aid/2476792117374031072/bc.chat?cwdid=5472548157608506960&url=" + escape(document.location.href), "Chat", "toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=1,width=640,height=480");this.newWindow.focus();this.newWindow.opener=window;return false;">')
document.write ('<img alt="Live chat by Boldchat" src="http://cbi.boldchat.com/aid/2476792117374031072/bc.cbi?cbdid=87893961508797932" border="0"></a></td></tr>')
document.write ('<tr><td align="center"><font size="1" face="Arial"><a href="http://www.boldchat.com" style="text-decoration: none"><font color="black">Live chat by </font><b><font color="#AD3100">Bold</font><font color="#003163">chat</font></b></a></font></td></tr>')
document.write ('</table>')

thanks...

cj...

Author

Commented:
Help Anybody there still not working... or not so far...
It's a different question, but the only thing I see wrong with your window.open parameters is that it's status, not statusbar.

Also, if you're using IE7 to view the page, the default security settings won't let you pop a window without an address bar, and might not allow specific sizing, either.

A freebie. ;P
IT Manager
CERTIFIED EXPERT
Commented:
This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION
b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
Disregard the little bit about Hello in the start of my last comment.  That part was a mistake but I am still glad you posted the followup. :)

bol
b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
Also, disregard the part about the ampersand character in the URL.  The way I viewed it before made it look like a possible error but now I see that you want the literal ampersand in the URL to separate the name/values in the URL but want the URL to be valid for HTML.  It should work as you have it once you fix the problem with the quotes.

bol

Author

Commented:
I got it = it works... YES, YES, YES... Life is good (for 1/2 hour at least)...

fantastico... thanks... this is launching a chat window from a sidebar that i create with a javascript file - never used the escapes before... great to know but tricky... is there a world class JavaScript debugger like there is for VB, and VBA and VB.net, etc... ????

also

Now how do i fairly distribute the points...

would 375 for b0lsc0tt be fair and 125 for Iconoclost be okay...

can't live with the guilt if i get the point distributions wrong... oh the Horror...

b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
I'm glad it works.  Hopefully life will be good longer than 1/2 hour but if not the weekend is coming soon. :)

>> can't live with the guilt if i get the point distributions wrong... oh the Horror...  <<

LOL.  That distribution sounds fine.  I would point out that Geodan7 did participate a bit and was the first to mention the term escaping.  If you think that is worth a split then take from mine since I certainly used the term a bit in my replies. :)  The grade is something I usually notice more than the point distribution.  I might be odd but a B grade just irks with only a few exceptions.

>> is there a world class JavaScript debugger like there is for VB, and VBA and VB.net, etc... <<

I don't know if this is "world class" but I have found it very useful.  If you use Firefox then get the Firebug extension.  Another favorite of mine is the Web Developer extension but Firebug is what I use for script debugging.  Let me know if you need links or more info on these.

bol
b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
I'm glad I could help.  Thanks for the grade, the points and the fun question.

bol
Glad you got it working, Enflow. :)

Gain unlimited access to on-demand training courses with an Experts Exchange subscription.

Get Access
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Empower Your Career
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE

Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Unlock the solution to this question.
Join our community and discover your potential

Experts Exchange is the only place where you can interact directly with leading experts in the technology field. Become a member today and access the collective knowledge of thousands of technology experts.

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.