Dojo等效于以下jquery代码

Question

I am working on a project that I wanted to use jquery for, however it's come to light that it is mandatory to write in dojo , I've never worked with it before and am having some trouble reading up online as to how to use it.

Below is the code I was using:

<script>
        window.onload = function() {
            getManager($("#team_name").val());  
        }

        function getManager(team) {
            $.ajax({
                type: "POST",
                url: "getManager.php",
                data: {team:team}
            }).done(function( manager ) {
                $("#manager_name").val(manager);
            });
        }
</script>

Essentially, there is a drop down <selection> field, when selected (and upon window loading) it should prefill the read-only box below it based upon which team is listed. See the below screenshot for a better idea:

I the above code works fine with jquery, I can't seem to find the equivalent for dojo .

This is the html for the selection field:

<select name="team" id="team_name" onchange="getManager(this.value)" type="text" readonly>

and this is the html code for text input field :

<input name="manager_name" id="manager_name" type="text" readonly/>

The code must be written in dojo as the rest of the page does, unless there is a way to override the dojo with jquery?

Answer 1

window.onload = function() {
    getManager(document.getElementById('team_name').value);  
}

function getManager(team) {
    require(["dojo/_base/xhr"], function(xhr){
        xhr.post({
            url:"getManager.php",
            timeout: 4000,
            content: { team:team },
            load: function( manager ){
                document.getElementById("#manager_name").value = manager;
            }
        });
    });
}

Answer 2

If you are using dojo 1.7 and above no need to use window.onload() or even dojo.addOnLoad() - I think this is what you are looking for

require(['dojo/dom', 'dojo/domReady!', function(dom) {
  getManager(dom.byId('team_name').value); 
});


function getManager(team) {
  require(['dojo/request/xhr', 'dojo/dom'], function(xhr, dom) {
    xhr.post('getManager.php', {
      method: 'POST',
      data: {team: team}
    }).then(function(manager) {
        dom.byId('manager_name').value = manager;
    }, function(error) {
        console.error('couldn\'t fetch manger!');
    });
  });
}

domReady! - is an AMD loaded plugin that will wait until the DOM has finished loading before returning