2012-03-02 22 views
1

如何设置按钮,可以看到后,才在2个dropdownlists在aspx文件中所做的更改在javascript

<asp:DropDownList ID="DropDownList1" runat="server" > 
</asp:DropDownList> 
<asp:DropDownList ID="DropDownList2" runat="server"> 
</asp:DropDownList> 
<asp:Button ID="load_data" runat="server" Text="<%$ Resources : load_data %>" 
    onclick="load_data_class_Click" Visible="False"/> 

现在,我想设置按钮,可以看到后,才在2个dropdownlists中所作的更改javascript

该怎么做?

+0

不工作? – Shoban 2012-03-02 10:58:18

+0

你可以添加类,当下拉值改变,并且在每一个改变你看,如果对方下拉拥有类,然后为你的按钮可见真! – 2012-03-02 10:58:38

回答

1

第一个问题是你不能使用Visible =“false”,你需要使用CSS并设置visibility:hidden ;,或者display:none。

一旦你做到了这一点,你可以做以下 - >

获取ID列表中的:

//id #1 
var ddl1 = document.getElementById("DropDownList1"); 

//id #2 
var ddl2 = document.getElementById("DropDownList2"); 

现在,我们需要创建一个onchange函数来获取值,并测试它们是否为空,如果没有,那么我们将显示按钮。

function showButton(){ 
    //out of <option value="3"> This is 3rd </option> you get: 
    var selected1text = ddl1.option[ddl.selectedIndex].text; // returns: This is 3rd 
    var selected1value = ddl1.option[ddl.selectedIndex].val; // returns: 3 

    //out of <option value="75"> This is 75th </option> you get: 
    var selected2text = ddl2.option[dd2.selectedIndex].text; // returns: This is 75th 
    var selected2value = ddl2.option[dd2.selectedIndex].val; // returns: 75 

    if(
    selected1text != "" && 
    selected1value != "" && 
    selected2text != "" && 
    selected2value != "" 
){ 
    //Our select lists all have values. We can show our button now. 

    //if you use visibility:hidden; 
    document.getElementById('load_data').style.visibility='visible'; 

    //if you use display:none; 
    document.getElementById('load_data').style.display='block'; 
    }else{ 
    //don't do anything. 
    } 
} 

然后,在你的下拉列表中,您可以添加的onChange = showButton();

应该工作。

1

您可以采用一个hidden元素,其值为0,并且每当有人更改下拉列表时,将此隐藏元素的值递增,等到2后再显示该按钮。

基本上你需要在两个下拉菜单的变化事件上调用一个函数来做上述事情。

+0

这完全是我如何做到这一点:) – Subby 2013-06-05 11:18:08

3

对于Visible属性设置为False的ASP.NET控件,不会生成标记。您需要通过JavaScript代码应用CSS(显示:无或可见性)。

+0

是的。同意@AVD – 2012-03-02 11:06:04

0
I solved the problem with jquery 

    $(document).ready(function() { 


      $('#load_data').live('click', function() { 

       var result; 
       if (($('#DropDownList1 option:selected').val() != '') && 
        ($('#DropDownList2 option:selected').val() != '') && 
         ($('#DropDownList3 option:selected').val() != '')) { 
        //result = true; 
        alert("true"); 
        result = true; 
       } else { 
        // result= false; 
        alert("false"); 
        result = false; 
       } 
       return result; 
      }); 
     }); 
相关问题