You may use below steps to achieve language translation for custom form which is used in SharePoint multilingual site.
Create List named as: Translations
Above list contains information of translation for different language. I have used language pack Hindi for
Language Code: 1081 for SharePoint Site.
Columns detail for Translation list:
Title: Label code text. You can compare text by Title column to assign value +
TextToDisplay : English Language Text
TextToDisplay2: Hindi Or Other Language Text
Assign Language Translation Value to form control as shown in below code
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-js/1.4.0/css/fabric.min.css">
<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-js/1.4.0/css/fabric.components.min.css">
<script type="text/javascript" src="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-js/1.4.0/js/fabric.min.js"></script>
<title>Responsive Test</title>
</head>
<body>
<script type="text/javascript">
$(document).ready(function () {
LaunchResponsivePage();
if (_spPageContextInfo.currentLanguage == 1033) {
alert("User Selected Language :English == Language Code" + _spPageContextInfo.currentLanguage);
} else {
alert("User Selected Language : Hindi == Language Code" + _spPageContextInfo.currentLanguage);
}
/********************************GEt Value from Translation List and Set Value to Controls Code Start ****************************************/
var listName = "Translations";
var url = _spPageContextInfo.webAbsoluteUrl;
var condition = "$select=Title,TextToDisplay,TextToDisplay2'";
getListItems(listName, url, condition, function (data) {
var items = data.d.results;
for (var i = 0; i < items.length; i++) {
if (_spPageContextInfo.currentLanguage == 1033)
{
if (items[i].Title == "Name") { $('#lname').html(items[i].TextToDisplay);}
if (items[i].Title == "City") { $('#lcity').html(items[i].TextToDisplay);}
if (items[i].Title == "Choose a programming language") { $('#lchooseprogram').html(items[i].TextToDisplay);}
if (items[i].Title == "Send me promotional emails from Microsoft") { $('#lpromotional').html(items[i].TextToDisplay);}
if (items[i].Title == "Male") { $('#lmale').html(items[i].TextToDisplay);}
if (items[i].Title == "Female") { $('#lfemale').html(items[i].TextToDisplay);}
}
else
{
if (items[i].Title == "Name") { $('#lname').html(items[i].TextToDisplay2);}
if (items[i].Title == "City") { $('#lcity').html(items[i].TextToDisplay2);}
if (items[i].Title == "Choose a programming language") { $('#lchooseprogram').html(items[i].TextToDisplay2);}
if (items[i].Title == "Send me promotional emails from Microsoft") { $('#lpromotional').html(items[i].TextToDisplay2);}
if (items[i].Title == "Male") { $('#lmale').html(items[i].TextToDisplay2);}
if (items[i].Title == "Female") { $('#lfemale').html(items[i].TextToDisplay2);}
}
}
}, function (data) {
alert("Ooops, an error occured. Please try again");
});
/********************************GEt Value from Translation List and Set Value to Controls Code End ****************************************/
});
</script>
<div id="ResponsiveTestDiv">
<div class="ms-Grid">
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-u-sm12">
<div class="ms-fontSize-xl"> SharePoint Language Translation Form </div>
</div>
</div>
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-u-sm12">
<div class="ms-TextField">
<label id="lname" class="ms-Label is-required">Name</label>
<input id="txtName" class="ms-TextField-field is-required" type="text" value="" placeholder=""> </div>
</div>
</div>
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-u-sm12">
<div class="ms-TextField">
<label id="lcity" class="ms-Label">City</label>
<input id="txtCity" class="ms-TextField-field" type="text" value="" placeholder=""> </div>
</div>
</div>
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-u-sm12">
<div class="ms-Dropdown" tabindex="0">
<label class="ms-Label" id="lchooseprogram">Choose a programming language</label>
<i class="ms-Dropdown-caretDown ms-Icon ms-Icon--ChevronDown"></i>
<select id="dropdownProg" class="ms-Dropdown-select">
<option>Choose a programming language</option>
<option>Javascript</option>
<option>C#</option>
<option>F#</option>
<option>Python</option>
<option>Other</option>
</select>
</div>
</div>
</div>
<div class="ms-ChoiceFieldGroup" id="choicefieldgroup" role="radiogroup">
<div class="ms-ChoiceFieldGroup-title">
<label class="ms-Label is-required" id="lgender">Gender</label>
</div>
<ul class="ms-ChoiceFieldGroup-list">
<li class="ms-RadioButton">
<input tabindex="-1" type="radio" class="ms-RadioButton-input">
<label role="radio" class="ms-RadioButton-field" tabindex="0" aria-checked="false" name="choicefieldgroup">
<span class="ms-Label">Option 1</span>
</label>
</li>
<li class="ms-RadioButton">
<input tabindex="-1" type="radio" class="ms-RadioButton-input">
<label role="radio" class="ms-RadioButton-field" tabindex="0" aria-checked="false" name="choicefieldgroup">
<span class="ms-Label">Option 2</span>
</label>
</li>
</ul>
</div>
<div class="ms-CheckBox">
<input tabindex="-1" type="checkbox" class="ms-CheckBox-input">
<label role="checkbox" class="ms-CheckBox-field" tabindex="0" name="checkboxa">
<span class="ms-Label" id="lpromotional">Send me promotional emails from Microsoft</span>
</label>
</div>
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-u-sm6">
<button type="button" id="buttonSave" class="ms-Button ms-Button--primary">
<span class="ms-Button-label">Save</span>
</button>
<button id="buttonCancel" type="button" class="ms-Button">
<span class="ms-Button-label">Cancel</span>
</button>
</div>
</div>
</div>
</div>
</body>
<script>
function LaunchResponsivePage() {
MakeResponsive();
InitializeComponents();
AddEventHandlers();
}
// READ operation
// listName: The name of the list you want to get items from
// siteurl: The url of the site that the list is in.
// success: The function to execute if the call is sucesfull
// failure: The function to execute if the call fails
function getListItems(listName, siteurl, condition, success, failure) {
$.ajax({
url: siteurl + "/_api/web/lists/getbytitle('" + listName + "')/items?" + condition,
method: "GET",
async: false,
headers: {
"Accept": "application/json; odata=verbose"
},
success: function (data) {
success(data);
},
error: function (data) {
failure(data);
}
});
}
function MakeResponsive() {
$("#s4-ribbonrow").hide(); //hide the ribbon row
$("#s4-workspace").children().hide(); //hide all elements in workspace
var div = $("#ResponsiveTestDiv"); //move the div to make it visible
$("#s4-workspace").append(div); //add the div after s4-workspace
}
function InitializeComponents() {
var TextFieldElements = document.querySelectorAll(".ms-TextField");
for (var i = 0; i < TextFieldElements.length; i++) {
new fabric['TextField'](TextFieldElements[i]);
}
var ChoiceFieldGroupElements = document.querySelectorAll(".ms-ChoiceFieldGroup");
for (var i = 0; i < ChoiceFieldGroupElements.length; i++) {
new fabric['ChoiceFieldGroup'](ChoiceFieldGroupElements[i]);
}
var CheckBoxElements = document.querySelectorAll(".ms-CheckBox");
for (var i = 0; i < CheckBoxElements.length; i++) {
new fabric['CheckBox'](CheckBoxElements[i]);
}
var DropdownHTMLElements = document.querySelectorAll('.ms-Dropdown');
for (var i = 0; i < DropdownHTMLElements.length; ++i) {
var Dropdown = new fabric['Dropdown'](DropdownHTMLElements[i]);
}
}
function AddEventHandlers() {
$("#buttonSave").click(function () {
var output = "Hello " + $("#txtName").val();
alert(output);
return false;
});
$("#buttonCancel").click(function () {
alert("Cancelled");
return false
});
}
</script>
</html>
Once we implement above code to form it will appear as below for Hindi and English language site.
Form in Hindi Language Site
Form in English Language Site
Nilesh Rathod 
Pingback: SharePoint Custom Form Language Translation with Multilingual Site — Nilesh Rathod – SutoCom Solutions