creating the dropdown text and value returned from the servlet

[Ronnie09]

I have created one servlet which runs whenever we select the dropdown and then it printwrite the key and value that should the dropdown text and value 

function callToServlet(txt){
		$.ajax({
  			type:'GET',
                        data: {
                        country : txt //let it be India
               },
        	url: '/bin/residential/country-dropdown',
            success: function(txt) {

	    console.log('success');
                console.log(txt);  //This is printing Key=Up, Value="Lucknow",etc
			}
		})
    }

Not I have to make it a drop down from the txt

[BrianKasingli · Accepted solution]

The proper way to do this is using the Granite UI DataSource factory. 

You can find examples here:
https://levelup.gitconnected.com/aem-populate-a-drop-down-with-a-data-source-edafada90cc4

https://redquark.org/aem/day-17-granite-datasources/

minimal code: Or you can try out the ACS Commons Generic Lists for countries selection, example here https://sourcedcode.com/blog/aem/re-usable-color-select-in-touch-ui-dialogs-w-acs-commons-generic-li...