You can use jQuery ajax function to make an asynchronous call to the server and retrieve data. Once the data is returned, you can populate both dropdowns using JavaScript. Here’s an example:

First, create your controller action that returns the data for the dropdowns:

public JsonResult GetDropdownData()
{
var data = new List<SelectListItem>
{
new SelectListItem { Value = "1", Text = "Option 1" },
new SelectListItem { Value = "2", Text = "Option 2" },
new SelectListItem { Value = "3", Text = "Option 3" }
};

return Json(data, JsonRequestBehavior.AllowGet);
}

Next, create your two dropdowns in your view:

<select id=”dropdown1″></select>
<select id=”dropdown2″></select>

Then, add the following jQuery code to your view:

Note: Include Jquery CDN

$(document).ready(function() {
$.ajax({
url: '/Controller/GetDropdownData',
type: 'GET',
dataType: 'json',
success: function(data) {
// Populate the first dropdown
var dropdown1 = $('#dropdown1');
$.each(data, function(index, item) {
dropdown1.append($('<option></option>').val(item.Value).html(item.Text));
});

// Populate the second dropdown
var dropdown2 = $('#dropdown2');
$.each(data, function(index, item) {
dropdown2.append($('<option></option>').val(item.Value).html(item.Text));
});
}
});
});

This code makes an AJAX call to the GetDropdownData action and retrieves the data. It then populates both dropdowns with the same data. You can modify the code to populate the dropdowns with different data if necessary.