Rendre un événement onchange également exécuté sur pageload

Question

J'ai installé des événements onchange dans jQuery qui sont utilisés pour remplir une liste déroulante sélectionnée en fonction de ce qui est sélectionné dans une autre liste déroulante. J'ai besoin de ceux-ci pour s'exécuter également sur le chargement de la page afin que les résultats soient retournés en fonction de ce que la première boîte de sélection est au chargement de la page (sinon je termine avec une boîte de sélection vide). Ive a eu un coup d'oeil autour internets mais ne peux pas trouver quelque chose qui correspond exactement à ce que je veux faire

Mon code Jquery est

 $(function(){ 


    //Get Contacts for Company 

     $("select#ContactCompanyId").change(function(){ 
     var url = "contactList/" + $(this).val() + ""; 
     $.getJSON(url,{id: $(this).val(), ajax: 'true'}, function(j){ 
      var options = ''; 
      $.each(j, function(key, value){ 
     options += '<option value="' + key + '">' + value + '</option>'; 
      }) 
      $("select#QuoteContactId").html(options); 
     }) 
     }) 

    //Get list of product Categories 

     $("select#ProductCategory").live('change', function(){ 
     var url = "productList/" + $(this).val() + ""; 
     var id = $(this).attr('name'); 
     $.getJSON(url,{id: $(this).val(), ajax: 'true'}, function(j){ 
      var options = ''; 
     options += '<option value="0">None</option>'; 
      $.each(j, function(key, value){ 
     options += '<option value="' + key + '">' + value + '</option>'; 
      }) 
      $("select#QuoteItem" + id + "product_id").html(options); 
     }) 
     }) 

    //Function to add product data into the form 

     $(".Product").live('change', function(){ 
     var url = "productData/" + $(this).val() + ""; 
     var id = $(this).attr('title'); 
     $.getJSON(url,{id: $(this).val(), ajax: 'true'}, function(j){ 
     $("#QuoteItem" + id + "name").val(j['Product']['name']); 
     $("#QuoteItem" + id + "price").val(j['Product']['price']); 
     $("#QuoteItem" + id + "description").val(j['Product']['description']); 
     }) 
     }) 
    }) 

Merci d'avance pour votre aide

Answer 1

Vous pouvez simplement déclencher l'événement juste après la liaison avec .trigger() comme ceci:

$("select#ContactCompanyId").change(function(){ 
    var url = "contactList/" + $(this).val() + ""; 
    $.getJSON(url,{id: $(this).val(), ajax: 'true'}, function(j){ 
     var options = ''; 
     $.each(j, function(key, value){ 
    options += '<option value="' + key + '">' + value + '</option>'; 
     }) 
     $("select#QuoteContactId").html(options); 
    }); 
    }).trigger('change'); 

Answer 2

$(document).ready(function() { 
    $('#your_select_id').change(); 
}); 

Ce bouton déclenche la change l'événement pour votre select, avec sa valeur actuelle. C'est l'équivalent d'un utilisateur sélectionnant la valeur actuelle, et il déclenchera tous les événements qui lui seraient attachés et qui se déclencheraient à partir d'un événement onchange.