0

私はMVCに不慣れで、基本モデルを理解していますが、それでもポストバックなどですべてを行っています。

私が構築したいUIの1つの側面は、データベースにアイテムを追加してリストを更新するためのボタンを備えたアイテムのドロップダウンリストを用意することです。すべてがUpdatePanelsにラップされているため、WebFormsでこれを実現するのは簡単でしたが、MVCを使用してこれを実現するための最良のアプローチは何ですか？

リストとボタンのマークアップの一部は次のようになります。

<table>
    <tr>
        <td><%=Html.DropDownList("JobTitleSelectList", Model.JobTitleSelectList, "(select job title)", new { @class = "data-entry-field" })%></td>
        <td>&nbsp;</td>
        <td><a id="AddJobTitleDialogLink" href="javascript: addJobTitleDialog();" title="Add Job Title"><img id="AddJobTitleButtonImage" src="/Content/Images/Icons/16x16/PlusGrey.png" border="0" /></a></td>
    </tr>
</table>

ダイアログは標準のjqueryUiダイアログで、次のようになります。

<div id="SingleTextEntryDialog" style="display:none">
        <table>
            <tr>
                <td>Name:</td>
                <td><input id="SingleTextEntryDialogText" type="text" size="25" /></td>
            </tr>
        </table>
    </div>

これをUserControl/PartialViewに入れる必要があると思います（同じものですか？）また、強く型付けされたViewを使用して、ModelまたはSelectListプロパティのみをUserControlに渡すにはどうすればよいですか？そうではありませんか？

ダイアログdivにフォームがあるべきかどうかもわかりませんか？または、それがajaxを介してポストバックする方法。

いくつかの例は、次のようなページ内の多くのajaxコードを示しています$.ajax({...}); 。jqueryを使用してこれを行うことはasp.net Webフォームよりも多くのコードであると思いますが、ページで「ソースの表示」を行うことを確認するためのコードはもっとありますか？

あなたのコメントはありがたいです。

4

1 に答える 1

1

ボタンがクリックされた後、AJAX を使用するか、ページ全体のリロードを実行することができます。最初のフォームにはユーザーが要素を選択できるドロップダウン リストが含まれ、2 つ目のフォームには入力フィールドと追加ボタンが含まれます。どちらのフォームも、コントローラーの異なるアクションに投稿されます。

AJAX を使用しないことにした場合は、次の方法で続行できます。役職の選択を含むフォームを追加します。

<div id="selectjobcontainer">
<% using (Html.BeginForm("selectjob", "home")) { %>
    <%= Html.DropDownList("JobTitleSelectList", Model.JobTitleSelectList) %>
    <input type="submit" value="Select job title" />
<% } %>
</div>

ユーザーがリストに役職を追加できる別のフォームを追加します。

<div id="addjobcontainer">
<% using (Html.BeginForm("addjob", "home")) { %>
    <%= Html.TextBox("JobTitle") %>
    <input type="submit" value="add job title" />
<% } %>
</div>

このAddJobアクションは、ジョブ タイトルをモデルに追加し、ジョブ ドロップダウン リストを更新する同じビューをレンダリングする必要があります。

AJAX を使用してドロップダウン リストを更新することにした場合、AddJobアクションは最初のフォームを含む部分ビューを返す必要がありascxます。つまり、メイン ビューに含める別のコントロールにそのコードを配置する必要があります。

あとは、jQuery フォームプラグインを使用して 2 番目のフォームを ajax 化するだけです。

$(function() {
    $('#addjobcontainer form').ajaxForm({
        success: function(html) {
            $('#selectjobcontainer').html(html);
        }
    });
});
于 2010-03-25T10:58:46.213 に答える