2

これは MVC VB.NET Razor アプリケーションです。親ビューの下部に読み込まれる部分ビューがあります。そして、その部分ビューには、クリックすると、部分ビューが添付されたポップアップダイアログモーダルウィンドウを起動するボタンがあります。ユーザーはフォームを編集して更新をクリックすると、情報がコントローラーに投稿されるはずです。ただし、送信時に以下のエラー メッセージが表示されます。

ここに画像の説明を入力

ここのブログに従って、すべてを配線しました。更新ボタンをクリックすると、ここでエラーが発生します。

ここに画像の説明を入力

以下は、ポップアップモーダルをトリガーするボタンと JavaScript を含む PartialView です。

@ModelTYPE IEnumerable(of data_manager.attendance)

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascrip</script>
<table>
<tr>
    <th>Conf. Number</th>
    <th>Class Title</th>
    <th>Status of Class</th>
    <td>Edit</td>
</tr>    
@For Each x In Model
    Dim currentItem = x
    @<tr>
    <td>@Html.DisplayFor(Function(f) currentItem.conf_number)</td>
    <td>@Html.DisplayFor(Function(f) currentItem.courseTitle)</td>
    @If currentItem.Completed_Class = "Completed" Then
        @<td>@Html.ActionLink("Completed(Print Cert)", "Ind_Cert", "Printing", New With {.firstName = currentItem.firstName, .lastname = currentItem.lastName, .classRef = currentItem.course_ref, .cNumber = currentItem.conf_number}, Nothing)</td>
    Else
        @<td>@Html.DisplayFor(Function(f) currentItem.Completed_Class)</td> 
    End If
    <td>@Html.ActionLink("Modify", "CourseHistoryEdit", New With {.id = currentItem.id}, New With {.class = "editLink"})</td>
    </tr>
Next
</table>
<div id="updateDialog" title="Update Attendance"></div>

<script type="text/javascript">
var linkObj;
$(function () {
    $(".editLink").button();
    $('#updateDialog').dialog({
        autoOpen: false,
        width: 400,
        resizable: false,
        modal: true,
        buttons: {
            "Update": function () {
                $("#update-message").html(''); //make sure there is nothing on the message before we continue                         
                $("#updateAttendance").submit();
            },
            "Cancel": function () {
                $(this).dialog("close");
            }
        }
    });
    $(".editLink").click(function () {
        //change the title of the dialgo
        linkObj = $(this);
        var dialogDiv = $('#updateDialog');
        var viewUrl = linkObj.attr('href');
        $.get(viewUrl, function (data) {
            dialogDiv.html(data);
            //validation
            var $form = $("#updateAttendance");
            // Unbind existing validation
            $form.unbind();
            $form.data("validator", null);
            // Check document for changes
            $.validator.unobtrusive.parse(document);
            // Re add validation with changes
            $form.validate($form.data("unobtrusiveValidation").options);
            //open dialog
            dialogDiv.dialog('open');
        });
        return false;
    });
});

function updateSuccess(data) {
    if (data.Success == true) {
        //we update the table's info
        var parent = linkObj.closest("tr");
        parent.find(".Completed_Class").html(data.Object.completed);
        parent.find(".carDescription").html(data.Object.Description);
        //now we can close the dialog
        $('#updateDialog').dialog('close');
        //twitter type notification
        $('#commonMessage').html("Update Complete");
        $('#commonMessage').delay(400).slideDown(400).delay(3000).slideUp(400);
    }
    else {
        $("#update-message").html(data.ErrorMessage);
        $("#update-message").show();
    }
}
</script>

これは、それぞれの横にある [変更] ボタンをクリックしたときにレンダリングされる partialView です。

   @ModelTYPE DataModels.DataModels.AjaxCourseHistoryEdit

   @Using (Ajax.BeginForm("CourseHistoryEdit", "Admin", Nothing, New AjaxOptions With {.InsertionMode = InsertionMode.Replace, .HttpMethod = "POST", .OnSuccess = "updateSuccess"}, New With {.id = "updateAttendance"}))
   @Html.ValidationSummary(true)

   @<fieldset>
   <legend>Attendance Update</legend>
   @Html.HiddenFor(Function(m) Model.attendId) 
   <div class="editor-label">
    @Html.Label("Course Title")
   </div>
   <div class="editor-field">
    @Html.DisplayFor(Function(m) Model.courseTitle)
   </div>
   <div class="editor-label">
    @Html.Label("Completed Status")
   </div>
   <div class="editor-field">
     @Html.DropDownList("completed", New SelectList(ViewBag.CourseStatuses))
   </div>
   <div class="editor-label">
    @Html.Label("Hours Completed")
   </div>
   <div>
    @Html.EditorFor(Function(m) Model.hoursCompleted)
   </div>
   </fieldset>    
   End Using

以下は、プロジェクトの _layout ファイルに読み込まれている JavaScript ライブラリです。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript">     </script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

どんな助けでも大歓迎です。私はこれを何時間も行ってきました.Google検索でUnexpected token uは、無効な回線終端に関連しているというSOの投稿がいくつか見つかりました。リモートで不適切なhtmlのように見えるもの、つまり閉じられていないタグを見つけることができないため、これは役に立ちません..

csharper に@テーブルとフィールドセットを表示させました。これは、vb.net のこれらのインスタンスでは正常です。以下は、レンダリングされた html のスクリーンショットです。 ここに画像の説明を入力

4

1 に答える 1

2

Moeri のコメントは、私を正しい方向に向けてくれました。私のモデルが hiddenFor 値に整数値を使用していたことが判明しました。私にはわからない理由で、AJAXの投稿はそれをまったく好きではありませんでした。attendIdfromの型をIntegerto に変更しString、さらに適切なeditorFor/を使用することでlabelFor、問題は解決されました。たぶん、これは私と同じようにこのつまずきにぶつかった人を助けるでしょう.

于 2013-09-07T02:09:40.117 に答える