Comment valider le texte requis lorsque l'option "Autre" est sélectionnée dans une liste déroulante ?

Question

Mon site web contient les éléments suivants.

Source [DropDownList]

Site web

Moteur de recherche

Autres

Autre source [TextBox]

Je veux utiliser les validateurs ASP.Net (je pense que c'est le validateur de comparaison) pour que lorsque "Other" est sélectionné dans la liste déroulante et qu'aucun texte n'est saisi, la validation est déclenchée et la page ne peut pas être soumise.

Est-ce possible ?

J'ai essayé de définir la valeur de l'option "Autre" dans la liste déroulante à string.empty et de la comparer à une zone de texte vide, mais cela n'a pas fonctionné.

Tout ce dont j'ai hérité se trouve à l'intérieur d'un contrôle d'assistant, sinon j'accrocherais un script du client pour déclencher la validation moi-même. Je ne pense pas que je puisse faire cela avec un contrôle d'assistant ?

Merci d'avance.

Answer 1

Aucun des validateurs fournis par ASP.NET ne vous permet d'effectuer une validation conditionnelle basée sur un autre contrôle. Cependant, vous pouvez y parvenir en utilisant un CustomValidator qui effectue la validation côté client, côté serveur, ou les deux (il est recommandé d'utiliser au minimum la validation côté serveur). Les validateurs fonctionnent bien en conjonction avec les assistants.

Exemple de balisage ASP.NET :

    <asp:DropDownList ID="OptionsDropDownList" runat="server">
        <asp:ListItem Text="Website" />
        <asp:ListItem Text="Search Engine" />
        <asp:ListItem Text="Other" />
    </asp:DropDownList>
    <asp:TextBox ID="OtherTextBox" runat="server" />
    <asp:CustomValidator ID="custvOptionsDropDownList" runat="server" ControlToValidate="OptionsDropDownList"
        ValidateEmptyText="true" Display="Dynamic" ClientValidationFunction="validateOtherTextBox"
        ErrorMessage="This field is required!" OnServerValidate="ValidateOtherTextBox" />

Javascript pour ClientValidationFunction :

<script type="text/javascript" language="javascript">
    function validateOtherTextBox(event, args) {
        var textbox = document.getElementById('<%= OtherTextBox.ClientID %>').value;
        if (args.Value == 'Other')
            args.IsValid = (textbox != '');
        else
            args.IsValid = true;
    }
</script>

Code-Behind pour OnServerValidate :

    protected void ValidateOtherTextBox(object source, ServerValidateEventArgs args)
    {
        if (OptionsDropDownList.SelectedValue == "Other")
        {
            args.IsValid = (OtherTextBox.Text.Trim() != "");
        }
    }

Notez qu'il vous appartient de mettre en œuvre ce dont vous avez besoin. Vous pouvez tout à fait ignorer la validation Javascript et supprimer ce code ainsi que l'élément ClientValidationFunction attribut. Remarquez également que le Javascript fait référence au contrôle cible en utilisant la propriété ClientID. Ceci est nécessaire car ASP.NET attribue un ID différent lorsque la page est éditée et vous voudrez qu'il soit fourni à la méthode Javascript de cette manière (affichez la source de la page et vous verrez que le nom du contrôle a un préfixe supplémentaire, etc.)

Answer 2

Vous cochez l'option "qui" dans la liste déroulante comme suit

if (ddl.selecteditemindex == 1){
if (txtvalue.text == "")
{
alert('you write something if selected other otherwise choose from a list');
}
}