locked
How can I call model validation error from javascript for the model column if the value is null in a form RRS feed

  • Question

  • User-1355965324 posted

     I am creating a form with dropdown selection of the employee .  When we select the  employee name from the dropdown , then  there is button to enter the selected employee salary revision. But I need to create the error message  in <Span>  tag , if  the user  click the button without selecting the employeeId. Here is my code

    Model class

    Public class Employee()
    {
      [Required]
      public int EmployeeID { get; set; }
      public string EmployeeName
    }

    Controller

    Employee Controller
     public IActionResult AddEmployee(int DN = 0, int DPT = 0, int EID = 0)
     {
         return View();
     }
    
    Salary Controller
     public IActionResult SalaryRevision(int empId)
     {
         return View();
     }

    View 

    @model Employee
     <form  asp-controller="Employee" asp-action="AddEmployee" data-ajax="true"
                  data-ajax-method="POST"
                  data-ajax-mode="replace"
                  data-ajax-update="#content" class="form-horizontal" role="form" data-parsley-validate novalidate>
    
    <div class="form-group">
           <label class="control-label control-label-left col-sm-3  text-danger" for="field88">Employee*</label>
           div class="controls col-sm-9">
                 <select id="dropdownEmployee" class="form-control" asp-for="EmployeeID" asp-items="@ViewBag.Employees" onchange="FillEmployeeDetails()"></select>
                     <span asp-validation-for="EmployeeID" class="text-danger">@ViewBag.EmpErrormsg</span>
           </div>
    </div>
    
    <div class="form-group" style="display: block;">
          <label class="control-label control-label-left col-sm-5" for="field41"></label>
               <div class="row controls col-sm-7">
                       <button type="button" class="btn btn-primary form-control" onclick="CallSalaryRevision()">Enter / View Salary</button>
               </div>
     </div>
    
    function CallSalaryRevision() {
            var empid = "@Model.EmployeeID";     
           // From here I have to  set ViewBag.EmpErrormsg in span , only  if empid is null or 0 
            if ($("#dropdownEmployee option:selected").val() > 0) {
                var href = '/Salary/SalaryRevision?employeeId=' + empid;
                $("#lnkFilter").attr('href', href);
                $("#lnkFilter").click();
            };
        }
    

    It would be appreciated if some one can help me

    Pol

    Monday, December 21, 2020 2:16 PM

Answers

  • User-1355965324 posted

    Thanks mgebhard

    I sorted it by giving span id in html  and innerhtml in javascript. it is working fine

    <div class="controls col-sm-9">
                                                <select id="dropdownEmployee" class="form-control" asp-for="EmployeeID" asp-items="@ViewBag.Employees" onchange="FillEmployeeDetails()"></select>
                                                <span id="empError" asp-validation-for="EmployeeID" class="text-danger"></span>
                                            </div>
    
     if ($("#dropdownEmployee option:selected").val() > 0) {
                var href = '/Salary/SalaryRevision?employeeId=' + empid;
                $("#lnkFilter").attr('href', href);
                $("#lnkFilter").click();
            }
            else {
                document.getElementById('empError').innerHTML = "Employee Id must be given *";
            }

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, December 21, 2020 2:57 PM

All replies

  • User475983607 posted

    The problem is the design bypasses validation by doing an HTTP GET.  A standard forum POST will fire the [Required] validation (shown in your model) automatically if the user does not select an Employee from the list.  Can you explain why you are not following standards validation found in every beginning level tutorial? 

    Secondly, the design is missing the salary input which is part of your requirements.   Can you explain the high level requirement?  Are you asking the community to help design conditional validation and the EmployeeID is NOT required as coded in your original post?

    Monday, December 21, 2020 2:45 PM
  • User-1355965324 posted

    Thanks mgebhard

    I sorted it by giving span id in html  and innerhtml in javascript. it is working fine

    <div class="controls col-sm-9">
                                                <select id="dropdownEmployee" class="form-control" asp-for="EmployeeID" asp-items="@ViewBag.Employees" onchange="FillEmployeeDetails()"></select>
                                                <span id="empError" asp-validation-for="EmployeeID" class="text-danger"></span>
                                            </div>
    
     if ($("#dropdownEmployee option:selected").val() > 0) {
                var href = '/Salary/SalaryRevision?employeeId=' + empid;
                $("#lnkFilter").attr('href', href);
                $("#lnkFilter").click();
            }
            else {
                document.getElementById('empError').innerHTML = "Employee Id must be given *";
            }

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, December 21, 2020 2:57 PM
  • User475983607 posted

    Ah, I get it.... you did not share all the relevant code and added a red herring ([Required] to make answering your post as difficult as possible.

    Monday, December 21, 2020 3:21 PM