How to enable Google Transliteration for multiple dynamic Textboxes (ASP.Net)

Question

Here's the sample (available everywhere) code for integrating Google Transliteration code in ASP.Net Pages.

But my question is, how to enable transliteration in TextBoxes which will be generated on runtime? This script demands the ID of the textbox for applying Transliteration. But my textboxes will be generated on runtime.

Need an alternative for this line of code:
control.makeTransliteratable(['transliterateTextarea']);

  //Script Starts here

  // Load the Google Transliterate API
  google.load("elements", "1", {
        packages: "transliteration"
      });

  function onLoad() {
    var options = {
        sourceLanguage:
            google.elements.transliteration.LanguageCode.ENGLISH,
        destinationLanguage:
            [google.elements.transliteration.LanguageCode.HINDI],
        shortcutKey: 'ctrl+g',
        transliterationEnabled: true
    };

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

    // Enable transliteration in the textbox with id
    // 'transliterateTextarea'.
    control.makeTransliteratable(['transliterateTextarea']);
  }
  google.setOnLoadCallback(onLoad);

 //End here

mlg · Accepted Answer · 2013-06-04 06:30:36Z

2

Use RegisterStartupScript. RegisterStartupScript will be be executed after page is loaded completely.

function EnableTransalation(ctrlId) {
    //Script Starts here

    // Load the Google Transliterate API
    google.load('elements', '1', {
        packages: 'transliteration'
    });

    function onLoad() {
        var options = {
            sourceLanguage:
            google.elements.transliteration.LanguageCode.ENGLISH,
            destinationLanguage:
            [google.elements.transliteration.LanguageCode.HINDI],
            shortcutKey: 'ctrl+g',
            transliterationEnabled: true
        };

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

        // Enable transliteration in the textbox with id
        // 'transliterateTextarea'.
        control.makeTransliteratable(["'" + ctrlId + "'"]);
    }
    google.setOnLoadCallback(onLoad);

    //End here
}

In the code behind,

protected override void OnPreRender(EventArgs e)
{
  Page.ClientScript.RegisterStartupScript(GetType(), "EnableTransalation", "EnableTransalation('" + ctrl.ClientID + "')", true);
}

answered Jun 4, 2013 at 6:30

mlg

1,1911 gold badge14 silver badges33 bronze badges

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

3 Comments

Ish Goel Over a year ago

Thanks, and sorry for late reply. Further, is it possible to always allow only One Language? I dont want the user to be able to Toggle between languages.

mlg Over a year ago

@IshGoel - You are using a dropdown list to load the languages?

Ish Goel Over a year ago

Not exactly. Language preference will be stored in Database. I want all user input always in One language as stored in datbase

Manikandan · Accepted Answer · 2015-01-30 13:38:01Z

2

First you have to set all text box class name as hindiFont.

Use this Code:

google.load("elements", "1", {
    packages: "transliteration"
});

function onLoad() {
    var options = {
        sourceLanguage: [google.elements.transliteration.LanguageCode.ENGLISH],
        destinationLanguage: [google.elements.transliteration.LanguageCode.HINDI],
        transliterationEnabled: true,
        shortcutKey: 'ctrl+g'

    };

    var control = new google.elements.transliteration.TransliterationControl(options);

    $('.hindiFont').each(function(){
        var id = this.id;
        control.makeTransliteratable([id]);
    })
}
google.setOnLoadCallback(onLoad);

answered Jan 30, 2015 at 13:38

Manikandan

211 bronze badge

Collectives™ on Stack Overflow

How to enable Google Transliteration for multiple dynamic Textboxes (ASP.Net)

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related