带有ascx控件的Javascript

时间:2009-08-12 17:30:03

标签: c# .net javascript javascript-events ascx

我设计了一个ascx控件(我将此问题称为customControl)。控件只是一系列下拉列表,每个下拉列表中都有文本值。下拉列表在面板内。

以下是:

control

然后我将其中一些放在一个也有文本框的页面上(我在这里称之为文本框)

以下是:

Series of control

所以我需要开发的是Javascript,当任何一个customControls中的任何一个下拉列表中有一个选定的下拉索引更改事件时,要查找所有类型为customControl的控件的所有框中的所有值页面,只需将该文本放在文本框中即可。

我是否需要定义我的控件以获得一个类,以便JS可以轻松地找到所有这些,然后让JS函数将文本框作为控件,以便它知道输出什么以及在哪里?

2 个答案:

答案 0 :(得分:2)

使用css类“customControlDropDown”设置所有下拉列表或者使用css类名称为“bigTextBox”或其他任何内容的文本框并使用一些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>

我没有测试过这个,但它应该可以工作。请告诉我们。

答案 1 :(得分:0)

在你的ascx控件中,必须有“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;
    }

}

在html或aspx中:

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