Javascript avec un contrôle ascx

Question

J'ai conçu un contrôle ascx (je me réfère à lui dans cette question comme customControl). Le contrôle est juste une série de listes déroulantes avec des valeurs de texte dans chaque liste déroulante. Les listes déroulantes sont à l'intérieur d'un panneau.

Ici, il est ci-dessous:

je place alors certains d'entre eux sur une page qui a également une zone de texte (je parle ici comme zone de texte)

Ici, il est au-dessous :

Alors ce que je dois développer, est Javascript que lorsque l'un des bas de chute dans l'un des t Les customControls ont un événement sélectionné dans l'index déroulant, pour trouver toutes les valeurs dans toutes les cases de tous les contrôles de type customControl sur la page et simplement mettre ce texte dans la zone de texte. Ai-je besoin de définir mon contrôle pour avoir une classe afin que JS puisse tous les trouver facilement et avoir la fonction JS dans la zone de texte comme contrôle pour qu'elle sache quoi sortir et où?

Answer 1

Définissez tous vos bas de chute avec une classe css de « customControlDropDown » ou autre chose et votre zone de texte avec un nom de classe css de « bigTextBox » ou autre chose et l'utilisation un peu de jQuery.

<script type='text/javascript'> 
    $(document).ready(function(){ 
     $("select.customControlDropDown").change(function(){ //change event for all drop downs with customControlDropDown as its css class name 
     var collectiveText = ""; 
     $("select.customControlDropDown option:selected").each(function(i){ //get all selected options in all the drop downs with customControlDropDown as its css class name 
      collectiveText = collectiveText + $(this).text(); //append the item's text to a string variable 
     }); 

     $(".bigTextBox").val(collectiveText); //set the textbox with css class name of bigTextBox with value of the string variable from above 
     }); 
    }); 
</script> 

Je n'ai pas testé cela, mais cela DEVRAIT fonctionner. Laissez nous savoir.

Answer 2

Dans votre contrôle ascx, doit avoir la classe "myClass".

window.onload = function(){ 
    function getElementsByClass(containerId, class) 
    { 
     container = document.getElementById(containerId); 
     var all = container.all¦¦container.getElementsByTagName('*') ; 
     var arr = [] 
     for(var k=0;k<all.length;k++) 
     if(all[k].getAttribute("class").indexOf("class") != -1) 
      arr[arr.length] = all[k]; 
     return arr; 
    } 

    var arrEl = getElementsByClass("container", "myClass"); 
    var xOnChange = function() 
    { 
     //this 
    } 

    for (var ind = 0; ind < arEL.length; ind++) 
    { 
     arrEl[ind].onchange = xOnChange; 
    } 

} 

en html ou ASPX:

<div id="container> 
    <!-- aspx controls --> 
</div>