Jquery禁用影響模型中的所有項目如果文本框爲空

Question

所以我的代碼如下。如果DateManagerNotified和DateManagerReplied字段都爲空白，我需要禁用IsShortlisted編輯器。這目前可行，但它隻影響模型列表中的第一次迭代。

@model IEnumerable<Recruitment.Model.VacancyApplicant> 
    @{ 
     ViewBag.Title = "Shortlistings"; 
    } 

<h2>Unprocessed Applicants for @Html.ActionLink(@Model.First().Vacancy.JobRef, "Details", "Vacancy", new { id = Model.First().VacancyId }, null)</h2> 

@using (Html.BeginForm("Shortlist", "VacancyApplicant", FormMethod.Post)) 
{ 
    @Html.AntiForgeryToken() 

    <table class="table table-striped table-hover table-responsive"> 
     <thead> 
      <tr> 
       <th> 
        @Html.ActionLink("First Name", "Shortlist", new { sort = ViewBag.FirstNameSort, vacancyId = Model.First().VacancyId }) 
       </th> 
       <th> 
        @Html.ActionLink("Last Name", "Shortlist", new { sort = ViewBag.LastNameSort, vacancyId = Model.First().VacancyId }) 
       </th> 
       <th> 
        @Html.ActionLink("Date Received", "Shortlist", new { sort = ViewBag.DateReceivedSort, vacancyId = Model.First().VacancyId }) 
       </th> 
       <th> 
        @Html.ActionLink("Date Manager Notified", "Shortlist", new { sort = ViewBag.DateManagerNotifiedSort, vacancyId = Model.First().VacancyId }) 
       </th> 
       <th> 
        @Html.ActionLink("Date Manager Replied", "Shortlist", new { sort = ViewBag.DateManagerRepliedSort, vacancyId = Model.First().VacancyId }) 
       </th> 
       <th> 
        @Html.ActionLink("Shortlisted?", "Shortlist", new { sort = ViewBag.IsShortlistedSort, vacancyId = Model.First().VacancyId }) 
       </th> 
       <th> 
        @Html.ActionLink("Email?", "Shortlist", new { sort = ViewBag.EmailSort, vacancyId = Model.First().VacancyId }) 
       </th> 
      </tr> 
     </thead>  
     <tbody> 
      @foreach (var item in Model) 
      { 
       <tr> 
        <td> 
         @Html.TextBoxFor(modelItem => item.Applicant.FirstName, new { @class = "form-control", disabled = "disabled" }) 
        </td> 
        <td> 
         @Html.TextBoxFor(modelItem => item.Applicant.LastName, new { @class = "form-control", disabled = "disabled" }) 
        </td> 
        <td> 
         @Html.TextBoxFor(modelItem => item.DateReceived, "{0:dd/MM/yyyy}", new { @class = "form-control", disabled = "disabled" }) 
        </td> 
        <td> 
         <span id="datenotified"> 
          <div class="input-group"> 
           @Html.EditorFor(modelItem => item.DateManagerNotified, new { htmlAttributes = new { @class = "form-control date-picker", placeholder = "Datepicker..." }, }) 
           <label class="input-group-addon btn"> 
            <span class="fa fa-calendar"></span> 
           </label> 
          </div> 
         </span> 
        </td> 
        <td> 
         <span id="datereplied"> 
          <div class="input-group"> 
           @Html.EditorFor(modelItem => item.DateManagerReplied, new { htmlAttributes = new { @class = "form-control date-picker", placeholder = "Datepicker..." }, }) 
           <label class="input-group-addon btn"> 
            <span class="fa fa-calendar"></span> 
           </label> 
          </div> 
         </span> 
        </td> 
        <td> 
         <span id="shortlisted"> 
           @Html.EditorFor(modelItem => item.IsShortlisted, "NullBool") 
         </span> 
        </td> 
        <td> 
         @if (string.IsNullOrEmpty(item.Applicant.EmailAddress)) 
         { 
          @Html.CheckBox("EmailAddress", false, new { @class = "form-control", @disabled = "disabled" }); 
         } 
         else 
         { 
          @Html.CheckBox("EmailAddress", true, new { @class = "form-control", @disabled = "disabled" }); 
         } 
        </td> 
        </tr> 
      } 
     </tbody> 
    </table>  

    <div class="center-block form-group"> 
     <div class="text-center"> 
      <div class="button-container"> 
       <input type="submit" name="PrintRegret" value="Print Regret" class="btn btn-danger" /> 
       <input type="submit" name="Save" value="Save" class="btn btn-primary" /> 
       <input type="submit" name="EmailRegret" value="Email Regret" class="btn btn-danger" /> 
      </div> 
      <br /> 
      @Html.ActionLink("Print Applicants for Shortlisting", "PrintApplicantsForShortlisting", "VacancyApplicant", new { VacancyId = Model.First().Vacancy.VacancyId }, new { @class = "btn btn-success" }) 
      @Html.ActionLink("Email Applicants for Shortlisting", "EmailApplicantsForShortlisting", "VacancyApplicant", new { VacancyId = Model.First().Vacancy.VacancyId }, new { @class = "btn btn-success" }) 
      <br /><br /> 
      @Html.ActionLink("Shortlist By File", "AutoShortlist", "Interview", new { vacancyId = Model.First().Vacancy.VacancyId }, null)<br /> 
      @Html.ActionLink("Interviews", "InterviewsByVacancy", "Interview", new { VacancyId = Model.First().Vacancy.VacancyId }, null) 
     </div> 
    </div> 
} 

我jQuery是

$("#datereplied :input").on("change", function() { 
     if ($(this).val() != "") { 
      console.log("replied not disabled"); 
      $("#shortlisted :input").prop("disabled", false); 
     } else { 
      console.log("replied disabled"); 
      $("#shortlisted :input").prop("disabled", "disabled"); 
     } 
    }) 

    $("#datenotified :input").on("change", function() { 
     if ($(this).val() != "") { 
      console.log("notified not disabled"); 
      $("#shortlisted :input").prop("disabled", false); 
     } else { 
      console.log("notified disabled"); 
      $("#shortlisted :input").prop("disabled", "disabled"); 
     } 
    }) 

正如你可以看到我使用跨度禁用isshortlisted選項列表。這隻會影響頁面上的第一個。

歡呼的任何幫助

Answer 1

的id必須是唯一的。

改變所有的id的在foreach的類，然後使用： -

$(this).closest('tr').find(".shortlisted :input").prop("disabled", false);