2012-03-27 3 views
0

Ich habe eine Dropdown-Liste und einen Kalender-Extender w entsprechend erstellt. Jeder Wert der Dropdown-Liste sollte die Stilsichtbarkeit auf der Grundlage der Auswahl unterschiedlich beeinflussen. Wie gerade jetzt funktioniert die Funktionalität; für jedes Mal, wenn ich versuche, ein anderes listem zu wählen, wird die gesamte Seite aktualisiert und ich möchte AutoPostBack = "false" nicht setzen. Bitte lassen Sie mich wissen, wie Sie dieses Problem am besten lösen könnenDropdown-Liste ohne Postback, wenn Autopostback muss auf True (Code ist im Lieferumfang enthalten)

  <asp:DropDownList ID="dropdownlist" runat="server" OnSelectedIndexChanged="dropdownlist_SelectedIndexChanged" AutoPostBack="True" > 
         <asp:ListItem Value="1">a</asp:ListItem> 
         <asp:ListItem Value="2">b</asp:ListItem> 
         <asp:ListItem Value="3">c</asp:ListItem> 
         <asp:ListItem Value="4">d</asp:ListItem> 
         <asp:ListItem Value="5">e</asp:ListItem> 
         <asp:ListItem Value="6">f</asp:ListItem> 
         <asp:ListItem Value="7">g</asp:ListItem> 
        </asp:DropDownList> <asp:Panel runat="server" ID="StartDate" > 
        <asp:Label ID="lblStartDate" runat="server" Text="Start Date:"></asp:Label> 

        <asp:TextBox ID="txtStartDate" runat="server"></asp:TextBox> 
        <asp:CompareValidator ID="CompareValidatorStartDate" runat="server" ErrorMessage="Please enter a validate date" ControlToValidate="txtStartDate" Type="Date" Operator="DataTypeCheck" Display="Static" Font-Italic="False" SetFocusOnError="True"></asp:CompareValidator> 

      </asp:Panel> 
      <cc1:CalendarExtender ID="CalendarExtenderStartDate" TargetControlID="txtStartDate" runat="server"></cc1:CalendarExtender> 
      <asp:Panel runat="server" ID="EndDate" > 

        <asp:Label ID="lblEndDate" runat="server" Text="End Date:"></asp:Label> 

        <asp:TextBox ID="txtEndDate" runat="server"></asp:TextBox> 
        <asp:CompareValidator ID="CompareValidatorEndDate" runat="server" ErrorMessage="Please enter a validate date" ControlToValidate="txtEndDate" Type="Date" Operator="DataTypeCheck" Display="Static" Font-Italic="False" SetFocusOnError="True"></asp:CompareValidator> 

      </asp:Panel> 
      <cc1:CalendarExtender ID="CalendarExtenderEndDate" TargetControlID="txtEndDate" runat="server"></cc1:CalendarExtender> 

Code hinter

if (!IsPostBack) 
    { 



      SetDateFields(); 
    } 
} 


    protected void dropdownlist_SelectedIndexChanged(object sender, EventArgs e) 
{ 
    SetDateFields(); 
} 
    private void SetDateFields() 
{ 
    switch (dropdownlist.SelectedValue) 
    { 
     case "1": 
     case "3": 
     case "5": 
      EndDate.Visible = false; 
      StartDate.Visible = true; 
      lblStartDate.Text = "As Of Date:"; 
      break; 
     case "7": 
      EndDate.Visible = false; 
      StartDate.Visible = false; 
      break; 
     default: 
      EndDate.Visible = true; 
      StartDate.Visible = true; 
      lblStartDate.Text = "Start Date:"; 
      lblEndDate.Text = "End Date:"; 
      break; 
    } 
} 

Antwort

1

Oder Sie können diese Seite Code mit Client tun und die <asp:DropDownList> mit einem <select> ersetzen. Dann können Sie mit jQuery einen Ereignishandler anhängen und eine Funktion auslösen, wenn sich die Auswahl ändert.

Einfaches Beispiel:

in einem JavaScript-Code hinter oder im Bereich der Seite:

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#mySelect").bind("change", function() { 
      var val = $(this).val(); 
      alert("Selection was " + val); 
     }); 
    }); 
</script> 

Dann, wo Sie wollen, dass die Dropdown-Liste zu erbringenden:

<select id="mySelect"> 
    <option value="1">a</option> 
    <option value="2">b</option> 
    <option value="3">c</option> 
</select> 

Ich bin fest davon überzeugt, keine serverseitigen Ressourcen zu verwenden, um HTML zu rendern, das als clientseitiger Code geschrieben werden kann. Das <asp:DropDownList> wird nur als fast das gleiche HTML wie mit einem <select> in erster Linie gerendert werden.

Alle HTML-Elemente auf dieser Seite können mit HTML-Tags anstelle von ASP-Tags geschrieben werden, die in HTML konvertiert werden. Informieren Sie sich ein wenig über die Verwendung von jQuery für die Ereignisbehandlung von clientseitigem Code. Es wird die Art, wie Sie über die Programmierung von Webanwendungen denken, verändern.

0

Sie können diese JQuery mit tun. Hook eine Änderung Handler der Drop-Down-und lassen sie die Sichtbarkeit und Textzuordnungen behandeln ..

Verwandte Themen