Textpattern CMS

#1 2010-12-13 23:56:08

Frimkron

New Member

Registered: 2010-12-13

Posts: 2

Javascript Escaping

Hi

I’m having trouble with Javascript on one of my pages. I’m trying to output information about a link as a Javascript function call – for example:

<a href="<txp:link_url />" onclick="return openLink('<txp:link_url />','<txp:link_description />');">
	<txp:link_title />
</a>

However the output of link_url and link_description mess up the Javascript if they include a single quote or other invalid character inside the string literal.

I can’t find anything in the documentation about escaping the output for use in a Javascript string. Am I missing something? Is there a simple solution to this?

#2 2010-12-14 02:56:37

GugUser

Member

From: Quito (Ecuador)

Registered: 2007-12-16

Posts: 1,477

Re: Javascript Escaping

Perhaps it is helpful if you first learn the contemporary JavaScript implementation. onclick="return etc." has nothing to do within the a-element. Honestly, I can’t understand what you are doing. If you click on the link, the URL specified in the href-attribute is opened.

Moreover, where you know the TXP-tag <txp:link_title />? Do you mean <txp:link_name />?

Last edited by GugUser (2010-12-14 03:06:35)

#3 2010-12-14 09:09:32

Gocom

Developer Emeritus

From: Helsinki, Finland

Registered: 2006-07-14

Posts: 4,533

Website

Re: Javascript Escaping

There are couple ways to get over the escaping issue. The reason why it is happening, is because TXP tags are designed to output pure markup. You can easily get over the issue by removing inline JS and getting the recuired content dynamically from the existing page. Small example using jQuery (which is bundled with TXP):

/*
	If link is clicked, fire this.
	The links title="" attribute would hold the
	description
*/
$('a').click(
	function(){
		var url = $(this).attr('href');
		var description = $(this).attr('title');

		/*
			We got the data,
			now call our buddy, the function
		*/

		return openLink(url,description);
	}
);

Alternatively, if you really want to keep using inline JS, you can do a search and replace, that would replace all the invalid chars. You could do that for example by using rah_replace plugin. Something like (not tested):

<txp:rah_replace from=""",'" to="&#34;,&#39;">
	Some "quotes" and 'more' to replace.
</txp:rah_replace>

GugUser wrote:

Honestly, I can’t understand what you are doing. If you click on the link, the URL specified in the href-attribute is opened.

Frimkron is probably trying to show an popup/lightbox (etc) when a link is clicked, not actually open the link. The location won’t opened if the default action is prevented. That can be either done by returning false on the corresponding event, or firing preventDefault method.

---

Rah | GitHub

#4 2010-12-14 21:59:05

Frimkron

New Member

Registered: 2010-12-13

Posts: 2

Re: Javascript Escaping

Moreover, where you know the TXP-tag <txp:link_title />? Do you mean <txp:link_name />?

Sorry, yes. I should have checked the docs before writing this quick example :)

Frimkron is probably trying to show an popup/lightbox (etc) when a link is clicked, not actually open the link.

Yeah that’s right. And where javascript is disabled it’ll fall back on the link itself.

I think I’ll go with something like your first suggestion, Gocom.

Thanks guys :)