インターネットの世界でこんにちは。興味深い難問があります。
そのオブジェクトに純粋に MVC ビュー/部分ビューを使用する他のオブジェクトのリストが含まれている場合、オブジェクトを作成するためにビューをバインドすることは可能ですか?
男、それは次のようにすべて複雑になりました...私が意味することの簡単なコード例を挙げましょう:
Models:
public class ComplexObject
{
public string title { get; set; }
public List<ContainedObject> contents { get; set; }
}
public class ContainedObject
{
public string name { get; set; }
public string data { get; set; }
}
シンプルでいいでしょ?さて、これらのいずれかを作成するための強く型付けされたビューは、「タイトル」プロパティに対して非常に簡単です。
something like:
@Html.TextBoxFor(x => x.title)
しかし、MVC を使用して「ContainedObjects」のリストをバインドする良い方法がわかりません。私が得た最も近いものは、「リスト」足場テンプレートを使用して厳密に型指定された IEnumerable 部分ビューを作成し、それをページに含めることでした。
スタイリングなどを追加しないと、その部分ビューのデフォルトの外観は次のようになります。
@model IEnumerable<MVCComplexObjects.Models.ContainedObject>
<p>
@Html.ActionLink("Create New", "Create")
</p>
<table>
<tr>
<th>
@Html.DisplayNameFor(model => model.name)
</th>
<th>
@Html.DisplayNameFor(model => model.data)
</th>
<th></th>
</tr>
@foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.name)
</td>
<td>
@Html.DisplayFor(modelItem => item.data)
</td>
<td>
@Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
@Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
@Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
</td>
</tr>
}
</table>
しかし率直に言って、それを新しい ComplexObject の作成にバインドする方法がわかりません。つまり、次のようにバインドすることで、既存の ContainedObjects のリストを表示できます: @Html.Partial("PartialCreate", Model.contents)
しかし、私が本当に欲しいのは、次のようなものだと思います:
@Html.PartialFor("PartialCreate", x => x.contents)
Javascript を使用してこれをコーディングするのにそれほど問題はなかったことに注意してください (以下にコードを含めます) が、純粋に MVC でこれを行う方法があるかどうかを本当に知りたいです。私は WebForms からの最近の変換者です (とにかく、すべてのポストバックを AJAX 呼び出しに置き換えただけです)。この種のことは、私が取り組んでいるプロジェクトでよく出てきます。
とにかく、これが私が現在それを行う方法です:
HTML -
Name: <input type="text" id="enterName" />
Data: <input type="text" id="enterData" />
<a id="addItem">Add Item</a>
<ul id="addedItems">
</ul>
<a id="saveAll">Save Complex Object</a>
Javascript -
<script>
var contents = [];
$(document).ready(function () {
$('#addItem').click(function () {
var newItem = { name: $('#enterName').val(), data: $('#enterData').val() };
contents.push(newItem);
$('#addedItems').html('');
for (var i = 0; i < contents.length; i++) {
$('#addedItems').append(
"<li>" + contents[i].name + ", " + contents[i].data + "</li>"
);
}
});
$('#saveAll').click(function () {
var toPost = { title: "someTitle", contents: contents };
$.ajax({
url: '/Home/SaveNew',
type: 'POST',
data: JSON.stringify(toPost),
dataType: 'json',
contentType: 'application/json; charset=utf-8',
success: function (data, textStatus, jqXHR) {
alert("win");
},
error: function (objAJAXRequest, strError) {
alert("fail");
}
});
});
});
</script>
新しいオブジェクトを保存するたびに Javascript 呼び出しを実装する必要はありませんが、他の場所では標準の Razr コードを使用します。全体的に適度に一貫性を保ちたいと思います。
他の誰かがこの問題に遭遇し、解決策を見つけましたか?