Hi i am trying to change DT text based on selected languages I got the alert but not text

Hi i am trying to change DT text based on selected languages I got the alert but not text

iso sioiso sio Posts: 15Questions: 3Answers: 0
edited February 2021 in General
<div class="row" style="margin-top: 50px;">
            <!-- Table -->
            <table id='empTable' class='table table-bordered table-striped' style="width: 100%" data-order='[[ 0, "desc" ]]' data-page-length='15'>
                <thead>
                <tr>
                    <th><span key=2501>Order No</span></th>
                    <th><span key=2502>Client</span></th>
                    <th><span key=2503>Plate</span></th>
                    <th><span key=2504>Carrier</span></th>
                    <th><span key=2505>Operator</span></th>
                </tr>
                </thead>
                
            </table>
        </div>
        </div>
 <script src="pagelang.js"></script>


        <!-- Script -->

 <script type="text/javascript">
  $(document).ready(function() {
    var langMap = {
      En: {
        path: 'English'  
      },
      
      Tr: {
        path: 'Turkish'
      
      }
    };

function getLanguages() {

$('#language li a').click(function(){
  var id = $(this).attr('id');

  if(id=='tr'){
      var lang='Tr'
          mods: {
          sLengthMenu: "Gösterilen _MENU_ Kayıt"
    }
    alert(lang);
  }
  else if(id=='en'){
     var lang='En'
          mods: {
          sLengthMenu: "Show _MENU_ Entries "
    }
     alert(lang);
}

var result = null;
  var path = '//cdn.datatables.net/plug-ins/1.10.13/i18n/';
  $.ajax({
    async: false,  
    url: path + langMap[lang].path + '.json',
    success: function(obj) {
    result = $.extend({}, obj, langMap[lang].mods)
    }
  });
  return result
  });
};
                $('#empTable').DataTable({
                'processing': true,
                'serverSide': true,
                "lengthMenu": [[10,15, 25, 50, 10000], [10,15, 25, 50, "All"]],
                'serverMethod': 'post',
                'ajax': {
                    'url':'ajaxfile.php'
                },
                'columns': [
                    { data: 'orderno' },
                    { data: 'client' },
                    { data: 'plate' },
                    { data: 'carrier' },
                    { data: 'operator' },
                ],
                language: getLanguages()                           
    });                   
});  
</script>




    </body>

</html>

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

Answers

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    This example here shows how to use language files. If that doesn't help, We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

    Cheers,

    Colin

  • iso sioiso sio Posts: 15Questions: 3Answers: 0

    Hi Colin thanks for quick response her is the link https://jsfiddle.net/isosio/f4u6cjdx/

  • iso sioiso sio Posts: 15Questions: 3Answers: 0

    as you may see I can get the selected value as alert but the language changes not

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Ah I see. The language option is an initialisation option, and can't be changed once configured. You're also creating a new event every time the language is changed, which cause a leak. You could do something like this here - where the table is re-initialised on each change. It doesn't work on JS fiddle as the CORS policy kicks in, but it should get going,

    Colin

  • iso sioiso sio Posts: 15Questions: 3Answers: 0

    Dear Colin
    Now I have below Errors
    The requested URL was not found on this server.

    Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.

  • iso sioiso sio Posts: 15Questions: 3Answers: 0
  • iso sioiso sio Posts: 15Questions: 3Answers: 0

    index.php:1 Access to XMLHttpRequest at 'http://cdn.datatables.net/plug-ins/i18n/English.json' from origin 'http://transtasnile.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Ah - it should be https://cdn.datatables.net/plug-ins/1.10.22/i18n/English.json .

    The CORS error will be an issue with your server - see here,

    Colin

  • iso sioiso sio Posts: 15Questions: 3Answers: 0

    Dear Colin
    Yes No more Error with English
    but still it is not switching in to Turkish

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    OK, can you link to your code/test case please. Are you using the basic outline of code that I gave, or are you using the code you had before?

    Colin

  • iso sioiso sio Posts: 15Questions: 3Answers: 0

    Dear Colin
    I'm using the code that you gave me just added post url and was hoping your code could run but your code is just basic outline. Appreciate if you can send me a working one

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    That could code should be good as is, provided you fix those URLs to the language files and address the CORS error.

    Colin

  • iso sioiso sio Posts: 15Questions: 3Answers: 0

    Unfortunately it is not working I would like remind you again that Currently I am able to change table headers but my aim is to change also 'Show entries, search,next previous' etc texts dynamically based on selected language.

  • iso sioiso sio Posts: 15Questions: 3Answers: 0

    Currently it is showing Turkish for 1 second and comes to English again am I missing something like css js?

  • iso sioiso sio Posts: 15Questions: 3Answers: 0

    Dear Colin
    it is working Now Thanks

This discussion has been closed.