編集フォームを提出することができません

Question

私はそれをお勧めしたいと思って、編集しようとしているデータを使ってテーブル内の場所を編集フォームで実装しようとします。私は、私のフォームを提出することができませんでしたが、作成フォームは同じ機能を果たし、ここでは助けが必要なコードです。 これは編集フォームの部分図です。ここで

@using (Html.BeginForm("", "", FormMethod.Post, new { id = "PublisherEditForm" })) 
{ 
@Html.AntiForgeryToken() 

    @Html.ValidationSummary(true, "", new { @class = "text-danger" }) 
    @Html.HiddenFor(model => model.PublisherID) 
    @*@Html.LabelFor(model => model.PublisherName, htmlAttributes: new { @class = "control-label col-md-2" })*@ 
    <td> 
     @Html.EditorFor(model => model.PublisherName, new { htmlAttributes = new { @class = "form-control" } }) 
     @Html.ValidationMessageFor(model => model.PublisherName, "", new { @class = "text-danger" }) 
    </td> 

    @*@Html.LabelFor(model => model.City, htmlAttributes: new { @class = "control-label col-md-2" })*@ 
    <td> 
     @Html.EditorFor(model => model.City, new { htmlAttributes = new { @class = "form-control" } }) 
     @Html.ValidationMessageFor(model => model.City, "", new { @class = "text-danger" }) 
    </td> 

    @*@Html.LabelFor(model => model.State, htmlAttributes: new { @class = "control-label col-md-2" })*@ 
    <td> 
     @Html.EditorFor(model => model.State, new { htmlAttributes = new { @class = "form-control" } }) 
     @Html.ValidationMessageFor(model => model.State, "", new { @class = "text-danger" }) 
    </td> 

    <td> 
     <input id="saveUpdate" type="submit" value="Update Publisher" class="btn btn-primary" /> 
    </td> 
} 

は、私は、フォームを試してみて、提出することを使用していますということアヤックスです：

$('#PublisherEditForm').submit(function (e) { 
     var formData = $(this).serializeArray(); 
     e.preventDefault(); 
     $('MessageContent'). 
     html("<div class='alert alert-info'>Please Wait...</div>"); 
     $.ajax({ 
      url: "@Url.Action("AjaxEdit", "PublishersEF")", 
      type: "POST", 
      data: formData, 
      dataType: "json", 
      success: function (data) { 
       $('#MessageContent').html("<div class='alert alert-success'>Your record was updated!</div>"); 
       $('#PublisherEditForm')[0].reset(); 
       var row = 
        '<tr><td>' + data.PublisherName + 
        '</td><td>' + data.City + 
        '</td><td>' + data.State + 
        '</td><td> <a href="@Url.Action("Index", "PublishersEF")">Refresh View</a></td></tr>'; 
       $('#Publisher' + data.PublisherID).replaceWith(row); 
       console.log('success'); 
       $('PublisherEdit').hide(); 
       $('#MessageContent').html('<div class="alert alert-warning">There was an error processing your update, please try again or contact the site administrator</div>'); 
      }, 
      error: function (e) { 
       console.log('error'); 
       $('#MessageContent').html('<div class="alert alert-warning">There was an error processing your update, please try again or contact the site administrator</div>'); 
      } 
     }); 
    }); 

私は成功とエラーの両方の内側にconsole.logを置くことを試みていると私はどちらか見ませんでしたコンソールにおけるそれらの

EDIT：

[HttpGet] 
    public PartialViewResult PublisherEdit(int id) 
    { 
     Publisher publisher = UnitOfWork.PublisherRepository.Find(id); 
     return PartialView(publisher); 
    } 

    [HttpPost] 
    [ValidateAntiForgeryToken] 
    public JsonResult PublisherEdit(Publisher publisher) 
    { 
     UnitOfWork.PublisherRepository.Update(publisher); 
     UnitOfWork.Save(); 
     return Json(publisher); 
    } 

私はUnitOfWorkのを確認することができます：ここでC＃の方法があります正しく機能します。この機能はすべてデータベースに接続し、情報を更新/保存します。次のように

はあなたのボタンを宣言します：

<input id="saveUpdate" value="Update Publisher" type="button" class="btn btn-primary" />

そして、これは機能をJS追加これは私が問題のようなものに直面してきた、と私はそれがこれをやって解決し、以前のバージョンで

Answer 1

私はそれを動作させました。興味深いことに、スクリプトビューのタグをインデックスビューに保存できませんでした。私はそれを部分的なビューに戻さなければならなかった（なんらかの理由でこれまでにはうまくいきませんでした）。ここでは、部分的に更新される：

@model cStoreMVC.DATA.EF.Publisher 

@using (Html.BeginForm("", "", FormMethod.Post, new { id = "PublisherEditForm" })) 
{ 
@Html.AntiForgeryToken() 

    @Html.ValidationSummary(true, "", new { @class = "text-danger" }) 
    @Html.HiddenFor(model => model.PublisherID) 
    @*@Html.LabelFor(model => model.PublisherName, htmlAttributes: new { @class = "control-label col-md-2" })*@ 
    <td> 
     @Html.EditorFor(model => model.PublisherName, new { htmlAttributes = new { @class = "form-control" } }) 
     @Html.ValidationMessageFor(model => model.PublisherName, "", new { @class = "text-danger" }) 
    </td> 

    @*@Html.LabelFor(model => model.City, htmlAttributes: new { @class = "control-label col-md-2" })*@ 
    <td> 
     @Html.EditorFor(model => model.City, new { htmlAttributes = new { @class = "form-control" } }) 
     @Html.ValidationMessageFor(model => model.City, "", new { @class = "text-danger" }) 
    </td> 

    @*@Html.LabelFor(model => model.State, htmlAttributes: new { @class = "control-label col-md-2" })*@ 
    <td> 
     @Html.EditorFor(model => model.State, new { htmlAttributes = new { @class = "form-control" } }) 
     @Html.ValidationMessageFor(model => model.State, "", new { @class = "text-danger" }) 
    </td> 

    <td> 
     <input id="saveUpdate" value="Update" type="submit" class="btn btn-primary" /> 
    </td> 
} 
@section scripts{ 
@Scripts.Render("~/bundles/jqueryval") 
} 
<script> 
$('#PublisherEditForm').submit(function (e) { 
    var formData = $(this).serializeArray(); 
    e.preventDefault(); 
    $('#MessageContent').html("<div class='alert altert-info'>Please Wait...</div>"); 
    $.ajax({ 
     url: "@Url.Action("PublisherEdit", "PublishersEF")", 
     type: "POST", 
    data: formData, 
    dataType: "json", 
    success: function (data) { 
     console.log('it worked'); 
     $('#MessageContent').html("<div class='alert alert-success'>Your Item Was Updated!!!</div>"); 
     $('#PublisherEditForm')[0].reset(); 


     var row = 
      "<tr class='newRow'><td>" + data.PublisherName + 
      '</td><td>' + data.City + 
      '</td><td>' + data.State + 
      '</td><td>Refresh to view options </td></tr>'; 
     $("#Publisher-" + data.PublisherID).replaceWith(row).find('tr.newRow:last'); 
    }, 
    error: function (e) { 
     console.log(it); 
     $('#MessageContent').html("<div class='alert alert-warning'>There was an error. Please try again or contact the site administrator.</div>"); 
    } 
}); 
}); 
</script> 

私はフォームやテーブル行がうまく一緒に動作しないことが判明しているあなたは、私が言われたことが水平になるようにしたい場合（これは、フォームが提出しなかった理由かもしれない）とIそれが使用することを確認することができますdisplay: flex; justify-content: space-between;。私はフォームのすべてのテーブルのデータタグを削除し、テーブルのデータタグ内のフォーム全体をラップするように、それをテーブルに表示する場合。それは最高に見えませんが、それは動作します！このような将来の問題を抱える人にとって、私はこれが助けてくれることを願っています

Answer 2

を働いています：

$("#saveUpdate").on('click', function() { 
    try { 
     var currentForm = $("#PublisherEditForm"); 
     currentForm.append("<input type='hidden' name='flagButton' 
     id='flagButton' value='Publish' >"); 
     $(currentForm).submit(); 
    } catch (e) { 

    } 
}); 

希望します。