locked
Clear DataAnnotation validation messages RRS feed

  • Question

  • User-1145406180 posted

    I am new to ASP .NET Core 3.1 and MVC and I have this problem. I have created a form with a button that opens a bootstrap modal window; in this modal window I'm using DataAnnotation as RemoteController to check if I can delete a record when users click on confirm. If the operation cannot be performed an ErrorMessage is displaied setting ErrorMessage in Model. If I close the window and then open it again the message is always shown and I can't understand how to clear it. Can you help me? thank you

    <form method="post" name="tipologiacontratti">
        <a class="btn btn-default btn-rounded mb-4" onclick="deleteTipologiaContratto(@Model.listaContratti[k].idTipologiaContratto, '@Model.listaContratti[k].contratto')">


            <script>
                function deleteTipologiaContratto(idTipologiaContratto, contratto) {
                    document.forms["tipologiacontratti"].elements["idTipologiaContratto"].value = idTipologiaContratto;
                    document.forms["tipologiacontratti"].elements["contratto"].value = contratto;
                    document.forms["tipologiacontratti"].elements["modalitaVerifica"].value = 1;
                    document.getElementById("operazionecorrentefield").value = "4";
                    document.getElementById("idtipologiacontrattodaeliminare").value = idTipologiaContratto;
                    document.getElementById("tipologiacontrattodaeliminare").value = contratto;
                    document.getElementById('msgDeleteTipologiaContratto').innerHTML = "ELIMINAZIONE TIPOLOGIA CONTRATTO";

                    $("#modalDeleteTipologiaContratto").modal();
                }
            </script>

            <div class="modal fade" id="modalDeleteTipologiaContratto" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
                 aria-hidden="true">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header text-center">
                            <p id="msgDeleteTipologiaContratto" class="modal-title w-100 font-weight-bold"></p>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>

                        <div class="row">
                            <div class="col-12">
                                <div asp-validation-summary="All"></div>
                            </div>
                        </div>

                        <div class="form-group form-inline  ">
                            <label class="fieldsmargin" for="idtipologiacontrattodaeliminare">Id univoco interno: </label>
                            <div class="input-group fieldsmargin ">
                                <input type="text" readonly asp-for="idTipologiaContrattoDaEliminare" id="idtipologiacontrattodaeliminare" class="form-control validate">
                            </div>
                        </div>

                        <div class="modal-footer d-flex justify-content-center">
                            <button type="submit" class="btn btn-primary">Conferma</button>
                        </div>
                    </div>
                </div>
            </div>
    </form>

    Tuesday, September 29, 2020 4:13 PM

Answers

  • User1312693872 posted

    Hi, antcruc

    antcruc

    If I close the window and then open it again the message is always shown and I can't understand how to clear it.

    You can add some jquery to remove it,you can check my demo:

    View:

    <form method="post" name="tipologiacontratti">
        <a class="btn btn-danger btn-rounded mb-4" onclick="deleteTipologiaContratto(@Model.idTipologiaContratto, '@Model.contratto')">click</a>
        <div class="modal fade" id="modalDeleteTipologiaContratto" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
             aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header text-center">
                        <p id="msgDeleteTipologiaContratto" class="modal-title w-100 font-weight-bold"></p>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
    
                    <div class="row">
                        <div class="col-12">
                            <div asp-validation-summary="All" class="text-danger"></div>
                        </div>
                    </div>
    
                    <div class="form-group form-inline  asd">
                        <label class="fieldsmargin" for="idtipologiacontrattodaeliminare">Id univoco interno: </label>
                        <div class="input-group fieldsmargin ">
                            <input type="text" readonly asp-for="idTipologiaContrattoDaEliminare" id="idtipologiacontrattodaeliminare" class="form-control validate">
                        </div>
                        <span asp-validation-for="idTipologiaContrattoDaEliminare" id="validate1" class="text-danger"></span>
                    </div>
    
                    <div class="modal-footer d-flex justify-content-center">
                        <button type="submit" class="btn btn-primary">Conferma</button>
                    </div>
                </div>
            </div>
        </div>
    </form>
    
    @section Scripts
    {
        <script src="~/lib/jquery-validation/dist/jquery.validate.min.js"></script>
        <script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
        <script>
    
            function deleteTipologiaContratto(idTipologiaContratto, contratto) {
                document.getElementById('msgDeleteTipologiaContratto').innerHTML = "ELIMINAZIONE TIPOLOGIA CONTRATTO";
                $("#validate1").html("");
                $('.validation-summary-errors').remove();
                $("#modalDeleteTipologiaContratto").modal();
            }
        </script>
    
    }
    

    Result:

    Best Regards,

    Jerry Cai

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, September 30, 2020 5:16 AM

All replies

  • User-474980206 posted

    you need to remove the <li> entries in the <ul> and remove the error class:

       $('[data-valmsg-summary=true]')
              .removeClass('validation-summary-errors')
              .find('ul')
              .empty();
    
    

    Tuesday, September 29, 2020 4:25 PM
  • User1312693872 posted

    Hi, antcruc

    antcruc

    If I close the window and then open it again the message is always shown and I can't understand how to clear it.

    You can add some jquery to remove it,you can check my demo:

    View:

    <form method="post" name="tipologiacontratti">
        <a class="btn btn-danger btn-rounded mb-4" onclick="deleteTipologiaContratto(@Model.idTipologiaContratto, '@Model.contratto')">click</a>
        <div class="modal fade" id="modalDeleteTipologiaContratto" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
             aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header text-center">
                        <p id="msgDeleteTipologiaContratto" class="modal-title w-100 font-weight-bold"></p>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
    
                    <div class="row">
                        <div class="col-12">
                            <div asp-validation-summary="All" class="text-danger"></div>
                        </div>
                    </div>
    
                    <div class="form-group form-inline  asd">
                        <label class="fieldsmargin" for="idtipologiacontrattodaeliminare">Id univoco interno: </label>
                        <div class="input-group fieldsmargin ">
                            <input type="text" readonly asp-for="idTipologiaContrattoDaEliminare" id="idtipologiacontrattodaeliminare" class="form-control validate">
                        </div>
                        <span asp-validation-for="idTipologiaContrattoDaEliminare" id="validate1" class="text-danger"></span>
                    </div>
    
                    <div class="modal-footer d-flex justify-content-center">
                        <button type="submit" class="btn btn-primary">Conferma</button>
                    </div>
                </div>
            </div>
        </div>
    </form>
    
    @section Scripts
    {
        <script src="~/lib/jquery-validation/dist/jquery.validate.min.js"></script>
        <script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
        <script>
    
            function deleteTipologiaContratto(idTipologiaContratto, contratto) {
                document.getElementById('msgDeleteTipologiaContratto').innerHTML = "ELIMINAZIONE TIPOLOGIA CONTRATTO";
                $("#validate1").html("");
                $('.validation-summary-errors').remove();
                $("#modalDeleteTipologiaContratto").modal();
            }
        </script>
    
    }
    

    Result:

    Best Regards,

    Jerry Cai

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, September 30, 2020 5:16 AM
  • User-1145406180 posted

    Hello Jerry,

    your solution is very clear and works perfectly!

    Thank you !

    antonio

    Wednesday, September 30, 2020 6:56 AM