Tarayıcı ı konsoluna nasıl bir js kod yazarsam seçimleri o ...

Kodları jQuery kullanarak hazırladım. Vanilla Javascript ile yazmak istersen aynı mantığı kullanabilirsin.

Örnek olarak gönderdiğin sayfada bulunan yapıda 'country' dropdown elementinin değeri değiştiğinde hemen altında bulunan 'state' dropdown elementinin seçenekleri bir ajax isteği yardımıyla güncelleniyor. Yani country dropdown elementinden USA seçildiğinde USA ile ilişkili olan değerler 'state' dropdown elementine yükleniyor. Bu sebeple üç dropdown elementinin değerini tam olarak aynı anda belirtmen mümkün olmuyor. Eğer işin içinde bir ajax isteği olmasaydı basitce aşağıdaki satırlar yardımıyla üç elementin değerini atayabilirdik.

$('#country').val('1'); // USA
$('#state').val('4'); // New York
$('#city').val('11'); // New York City

Bizim durumumuzda dropdown elementlerine değerlerini sırasıyla atamamız gerekiyor.  Aşağıdaki kodu inceleyecek olursak, bir dropdown elementine değer atanıyor sonrasında değer atanan elementin 'change' eventi tetikleniyor bu sayede ilişkili olan diğer dropdown elementinin seçeneklerinin ajax ile güncellenmesi sağlanıyor. Ardından değer atama ve tetikleme işlemleri belirtilen diğer elementler için de gerçekleştiriliyor ve döngü tamamlanıyor.

Döngü içerisinde setTimeout() fonksiyonunun kullanılmasının sebebi her bir değer atama ve tetikleme işleminin gecikmeli olarak gerçekleşmesini sağlamak. Gecikme değerini varsayılan olarak 500ms olarak atadım.

// 'elementId:value' formatında bir obje tanımlıyorum
let elementValueObject = {
	// elementid: value
	country: '1',
	state: '4',
	city: '11',
};

// Parametre ile verilen elementId ve value değerlerini kullanarak
// Döngü yardımıyla elementler için değer atama ve tetikleme işlemi gerçekleştireceğim fonksiyon
function setValuesOfElements(elementValueObject = {}, delay = 500) {
	let counter = 1;
	let element;

	for (const [key, value] of Object.entries(elementValueObject)) {
		setTimeout(() => {
			element = $(`#${key}`);
			element.val(`${value}`);
			element.trigger('change');
			console.log(`${key} set to ${value}`);
		}, delay * counter++);
	}
}

// Tanımladığım fonksiyona oluşturduğum objeyi ve gecikme süresini belirten parametreleri gönderiyorum.
setValuesOfElements(elementValueObject, 500);

Kodu daha iyi anlayabilmek için aşağıdaki bağlantıları incelemeni öneririm.

Döngü içerisinde setTimeout() fonksiyonunun kullanımı: https://stackoverflow.com/a/19221788

Javascript Object.entries() ile for-of döngüsü kullanımı hakkında: https://developer.mozilla.org/tr/docs/Web/JavaScript/Reference/Global_Objects/Object/entries

jQuery trigger() fonksiyonu: https://api.jquery.com/trigger/