How to display Javascript Variable value to HTML href tag

Question

i am rewriting my url and category name passing in to url. Now i am creating Url Friendly String using JS function is:

function getUrlFriendlyString(str)
{
   // convert spaces to '-'
   //alert(str);
   str = str.replace(/ /g, "-");
   // Make lowercase
   str = str.toLowerCase();
   // Remove characters that are not alphanumeric or a '-'
   str = str.replace(/[^a-z0-9-]/g, "");
   // Combine multiple dashes (i.e., '---') into one dash '-'.
   str = str.replace(/[-]+/g, "-");
   return str;
}

now on HTML page this JS function is giving a string value in JS like

<? $cat_name= 'Personalized Chocolates / Gift'; ?>
<script>var url=getUrlFriendlyString("<?=$cat_name;?>");</script>

i want to pass var url value in html tag href like that

<a  href="<?PHP echo SITE_URL;?>/category/<script>document.write(url);</script>/<?=$data_2['cat_id'];?>"

but

<script>document.write(url);</script>

not giving their value and coming url is like that

http://localhost/ecom/category/<script>document.writeln(url);</script>/105

required url is

http://localhost/ecom/category/personalized-chocolates-gift/105

any idea how i can show proper url using js string?

i can save var url value in PHP variable

I can do this in php and i m also doing but i want that on client side to use less server resource. we are shifting lot of possible functionality on client side — PankajR
– PankajR, Commented Jan 19, 2015 at 15:09

Quentin · Accepted Answer · 2015-01-19 14:53:01Z

3

You can't include an element (such as <script>...</script>) in the middle of an attribute value.

If you are going to take this approach, then you need to write out the entire anchor element using JavaScript.

An alternative approach would be to set a default value in the HTML, then access the element with DOM in a script that appears after the element is complete.

A better approach would be to rewrite the getUrlFriendlyString function in PHP and run it on your server.

answered Jan 19, 2015 at 14:53

Quentin

948k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

PankajR Over a year ago

Dear thanks for answer. I can do this in php and i m also doing but i want that on client side to use less server resource. we are shifting lot of possible functionality on client side

Quentin Over a year ago

That's a false economy. That sort of operation is cheap (in relative terms) to begin with. Server resources are also cheap these days. Moving it to client will add the complexity of multiple target environments for the code to run under (which increases development and testing costs), and increase the likelihood of failure (since JS might not run due to network glitches / bad spam filtering / loss of mobile connections / users disabling JS / etc).

Raj Kumar · Accepted Answer · 2015-01-19 17:07:44Z

This is working for me

you can take var url value in php variable and use in your href tag

<? $cat_name= 'Personalized Chocolates / Gift'; ?>
<script>var url=getUrlFriendlyString("<?=$cat_name;?>");</script>

and

<?php
        $m="<script>document.write(url);</script>";
        echo $m; // output is : personalized-chocolates-gift
   ?>

this will not give you same o/p inside href, will give you o/p your js code because inside $m js code is saved and href not converting js into string o/p

i hope this will work for you :)

PankajR · Accepted Answer · 2018-05-21 18:16:43Z

0

this may help you JS in HTML Code redirectTo() is JS Function

<a onclick="redirectTo();">click here</a>

answered May 21, 2018 at 18:16

PankajR

3403 silver badges12 bronze badges

Collectives™ on Stack Overflow

How to display Javascript Variable value to HTML href tag

3 Answers 3

2 Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Related