ajax.actionlinkを使用して写真を削除するときに、基礎となるViewModelプロパティを更新する方法は？

Question

私の状況はこれです：

私はこれを持っています ViewModel:

public class RealtyViewModel
{
     public RealtyViewModel()
     {
          Realty = new Realty();
          Photos = new Collection<File>();
     }

     public Realty Realty { get; set; }

     public Collection<File> Photos { get; set; }
}

私はこれを渡します RealtyViewModel わたしの Edit.cshtml 見る。編集ビューの内部はaに電話します Photos.cshtml 部分的な見解。写真の部分的なビューも同じものを使用しています @model RealtyViewModel.

今、内部 Photos.cshtml 部分的なビュー写真を削除するためにAJAXリクエストを行います：

@Ajax.ImageActionLink
(@Url.Content(Model.Photos[i].Path), @Localization.Delete, "640", "480",
"DeletePhoto", new {realtyId = Model.Realty.Id, photoId = Model.Photos[i].Id},
new AjaxOptions()
                 {
                      Confirm = @Localization.DeleteConfirmation,
                      HttpMethod = HttpVerbs.Post.ToString(),
                      OnComplete = string.Format("deletePhotoFromPage('{0}')",
                                                                  Model.Photos[i].Id),
                      OnSuccess = "LoadCycle",
                      UpdateTargetId = "myDiv",
                      InsertionMode = InsertionMode.Replace

                 }, new {data_photoId = Model.Photos[i].Id})

このコードを実行します：

[HttpDelete]
public ActionResult DeletePhoto(string realtyId, string photoId)
{
    Realty realty = DocumentSession.Load<Realty>(realtyId);

    realty.Photos.Remove(photoId);

    File photo = DocumentSession.Load<File>(photoId);

    // Deletes the file in the database
    DocumentSession.Advanced.DatabaseCommands.Delete(photoId, null);

    // Deletes the file in the disk
    System.IO.File.Delete(Server.MapPath(photo.Path));

    return new EmptyResult();
}

問題は、私の現在です realtyViewModel 編集ビューに渡したことは、Ajaxコールを使用して削除した写真を参照しています。その後、更新されたモデルを保存しようとすると、削除した写真への古い参照を保持するすべてが再び保存されます。

モデルを更新するにはどうすればよいですか（削除された写真を[）削除します[ model.Realty.Photos ]）それが私の編集ビューの現在の状態を反映しているように？

注：私が使用しているので、今は機能しています Session 削除された写真のIDを保存するオブジェクトですが、それは私がそうあるべきだと思う方法ではありません。これには美しい解決策があるに違いありません。

美しい解決策は次のとおりです。成功の削除の後、ajaxコールは削除された写真IDを返して、[から削除できるようにします。 model.Realty.Photos ]。その後、編集されたリアルティを保存しようとしたとき、それは変更を正しく反映します。

Answer 1

後 チャットに関する議論 削除する必要があるDOMに隠されたフィールドがあるようです。

@for (int i = 0; i < Model.Realty.Photos.Count(); i++)
{
    @Html.HiddenFor(
        m => m.Realty.Photos[i], 
        new { data_photoid = Model.Realty.Photos[i] }
    )
}

これで、たとえば空の結果の代わりにJSONを使用して削除する必要がある写真のIDをコントローラーアクションに返すことができます。

[HttpDelete]
public ActionResult DeletePhoto(string realtyId, string photoId)
{
    ... 
    return Json(new { photoId = photoId });
}

そしてクライアントについて：

function deletePhotoFromPage(result) { 
    ...
    $(':hidden[data-photoid="' + result.photoId + '"]').remove(); 
}

また、を使用する必要があります OnSuccess の代わりにオプション OnComplete ajaxリンクオプション：

OnSuccess = "deletePhotoFromPage"

それ以外の：

OnComplete = string.Format("deletePhotoFromPage('{0}')", Model.Photos[i].Id),

OnComplete エラーの場合でも呼び出すことができます。