change url path using jquery

Question

I have made a website for two different languages each being in two different folders en and bn. I want to switch between the folders on href element click using jquery.

<a class="eng_link " style="" href="#"> English</a> 
<a class=" link_active bangla_link " style="" href="#">বাংলা &nbsp;/ &nbsp;</a>

Say, I am currently on www.example.com/en/content?id=1. While clicking the link for english it will redirect to the url www.example.com/bn/content?id=1 and vice versa. Only the bn part of the url will change to en keeping other parts the same. How can I do this?

First of all you have to save the language preference by any mean such as cookie. Second, you have to set a default language. — SaidbakR
– SaidbakR, Commented Mar 27, 2017 at 6:20

enamul17 · Accepted Answer · 2017-03-30 04:52:43Z

3

This is how I have done it. In the index page of bn:

<a class="eng_link " style="" href="#" id='a' onClick="en_onClick()"> English</a> 
<a class=" link_active bangla_link " style="" href="index" >বাংলা &nbsp;/ &nbsp; </a>

JS

    function en_onClick() {
     $(location).attr('href');
     var bn_pathname = window.location.href;
     var en_pathname = bn_pathname.replace("bn/", "en/"); 
     window.location.replace(en_pathname);
 }

In the index page of en:

 <a class=" bangla_link link_in" style="" href="#" onClick="bn_onClick()"> বাংলা</a> 
 <a class=" link_active  eng_link" style="" href="#"> English &nbsp;/ &nbsp; </a>

JS

    function bn_onClick() {
     $(location).attr('href');
     var bn_pathname = window.location.href;
     var en_pathname = bn_pathname.replace("en/", "bn/"); 
     window.location.replace(en_pathname);
 }

edited Mar 30, 2017 at 4:52

answered Mar 30, 2017 at 4:36

enamul17

1592 gold badges3 silver badges14 bronze badges

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

Comments

Ahs N · Accepted Answer · 2017-03-27 06:21:34Z

1

This is how I would do it:

$(".changeLink").click(function() {
  $(".eng_link").attr("href", $(".eng_link").attr("href").replace("en", "bn"))
});

Here is the JFiddle demo

answered Mar 27, 2017 at 6:21

Ahs N

8,3961 gold badge30 silver badges34 bronze badges

3 Comments

enamul17 Over a year ago

Is there any way to get the current URL and then replace "en" with "bn"?

Ahs N Over a year ago

Yes, using window.location.href will give u the current path, u can then replace and redirect

Alireza Over a year ago

this will change all "en" in the text to "bn", like "en" in content ...

Alireza · Accepted Answer · 2017-03-27 06:55:02Z

0

use this function to change from any language to any language

in your html:

<a class="eng_link " style="" href="#" onclick="changelang('bn','en')"> English</a> 
<a class=" link_active bangla_link " style="" href="#" onclick="changelang('en','bn')">বাংলা &nbsp;/ &nbsp;</a>

and js:

function changelang(langfrom, langto) {
  var url = window.location.href;
  var langfrom= "/"+langfrom+"/";
  var re = new RegExp(langfrom);
  url = url.replace(re,"/"+langto+"/"); 
  window.location = url;
}

answered Mar 27, 2017 at 6:55

Alireza

1611 silver badge9 bronze badges

Comments

Peter Stark · Accepted Answer · 2017-03-27 07:16:08Z

Another alternative with jQuery and Javascript.

HTML

<a data-language="en" class="language eng_link " style="" href="#"> English</a>
<a data-language="bn" class="language link_active bangla_link " style="" href="#">বাংলা &nbsp;/ &nbsp;</a>

JS

$(function() {
    $(".language").click(function(e) {
        var selectedLanguage = $(this).attr("data-language");

        var currentContent = location.pathname.substring(
            location.pathname.indexOf("/", 1) + 1,
            location.pathname.length
        );

        console.log(selectedLanguage, " >> ", currentContent);

        // change URL to /en/content.html or /bn/content.html
        window.location.href = "/" + selectedLanguage + "/" + currentContent;
    });
});

Collectives™ on Stack Overflow

change url path using jquery

4 Answers 4

Comments

3 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related