0

MVC 3 + Razor を使用しています。Details という MVC ビューがあります。I SQL サーバー データベース テーブルから詳細データを取得して表示しました。クリック可能な<a/>列「タイプ」があります。Type Anchor リンクをクリックすると、Jquery ポップアップが表示されます。

| type      |   date   | completed |  
|________________________________ _|  
|           |          |           |  
| sample    | 1/1/2012 |           |  
|(Clickable)|

  1. Clicked 要素に関連する行データ全体を SQL サーバーのテーブルから取得し、そのデータを Jquery Dialog.Every タイプ フィールドに関連付けて表示するにはどうすればよいですか。

  2. Jquery Dailog にチェック ボックスがあります。選択されている場合、ビュー内の完了列には現在の日付が必要であり、データベース テーブルを更新する必要があります (日付フィールドを含む)。

コード サンプル、リンク、またはチュートリアルを探しています。[編集および追加] 機能を使用して何かを見つけることができませんでした。

4

2 に答える 2

0

ポップアップに部分ビューを使用し、要件に従って UI を作成し、行の詳細をモデルとしてこの部分ビューに渡します。

テーブルのhtmlは次のようになります

<tr id="@model.rowid">
        <td>
            sample
           (<a onclick="RowDetails(@model.rowid)">Clickable</a>)
        </td>
        <td>
            1/1/2012
        </td>
        <td>
        </td>
    </tr>

Clicktable のクリック時に JavaScript 関数を呼び出します。

function RowDetails(RowId) {
        $("#divDetails").load('/yourController/rowdetail', { id: RowId }).dialog({
            modal: true,
            title: "Row Detail",
            height: 400,
            width: 600,
            buttons: {
                "Ok": function () {
                    var isComplete = 0;
                    if ($("#rowComplete").is(":checked")) { isComplete = 1; }
                    $.get("/yourController/RowComplete", { id: RowId, isChk: isComplete }, function (d) {
                        $("#" + RowId).before(d).remove();
                        $("#" + RowId).hide().fadeIn('slow');
                    });
                    $(this).dialog('close');
                }
            }
        });
    }

そしてコントローラのような、

public ActionResult rowdetail(int id)
{
// code to get row from databse
// return this row as object to partial view
return("partial view for row details", Object);
}

public ActionResult RowComplete(int id, int chk)
{
// code to update row from databse
// return this row as object 
return("pass updated row", Object);
}
于 2012-08-07T08:50:31.633 に答える
0

私はasp.netやカミソリに精通していませんが、jQueryを使用すると、最初にスクリプトがSQLデータをロードし、それをJSON文字列に変換してjQueryに送り返すサーバーにajaxリクエストを行うことを知っています. その後、jQuery は JSON を解析し、フィールドにデータを入力できます。

jQuery (一般に JavaScript) での日付の処理は、サーバーではなくクライアントのマシンに基づいているため、注意が必要です。サーバーが現在の日付と照合してデータベースの更新を処理できるように、ajax を再度実行することをお勧めします。

于 2012-04-05T16:34:47.580 に答える