CODEWITHSUNDEEP
javascriptjquery
Aravinth E
Aravinth E

Reputation: 491

Web page reload after select values on selectbox

I was tried language change check box. if i choose Tamil means then reload page then Tamil label applied. but select box value reload the default option English. how to change language wise Select box values choose

HTML CODE

<select id="Language" name="Language" class="bootstrap-select buttonstyle">
       <option value="English">English</option>
       <option value="Tamil">தமிழ்</option>
     <option value="Malayalam">മലയാളം</option>
</select>

Jquery Code

$('#Language').on('change', function () {
    var value = $(this).val();
    $.ajax({
        url: 'php/language.php',
        data: {val:value},
        type: 'POST',
        success:function (data) {
            document.location.reload();
            LangLoad(data);
        }
    });
});


function LangLoad(value) {
    $('#Language').val(value);
}

how to solve this....

Upvotes: 1

Views: 1709

Answers (2)

smarber
smarber

Reputation: 5074

It'd be more relevant to rely on the data received from the server too. I assume your server language php

JAVASCRIPT

$('#Language').on('change', function () {
    $('form').submit();
});

HTML & PHP view

<form action="php/language.php" method="POST">
    <select id="Language" name="Language" class="bootstrap-select buttonstyle">
           <?php $html = ''; 
           foreach ($options as $option => $value) {
               if ($value === $selectedValue) {
                   $html .= '<option value='.$value.' selected="selected">'.$option.'</option>';
               } else {
                   $html .= '<option value='.$value.'>'.$option.'</option>';
               }
           }?>
           <?php echo $html; ?>
    </select>
</form>

Upvotes: 1

Jyothi Babu Araja
Jyothi Babu Araja

Reputation: 10282

A work around because didn't get your approach properly.

Consider using localStorage to store selected language

$('#Language').on('change', function () {
    var value = $(this).val();
    $.ajax({
        url: 'php/language.php',
        data: {val:value},
        type: 'POST',
        success:function (data) {
            LangLoad(data); //call this before reloading document
            document.location.reload();
        }
    });
});


function LangLoad(value) {
    localStorage.setItem('language', value);//storing to localStorage
    //$('#Language').val(value); //no need here
}

Getting language value from localStorage

$(document).ready(function(){
    var language = localStorage.getItem('language');
    if(language) {
       $('#Language').val(language);
    }
});

Upvotes: 1

Related Questions