CODEWITHSUNDEEP
jqueryjson
user2357418
user2357418

Reputation: 69

Language Change Using JSON

I wrote a code where a JQuery Ajax will call the JSON and based on the radio buttons selected, the field values should change. The Code is as follows

   $(document).ready(function(){
   $.ajax({
    type: "POST",
    url: "test.json",
    data : "",
    dataType: "json",
    contentType : 'application/json',
    success: function (response) {
    console.log(response);
    try{
            console.log(response.lang.english.login);
            console.log(response.lang.arabic.login);

        }
        catch(Exception){
        }
    },
    error: function (jqXHR, exception) { CRDates
    alert("Error");
    }

});

and the JSON file is as follows

  {"lang":
     {
"english":{
    "login":"Login"
},
"arabic":{
    "login":"دخول"
           }}
          and the HTML is as follows

Choose a Language: 

  <input type="radio" name="radio-choice" id="Language" value="Arabic"/>
 <label for="radio-choice-1">Arabic</label>

    <input type="radio" name="radio-choice" id="Language" value="Arabic"/>
    <label for="radio-choice-4">English</label>

<div><label for="declarationNumber" style="margin-left:30px"><b>Login</div><br>

Now I want to change the language based on the seleted radio button. I could'nt get the value of the radio button. For example if I check on arabic, it should change to arabic Please help

Upvotes: 0

Views: 4253

Answers (2)

Mihai Matei
Mihai Matei

Reputation: 24276

You can try something like this:

Working demo

Javascript

var languages = null;

$(document).ready(function(){
    // do your ajax here and set the languages variable
languages = {"lang":
                {
                    "english":{
                        "login":"Login"
                    },
                    "arabic":{
                        "login":"دخول"
                    }
                }
            };

  $('input[name="radio-choice"]').click(function(){
    if ($(this).is(':checked')) {
        $('#login-label b').text(languages.lang[$(this).data('language')].login);
    }
  });
});

HTML:

<input type="radio" name="radio-choice" id="Language-arabic" data-language="arabic" value="Arabic"/>
<label for="radio-choice-1">Arabic</label>

<input type="radio" name="radio-choice" id="Language-english" data-language="english" value="English"/>
<label for="radio-choice-4">English</label>

<div><label for="declarationNumber" style="margin-left:30px" id="login-label"><b>Login</b></label></div>

Upvotes: 2

neel shah
neel shah

Reputation: 2271

You can use the following code to get the value of the radio button

var selectedVal = "";
var selected = $("input[type='radio']:checked");
if (selected.length > 0) {
  selectedVal = selected.val();
}

Upvotes: 1

Related Questions