2017-05-16 12 views
1

現在、私はASP.NET MVC開発の完全な初心者です。選択したチェックボックスに基づいて削除機能を実行する方法について質問したいと思います。ここに私のコードです:複数のチェックボックスからの削除(MVC C#Telerik)

モデル(私はJobProviderそれを命名) - 削除機能のためのロジック

private readonly EntitiesModel context; 
public JobProvider(EntitiesModel context) 
{ 
    this.context = context; 
} 

public Job GetJob(int id) 
{ 
    return context.Jobs.SingleOrDefault(Job => Job.JobID == id); 
} 

public void Delete(int id) 
{ 
    var job = GetJob(id); 
    if (job != null) 
    { 
     context.Delete(job); 
     context.SaveChanges(); 
    } 
} 

削除用コントローラ:

private readonly JobProvider jobProvider; 

public JobController(JobProvider jobProvider) 
{ 
    this.jobProvider = jobProvider; 
} 

public ActionResult Delete(int id) 
{ 
    try 
    { 
     jobProvider.Delete(id); 
    } 
    catch (Exception ex) 
    { 
     throw ex; 
    } 
    return RedirectToAction("Index"); 
} 

マイビューのマークアップ:

@model List<JobSeeker.ViewModel.JobProperty.JobViewModel> 
<link href="~/Content/Site.css" rel="stylesheet" /> 
@using (Html.BeginForm("Filter", "Job", FormMethod.Post, new { id = "filterform" })) 
{ 
    <table> 
     <tr>    
      <td>@Html.Label("Cari Nama Pekerjaan")</td> 
      <td>@Html.TextBox("jobName")</td> 
     </tr> 
     <tr> 
      <td><input type="submit" class="btnCreate" value="Search" /></td> 
     </tr> 
    </table> 
} 
<a href='@Url.Action("Create", "Job")'> 
    <img class="add-global" id="btnAddNew" src='@Url.Content("/../Images/logo-add.png")' /> 
</a> 
<a href='@Url.Action("Delete", "Job")'> 
    <img class="delete-global-checklist" src="@Url.Content("/../Images/delete-checklist-logo.png")" /> 
</a> 
@foreach (var item in Model.ToList()) 
{ 
    <div class="job-body-container"> 
     <div class="logo-global"> 
      <img class="global-image-company" src="~/Images/logo-job.png" /> 
     </div> 
     <div class="detail-global-container"> 
      <div class="detail-global"><b class="job">@item.jobName</b></div> 
      <div class="detail-global"><b class="job-company">@item.jobCompany</b></div>   
      <div class="detail-global">Requirement : @item.jobRequirement</div> 
      <div class="detail-global">Deskripsi Pekerjaan : @item.jobDescription</div> 
     </div> 
     <div class="global-menu-job"> 
      <div class="total-person"> 
       <div class="textview-total-person">Total Pelamar : <b>@item.jobTotalPerson</b> orang</div> 
      </div> 
      <a href='@Url.Action("DetailIndex", "Job", new { id = @item.jobID })'> 
       <img class="edit-global" src='@Url.Content("/../Images/logo-detail.png")' /> 
      </a> 
      <a href='@Url.Action("Edit", "Job", new { id = @item.jobID })'> 
       <img class="edit-global" src='@Url.Content("/../Images/logo-edit.png")' /> 
      </a> 
      <a class="delete" href='@Url.Action("Delete", "Job", new { id = @item.jobID })' onclick="return confirm('are you sure you want to delete?')"> 
       <img class="delete-global" src='@Url.Content("/../Images/logo-delete.png")' /> 
      </a> 
      <input class="checklist" type="checkbox" value="@item.jobID"/> 
     </div> 
    </div> 
} 

現在、項目ごとに削除機能を使用しているコードはthisです。 Xロゴをクリックするとアイテムが削除されます。ただし、右上のゴミ箱アイコンをクリックすることで、チェックボックスで選択した各項目を削除したいと思っています(デザインが悪かって申し訳ありません)。コードをどのように変更すればよいですか?事前に

感謝:)

答えて

0

[解決]

コントローラー:

[HttpPost] 
    public ActionResult Delete(int[] id) 
    { 

     foreach (var item in id) 
     { 
      try 
      { 
       jobProvider.Delete(item);     
      } 
      catch (Exception ex) 
      { 
       throw ex; 
      } 

     } 

     return RedirectToAction("Index"); 
    } 

ビュー

<a class="btnDelete" href='javascript:;'> 
<img class="delete-global-checklist" src="@Url.Content("/../Images/delete-checklist-logo.png")" /> </a> 

<input class="chkDelete" name="chkDeleteName" type="checkbox" value="@item.jobID"/> 

ビューのAjaxスクリプト

<script> 
$(".btnDelete").on("click", function (e) { 
    var confirmation = confirm("Are you sure?") 
    if (confirmation) { 

     e.preventDefault(); 
     var data = []; 
     $("input[name='chkDeleteName']:checked").each(function() { 
      data.push($(this).val());   
     }); 

     $.ajax({ 
      type: "POST", 
      url: "@Url.Action("Delete")", 
      data: { id: data }, 
     traditional:true, 
     success: function (result) { 
      //alert("done"); 
      alert("Delete Success") 
      location.reload(); 
     } 
    }) 
    } 
    else 
     alert("Delete Canceled") 
    }) 

関連する問題