jQuery with callouts and Lightning Process

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/multiple-select/1.2.0/multiple-select.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/multiple-select/1.2.0/multiple-select.js"></script>
<script>
$(document).ready(function() {
$.get("https://restcountries.eu/rest/v2/all", function(response) {
$.each(response, function(idx, obj) {
var select = $("#countValues");
$('<option>').val(obj.name).text(obj.name).appendTo(select);
});
});
var select1 = $("#myTable");
select1.empty();
var cstmTr1 = '<thead style="background: lightskyblue;"><tr>' +
'<th>Flag</th>' +
'<th>Name</th>' +
'<th>TopLevel Domain</th>' +
'<th>Alpha Code</th>' +
'<th>Alpha Code</th>' +
'<th>Calling Codes</th>' +
'<th>Capital</th>' +
'<th>Alt Spellings</th>' +
'<th>Region</th>' +
'<th>Subregion</th>' +
'<th>Population</th>' +
'<th>Latlng</th>' +
'<th>Demonym</th>' +
'<th>Area</th>' +
'<th>Gini</th>' +
'<th>Timezones</th>' +
'<th>Native Name</th>' +
'<th>Numeric Code</th>' +
'<th>Currencies</th>' +
'<th>Languages</th>' +
'</tr></thead>';
select1.attr('border', 2);
$(cstmTr1).appendTo(select1);
$('<tbody>').appendTo(select1);
var url = "https://restcountries.eu/rest/v2/all";
var select = $("#myTable tbody");
$.get(url, function(response) {
$.each(response, function(idx, obj) {
var cstmTr = '<tr>' +
'<td><img src="' + obj.flag + '" style="width:50px;height:50px;"/></td>' +
'<td>' + obj.name + '</td>' +
'<td>' + obj.topLevelDomain + '</td>' +
'<td>' + obj.alpha2Code + '</td>' +
'<td>' + obj.alpha3Code + '</td>' +
'<td>' + obj.callingCodes + '</td>' +
'<td>' + obj.capital + '</td>' +
'<td>' + obj.altSpellings + '</td>' +
'<td>' + obj.region + '</td>' +
'<td>' + obj.subregion + '</td>' +
'<td>' + obj.population + '</td>' +
'<td>' + obj.latlng + '</td>' +
'<td>' + obj.demonym + '</td>' +
'<td>' + obj.area + '</td>' +
'<td>' + obj.gini + '</td>' +
'<td>' + obj.timezones + '</td>' +
'<td>' + obj.nativeName + '</td>' +
'<td>' + obj.numericCode + '</td>' +
'<td>' + dynamicOption(obj.currencies) + '</td>' +
'<td>' + dynamicOption1(obj.languages) + '</td>' +
'</tr>';
$(cstmTr).appendTo(select);
});
});
});
$(document).on("change", "#countValues", function() {
var select1 = $("#myTable");
select1.empty();
var cstmTr1 = '<thead style="background: lightskyblue;"><tr>' +
'<th>Flag</th>' +
'<th>Name</th>' +
'<th>TopLevel Domain</th>' +
'<th>Alpha Code</th>' +
'<th>Alpha Code</th>' +
'<th>Calling Codes</th>' +
'<th>Capital</th>' +
'<th>Alt Spellings</th>' +
'<th>Region</th>' +
'<th>Subregion</th>' +
'<th>Population</th>' +
'<th>Latlng</th>' +
'<th>Demonym</th>' +
'<th>Area</th>' +
'<th>Gini</th>' +
'<th>Timezones</th>' +
'<th>Native Name</th>' +
'<th>Numeric Code</th>' +
'<th>Currencies</th>' +
'<th>Languages</th>' +
'</tr></thead>';
select1.attr('border', 2);
$(cstmTr1).appendTo(select1);
$('<tbody>').appendTo(select1);
var countryValue = this.value;
var url = "https://restcountries.eu/rest/v2/name/" + countryValue;
var select = $("#myTable tbody");
$.get(url, function(response) {
$.each(response, function(idx, obj) {
var cstmTr = '<tr>' +
'<td><img src="' + obj.flag + '" style="width:50px;height:50px;"/></td>' +
'<td>' + obj.name + '</td>' +
'<td>' + obj.topLevelDomain + '</td>' +
'<td>' + obj.alpha2Code + '</td>' +
'<td>' + obj.alpha3Code + '</td>' +
'<td>' + obj.callingCodes + '</td>' +
'<td>' + obj.capital + '</td>' +
'<td>' + obj.altSpellings + '</td>' +
'<td>' + obj.region + '</td>' +
'<td>' + obj.subregion + '</td>' +
'<td>' + obj.population + '</td>' +
'<td>' + obj.latlng + '</td>' +
'<td>' + obj.demonym + '</td>' +
'<td>' + obj.area + '</td>' +
'<td>' + obj.gini + '</td>' +
'<td>' + obj.timezones + '</td>' +
'<td>' + obj.nativeName + '</td>' +
'<td>' + obj.numericCode + '</td>' +
'<td>' + dynamicOption(obj.currencies) + '</td>' +
'<td>' + dynamicOption1(obj.languages) + '</td>' +
'</tr>';
$(cstmTr).appendTo(select);
});
});
});
function dynamicOption(parameter1) {
$select = $('<select></select>', {
"class": "fazu"
});
var tempString = '';
$.each(parameter1, function(index, value) {
tempString += value.code+",";
tempString += value.name+",";
tempString += value.symbol;
});
for(var temp in tempString.split(",")){
console.log("tempString value ::"+tempString.split(",")[temp]);
var $option = $("<option></option>", {
"text": tempString.split(",")[temp],
"value": tempString.split(",")[temp]
});
$select.append($option);
}
return $select.prop("outerHTML");
}
function dynamicOption1(parameter1) {
$select = $('<select></select>', {"class": "fazu"});
var tempString = '';
$.each(parameter1, function(index, value) {
console.log(JSON.stringify(value));
tempString += value.iso639_1+","+value.iso639_2+","+value.name+","+value.nativeName;
});
for(var temp in tempString.split(",")){
console.log("tempString value ::"+tempString.split(",")[temp]);
var $option = $("<option></option>", {
"text": tempString.split(",")[temp],
"value": tempString.split(",")[temp]
});
$select.append($option);
}
return $select.prop("outerHTML");
}
</script>
</head>
<body>
<select id="countValues"></select>
<br/>
<table id="myTable">
<tbody></tbody>
</table>
</body>
</html>


-

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)

Featured

What is Cryptography in salesforce and what are all the algorithms provided by them ?

A). It is a security protocal between two systems. Lets say we are integration two systems without any encrytion mechanism then hackers wil...

Popular