Java Script help එකක්!!!

isurutmv · Jun 21, 2017

මචන් මට Assignment එකකට Country Code Generator එකක් හදන්න තියෙනවා මම එක හදන්න හැදුවේ පහල තියෙන විදිහට

Code:

 <!DOCTYPE html>
<html>
<head>
<script>
function populate(){
	var s1 = document.getElementById("slct1");
	
	
	if(s1.value == "Sri Lanka"){
		alert("+94");
	} else if(s1.value == "US"){
		alert("001");
	} else if(s1.value == "UK"){
		alert("002");
	}
	
}
</script>
</head>
<body>
<h2>Select Country</h2>
<hr />
Choose Country:
<select id="slct1" name="slct1">
 <option>Sri Lanka</option>
 <option>US</option>
 <option>UK</option>
 
</select>
 <button onclick="populate()">  Click me</button>

<hr />

</body>
</html>

ඕක කරන්න ඔයිට වඩා ලේසි ක්‍රමයක් නැද්ද බන් රටවල් ටික එකින් එක දානවට වැඩ මොකක් හරි ක්‍රමයක් නැද්ද ඔය ඔක්කොම එක පාර දාන්න

sajith.xp.pk · Jun 21, 2017

For Loop එකක් ගහල ඒක අස්සෙ ඔබපන්.. මලයි අගයි විතරක් ඉතුරු වෙන්න ඉතුරු ටික DB එකකට දාල.... ආරම්භක එක සහ අවසාන එක මැනුවල් ඔබපන්.. මැද ඒව එකම වගේනෙ.. ගහපන් PHP Loop එකක්. ගහල අස්සෙ ගහපන් js loop වෙන්න.

Lakshan-Seram · Jun 21, 2017

hmm mama oka kara nam karanne..

array or json object ekakata code ekai country ekai dala eka parse karana eka

PHP:

countryCodes =   {
  "LK" : "+94",
  "UK" : "+02",
  "US" : "+03"
};

ishan0001 · Jun 21, 2017

Get country data from an API as JSON. Use it to populate the dropdown. Filter the JSON on button cllick and find the country code.

BTW this solution requires jQuery. If you need pure javascript, It's better to hardcode a country data json in the script than get it from an api

PHP:

<!DOCTYPE html>
<html>
    <head>
        <script
              src="https://code.jquery.com/jquery-3.2.1.min.js"
              integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
              crossorigin="anonymous">
        </script>

        <script type="text/javascript">
            
            var countries;

            function populate(){
                var s1 = document.getElementById("slct1");

                var selectedCountry = countries.filter(function(country) {
                  return country.name ===  s1.value;
                });

                if(selectedCountry[0] !== undefined)
                    alert('+' + selectedCountry[0].callingCodes[0]);
                else
                    alert('Invalid country');
            }

            $(document).ready(function() {
                    $.getJSON("https://restcountries.eu/rest/v2/all", function(json){
                            countries = json;
                            $.each(countries, function(i, country) {
                            $('#slct1').append($('<option>').text(country.name).attr('value', country.name));
                        });
                    });
                }        
            );
            
        </script>
    </head>
    <body>
        <h2>Select Country</h2>
        <hr />
        <label for="slct1">Choose Country:</label>
        <select id="slct1" name="slct1"></select>    
        <button onclick="populate()">  Click me</button>
        <hr />
    </body>
</html>

Save
Save
Save

isurutmv · Jun 22, 2017

ishan0001 said:

Get country data from an API as JSON. Use it to populate the dropdown. Filter the JSON on button cllick and find the country code.

BTW this solution requires jQuery. If you need pure javascript, It's better to hardcode a country data json in the script than get it from an api

PHP:

<!DOCTYPE html>
<html>
    <head>
        <script
              src="https://code.jquery.com/jquery-3.2.1.min.js"
              integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
              crossorigin="anonymous">
        </script>

        <script type="text/javascript">
            
            var countries;

            function populate(){
                var s1 = document.getElementById("slct1");

                var selectedCountry = countries.filter(function(country) {
                  return country.name ===  s1.value;
                });

                if(selectedCountry[0] !== undefined)
                    alert('+' + selectedCountry[0].callingCodes[0]);
                else
                    alert('Invalid country');
            }

            $(document).ready(function() {
                    $.getJSON("https://restcountries.eu/rest/v2/all", function(json){
                            countries = json;
                            $.each(countries, function(i, country) {
                            $('#slct1').append($('<option>').text(country.name).attr('value', country.name));
                        });
                    });
                }        
            );
            
        </script>
    </head>
    <body>
        <h2>Select Country</h2>
        <hr />
        <label for="slct1">Choose Country:</label>
        <select id="slct1" name="slct1"></select>    
        <button onclick="populate()">  Click me</button>
        <hr />
    </body>
</html>

Save
Save
Save

adoo thanks mcn mata me code eka poddak explain karala denna puluwanda bn :yes:

samsungi7 · Jun 22, 2017

API eken ganna eka lesi bn

kolavari · Jun 22, 2017

samsungi7 said:
API eken ganna eka lesi bn

api call ekak oneda bn country codes ganna.. :no:

therumak na boruwata api request ekak wadi wena eka witharai wenne...

Countries dawasa gane wenas wenne nahane..country codes wenas wennth na..oke monaada web service ekakin ganna thiyenne? :rofl:

DB ekaka store karala e tika php or js (ajax) walin aran loop karanna thiyenne :yes:

ishan0001 · Jun 22, 2017

isurutmv said:
adoo thanks mcn mata me code eka poddak explain karala denna puluwanda bn

මුලින්ම API call එකක් දානව country data ටික variable එකකට ගන්න. ඒකට use කරන්නෙ GetJSON. ඒකට url එකයි callback function එකකුයි දාන්න ඕන. Data ටික ආවොත් ඒ ටික දාල callback function එක call වෙනව. ඒක ඇතුලෙ ලියල තියනව data json එකේ හැම object එකකටම අදාලව dropdown එකට option element එක ගානෙ add කරන්න කියල. ඔය ටික ඔක්කොම කරන්නෙ document ready උනාම. ඒ කියන්නෙ page එක ලෝඩ් වෙලා ඉවර උනාම.

ඊලගට dropdown එකෙන් කැමති රට තෝරල button එක click කලාම populate function එක call වෙනව. ඒකෙ ලියල තියෙන්නෙ dropdown එකේ select කරල තියන value එක name එක විදියට තියන json එක return කරන්න කියල. මේකෙන් ඇත්තටම return වෙන්නෙ අදාල json එක විතරක් තියන json array එකක්. ඒ නිසා අපිට අදාල json object එක refer කරන්න json array එකේ 0th index එක ගන්න වෙනව (selectedCountry[0]). ඒකෙත් callingCodes කියන්නෙ තව json එකක්. ඒකෙ 0h index එකේ තමයි අවශ්‍ය dial code එක තියෙන්නෙ. ඊට පස්සෙ alert එකක් දාල ඒක display කරන්න තියෙන්නෙ.

api එකෙන් country එකේ තව ගොඩක් විස්තර එනව. ඒ නිසා api response එක ටිකක් bulky. ඔය මට්ටමේ program එකක් performance critical නැති නිසා ඒක අව්ලක් වෙන්නෙ නෑ. optimize කරන්න ඕනම නම් country code එකයි dial code එකයි විතරක් දෙන api තියෙනව ඒකක් use කරන්න. ඔය වැඩේට විතරක් නම් data ටික databse එකක දාගෙන නටන්න ඕන නෑ.

Save

Search

Latest ads

Java Script help එකක්!!!

isurutmv

Well-known member

sajith.xp.pk

Well-known member

Lakshan-Seram

Well-known member

ishan0001

Active member

isurutmv

Well-known member

samsungi7

Well-known member

kolavari

Well-known member

ishan0001

Active member

Similar threads