0

フレキシグリッドの [編集] ボタンで次のコードを使用しています。

var url = '/Client/Details/' + id ;
$.getJSON(url, function (data) {
    //  setFormControls(data.Id, data.Role, data.Location, data.JobType, data.Description);
    alert(data);
});
//location.replace(url);
RunModalDialog("Edit Client: " + ClientName);

そして、私のフォームはこのような少し複雑なビューです

@model CardNumbers.Models.ClientViewModel
 @using (Html.BeginForm(null, null, FormMethod.Post, new { id = "sform", title = "Client Info" }))

 {    
  <fieldset>
    <legend>Client Info</legend>

    @Html.ValidationSummary(true)

    @Html.HiddenFor(m => m.ClientId)
    @Html.EditorFor(m => m.Number, EditorTemplate.TextBox)

    @Html.EditorFor(m => m.Name, EditorTemplate.TextBox)

    @Html.EditorFor(m => m.Client.Address, EditorTemplate.EditBox)

...

ここで、EditorFor はカスタム EditorFor です。そのため、返された json データを手動でフォーム プロパティに変換するのは少し困難です。この種の翻訳を行うための簡単な方法があるのではないかと思っています。ノックアウト.jsを調べましたが、プロジェクトで（まだ）使用していないので、他に何かあるのでしょうか?

助けてくれてありがとう。

アップデート。私の質問を明確にするために、もう少し情報を追加しています。

私の主な見解は次のとおりです。

@model CardNumbers.Models.ClientViewModel

   @section scripts {
    <script src="@Url.Content("~/Scripts/Clients.js")" type="text/javascript" ></script>
    }

   <form id="frmClientsSearch">
    <label for="clientNo">Client No: </label>
    <input type="number" name="searchClientNo" class="numericOnly" /><br />
    <label for="clientName">Client Name: </label>
    <input type="search" size="25" value="Please enter the search value"      class="SelectOnEntry"
        name="searchClientName" />

       <input type="button" id="btnClientsSearch" value="Find / Refresh" />
    </form>
    <div style="padding-left: 150px; padding-top: 50px; padding-bottom: 50px;"    id="ClientsResults">
    <table id="flexClients" style="display: none">
       </table>
    </div>

    <div id="editor" style="visibility:hidden">
       @Html.Partial("_ClientForm", Model);
    </div>

そして、私のjsファイルには次のものがあります：

    var $dlg = $("#sform").dialog({
    autoOpen: false,
    show: "blind",
    closeOnEscape: true,
    resizable: true,
    width: 1200,
    height: 750,
    minHeight: 600,
    minWidth: 950
    });

    function RunModalDialog(title, url)
{    
    if (title)
        $dlg.dialog("option", {"title": title });

    if (url)
    {        
        $dlg.load(url).dialog("option", { "title": title }).dialog("open");
    }
        //$dlg.load(url, function () {
        //    var validator = $("#sform").validate();
        //    if (validator)
        //         validator.resetForm();
        //    $dlg.dialog("option", { "title": title }).dialog("open");
        //});
    else {
        var validator = $("#sform").validate();
        if (validator)
            validator.resetForm();
        $dlg.dialog("open");
       }
    }

    function add(com, grid) {
    $('#fntype').val('Add');
    var url = '/Client/Add/'
    //location.replace(url);
    RunModalDialog("Create New Client");

   // clearForm();

   }

     function edit(com, grid)
      {
        $('.trSelected', grid).each(function () {

                var id = $(this).attr('id');
                id = id.substring(id.lastIndexOf('row') + 3);
                currentId = id;
                $('#fntype').val('Edit');
                var ClientName;
                ClientName =$('.trSelected td:eq(2)').text();
                var url = '/Client/Edit/' + id ;

                $.getJSON(url, function (html) {
                    //  setFormControls(data.Id, data.Role, data.Location, data.JobType, data.Description);
                    // alert(data);
                    $('#editor').html(html);
                });
               //location.replace(url);
               RunModalDialog("Edit Client: " + ClientName);
        });

    }

そして今、追加と編集で同じ動作が見られます。たとえば、編集ではデータが表示されません。 私が今見ているもの http://www.universalthread.com/Thread%20photos/2013/01562893.jpg

4

2 に答える 2

2

簡単にしたい場合は、表示したコードを部分ビューに配置し、詳細コントローラー アクションがこの部分ビューを返すようにします。このアクションを AJAX で呼び出すと、DOM で直接置き換えることができるパーシャルの更新されたコンテンツが返されます。この方法では、JSON 値をフォーム要素にバインドすることに煩わされる必要はありません。

public ActionResult Details(int id)
{
    ClientViewModel model = ...
    return PartialView(model);
}

その後：

var url = '/Client/Details/' + id ;
$.getJSON(url, function (html) {
    $('#someContainerDiv').html(html);
});

#someContainerDiv私の例で使用されているものは、明らかにメイン ビューで定義されます。

<div id="someContainerDiv">
    @Html.Partial("Details", Model)
</div>

パーシャルには、質問で示したフォームが含まれます。

于 2013-01-15T21:51:13.350 に答える
0

Jazzen Chen の助けを借りて、この問題を解決しました。変更する必要があったのは、上記の getJSON の代わりに get を使用することだけです。これで、フォームにデータが正しく表示されるようになりました。

于 2013-01-22T13:59:15.353 に答える