Using Translation Services within ASP.NET MVC 3 and jQuery
Posted by: Malcolm Sheridan ,
on 3/25/2011,
in
Category ASP.NET MVC
Abstract: The following article demonstrates how to use Microsoft’s Translation service within your ASP.NET MVC application using jQuery.
Every once in a while, you have text that you need to translate. I ran into this recently where the user would login, go to a specific page and be able to type in text and have it translated on the fly. After some research I found that Microsoft had a service called Microsoft Translation Service. This is an online service which can be accessed via AJAX, HTTP or SOAP. Because I wanted this to run on the client, I stuck with AJAX. I’m sure there are other services out there which can do this just as good, but I used Microsoft’s product and found it to be good. And here what I found.
Creating Your AppID
Before you can do anything you’ll need to create a Bing API AppID. The ID is passed as a parameter to the translation service to identity you. Without it you won’t be able to do anything. You’ll need to visit this site and follow the instructions to create the AppID.
Let’s get started. I’m using MVC 3 in this demo but there’s nothing stopping you taking the same code and dropping it into a Web Forms application.
The translation service can run purely through JavaScript. This is a bonus as I don’t want to touch server code. The URL of the service is:
http://api.microsofttranslator.com/V2/ajax.svc/Translate
The parameters that you pass to the service are outlined below.
-
text – the text to be translated
-
to – the target language
-
appid – your AppID to uniquely identify yourself
-
oncomplete – the JavaScript function that is invoked once the service has returned successfully
The entire JavaScript is below. I’ve used closures in this example as I always try to use this technique when working with JavaScript. Find out more about closures here.
Once the DOM has finished loading, I’m setting up the functions to handle the event when the user submits the form. I’m doing this as I want to send the form via Ajax and want to avoid the page refresh.
When the user submits the form, the JavaScript function text.translate is invoked. This calls the translation service and passes the data to it. This injects a script tag into the head of the document. If you’re using Firebug, you’ll see the script tag that is injected into the page whilst the service is being called.
Once the service has finished, the injected script tag is removed from the DOM and the oncomplete function is invoked and the results are displayed to the user.
It didn’t take long to get this working. This was an easy way for the users to translate text when they needed it on the fly. Thanks Microsoft!!
The entire source code of this article can be downloaded over here
This article has been editorially reviewed by Suprotim Agarwal.
C# and .NET have been around for a very long time, but their constant growth means there’s always more to learn.
We at DotNetCurry are very excited to announce The Absolutely Awesome Book on C# and .NET. This is a 500 pages concise technical eBook available in PDF, ePub (iPad), and Mobi (Kindle).
Organized around concepts, this Book aims to provide a concise, yet solid foundation in C# and .NET, covering C# 6.0, C# 7.0 and .NET Core, with chapters on the latest .NET Core 3.0, .NET Standard and C# 8.0 (final release) too. Use these concepts to deepen your existing knowledge of C# and .NET, to have a solid grasp of the latest in C# and .NET OR to crack your next .NET Interview.
Click here to Explore the Table of Contents or Download Sample Chapters!
Was this article worth reading? Share it with fellow developers too. Thanks!
Malcolm Sheridan is a Microsoft awarded MVP in ASP.NET, a Telerik Insider and a regular presenter at conferences and user groups throughout Australia and New Zealand. Being an ASP.NET guy, his focus is on web technologies and has been for the past 10 years. He loves working with ASP.NET MVC these days and also loves getting his hands dirty with jQuery and JavaScript. He also writes technical articles on ASP.NET for SitePoint and other various websites. Follow him on twitter @
malcolmsheridan