简体   繁体   中英

Dropdownlist selectedindexchanged event is not firing

Simply I have a Dropdownlist with RequiredFieldValidatior in UpdatePanel on a page, I have enabled autopostback for the dropdownlist.

The problem is that Dropdownlist selectedindex event is not firing. This unexpected behavior happens when I validate the page and ant error occurs.

I searched a lot but unable to find the solution

my code is as follows:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        function ValidateMe() {
            if (Page_ClientValidate("vgOption")) {
                alert("valid");
            }

            return false;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="smMain" runat="server">
    </asp:ScriptManager>
    <asp:UpdatePanel ID="pnlMain" runat="server" ChildrenAsTriggers="true">
        <ContentTemplate>
            <table border="1" cellpadding="5" cellspacing="0">
                <tr>
                    <td>
                        Option:
                    </td>
                    <td>
                        <asp:DropDownList runat="server" AutoPostBack="true" ID="Opt" OnSelectedIndexChanged="Opt_SelectedIndexChanged" ValidationGroup="vgOption">
                            <asp:ListItem Text="--Select Option--" Value="0" />
                            <asp:ListItem Text="Upload" />
                            <asp:ListItem Text="Download" />
                        </asp:DropDownList>
                        <asp:RequiredFieldValidator ID="rfv" runat="server" ControlToValidate="Opt" Display="None" InitialValue="0" ValidationGroup="vgOption" ErrorMessage="Please select an option"></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr>
                    <td>
                        Postback:
                    </td>
                    <td>
                        <asp:Label Text="" ID="lblMessage" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td>
                    </td>
                    <td>
                        <input type="button" onclick="return ValidateMe();" value="Test" title="Test" />
                        <asp:ValidationSummary ValidationGroup="vgOption" runat="server" ShowMessageBox="true" ShowSummary="false" DisplayMode="List" />
                    </td>
                </tr>
            </table>
        </ContentTemplate>
    </asp:UpdatePanel>
    </form>
</body>
</html>

Codebehind:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void Opt_SelectedIndexChanged(object sender, EventArgs e)
    {
        lblMessage.Text = "Autopostback: " + DateTime.Now.ToString();
    }
}

Steps to repopulate the issue:
1. Click first option in dropdown
2. click on submit button
3. change dropdownlist value (this should fire selectedindex changed event, but it doesn't)

PS: I do not want to postback to happen when the submit button is clicked that is why I added <input> instead of asp.net button,
even if I add asp.net button it doesnt work

Added Page_BlockSubmit = false; in the JS code which was preventing the postback...

<script type="text/javascript">
    function ValidateMe() {
        if (Page_ClientValidate("vgOption")) {
            alert("valid");
        }
        Page_BlockSubmit = false;
        return false;
    }
</script>

Reference: http://www.techques.com/question/1-2083929/Dropdownlist-doesn%27t-postback-after-Page_ClientValidate%28%29

replace

<input type="button" value="Test" title="Test"  runat="server" validationgroup="vgOption"/>

with

<asp:Button ID="btn" runat="server" Title="Test" Text="Test"  ValidationGroup="vgOption" OnClientClick="return ValidateMe()"/>

the issue is solved.

Add property ViewStateMode="Enabled" and EnableViewState="true"

in drop DropDownList

For more details click here

On clicking submit button, if page validation returns false and then changing the drop-down's selected-index will not work for first time. Because on submitting the form it will do Form validation.

  • If Validation returns false [indicates not to submit the Form], then you can can't go to server side code.
  • Since you have used “SelectedstateChanged” event for the Dropdown, the code inside the event handler function will not execute after form validation is returned as false.

So to handle this problem, add onchange="Page_BlockSubmit = false;" :

    <asp:DropDownList runat="server" AutoPostBack="true" ID="Opt" OnSelectedIndexChanged="Opt_SelectedIndexChanged"
 CausesValidation="false" ValidationGroup="none" onchange="Page_BlockSubmit = false;">
       <asp:ListItem Text="--Select Option--" Value="0" />
       <asp:ListItem Text="Upload" />
       <asp:ListItem Text="Download" />
    </asp:DropDownList>

Reference Link http://burnignorance.com/asp-net-developer-tips/dropdownlist-validation-problem-in-asp-net/

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM