Sunday, March 13, 2016

Localization in SharePoint 2013 JavaScript Object Model


Introduction

The following approach is the simplest one for using resources in JavaScript file for SharePoint 2013, three quick steps to use resource files in your JavaScript file.

Resource File


We assume that you have created two resource files for example (.ar-sa, en-us) to localize your application that will be deployed to resources folder as below figure.
Figure 1
Add new resource key named “lan” in both en-us and ar-sa files as below figures.
Figure 2


Figure 3
Now, you can test the existence of your resource files by typing the URL of resource file as below figure 4.
Figure 4



If it exists, it will be downloaded for you as below figure 5.
Figure 5





You can see that Res var contains all resources so when you access resource, you will call it as below: Ex: Res.AddNew ,Res.modified…etc as figure 6.


Figure 6


Script Link

Now, you can go to your custom master page or any other place (webpart, user control..etc.) where you want to include the link of resource file, in my case ( I will include it in master page) as below figure.
name = it respresent the name of your resource file name.
culture= it respresent the language of resource file, we set  the value to be a resource key in order to apply localization on the application.
<script type="text/javascript" src="/_layouts/ScriptResx.ashx?culture=<asp:Literal runat='server' Text='<%$Resources:MIP,lan;%>' />&name=MIP"> </script>


Script Link

JavaScript File

You can use resource values in your JavaScript file, but make sure that resource key starts with lowercase letter, assume that you have a resource key named “modified” in your resource file, you will call it from Res values collection of objects as below.

<script type=”text/javascript”>
alert(Res.modified);
</script>
- Note: Resource name should be start with lowercase letter. like (modified, created)