2012-03-02 42 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; 
      }); 
     }); 
相關問題