javascriptgoogle-translategoogle-translator-toolkit

How to Do Google transliteration based on Class not Id


I am doing a Tamil Language based Web Application. In My application, l used Dynamic Fields to Add User Details. So, Dynamic Fields have multiple ids how to do this or How to use Google Transliteration based on Class?

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
  // Load the Google Transliteration API
  google.load("elements", "1", {
    packages: "transliteration"
  });

  function onLoad() {
    var options = {
      sourceLanguage: 'en',
      destinationLanguage: 'ta',
      shortcutKey: 'ctrl+m',
      transliterationEnabled: true
    };

    // Create an instance on TransliterationControl with the required
    var control = new google.elements.transliteration.TransliterationControl(options);

    // Enable transliteration in the textfields with the given ids.
    var ids = ['temrorary_address', 'permanant_address', 'bankbranch', 'member_name', 'father_husband', 'workingoffice_address', ];
    control.makeTransliteratable(ids);

    // Show the transliteration control which can be used to toggle between
    // English and Hindi and also choose other destination language.
    control.showControl('translControl');
  }
  google.setOnLoadCallback(onLoad);
</script>

Solution

  • makeTransliteratable input may be not only an array of ids but element references as well. So you can write:

    // Enable transliteration in the textfields with the given Class.
    var elements = document.getElementsByClassName('Type-Your-Class-Here');
    control.makeTransliteratable(elements);
    

    But if you're adding fields dynamically, it does not help. For fields added dynamically you have to call control.makeTransliteratable every time you add new field.