0

まず、各行に編集ボタンがあるレコードのリストがあります（下の画像1の親ウィンドウを参照してください）。編集ボタンをクリックすると、ポップアップが表示され、ポップアップウィンドウに[回答]フィールドが表示されます（画像2の子ウィンドウを参照してください）。ポップアップウィンドウには、回答値を処理するテキスト領域があり、ここからユーザーは値を追加/削除できます。ユーザーが[保存]ボタンをクリックすると、値がデータベースに保存され、親ウィンドウで編集するように選択された特定の行の回答フィールドの変更された値が反映されます。

これまでの私のコードは次のとおりです。方法がわからないため、まだコントローラーを実装していません。データをdadabaseに保存するためにコントローラーをここで呼び出すことができるかどうかもわかりません。

私はMVCを初めて使用します。私の問題を助け、理解してくれる人がいることを望んでいます。

コントローラ：

[HttpPost] 
       public ActionResult Sample(string answers, string question, string controlid, string eventid)
       {

           return View("CustomizedQuestion");
       }

Javascript：

$(".editButton").live("click", function (e) {
                e.preventDefault();
                var $title = $(this).attr("title");
                var $answers = $(this).attr("answers");
                var $controlid = $(this).attr("id");
                dropdownlist($controlid, $title, $answers);
            });

 function dropdownlist(controlid, title, answers, eventid) {

var $answersreplaced = answers.replace(/\,/g, " \r");

var $deleteDialog = $('<div><textarea id="answerlist"  rows="10" cols="50">' + $answersreplaced + '</textarea><div><div style="font-size:9px">(To change back to an open answer field, delete all choices above and save)</div>');

$deleteDialog.dialog({

    resizable: false,

    height: 280,

    width: 350,

    title: title + " - Edit Choices",

    modal: true,

    buttons: {

        "Save": function () {
            $.ajax({
                url: '@Url.Action("Sample")',
                type: 'POST',
                dataType: 'json',
                data: { answers: $('#answerlist').val(),
                       question: title,
                       controlid: controlid,
                       eventid: eventid
                     },

                success: function (resp) {

                    $(this).dialog("close");
                },

                error: function () {
                    alert('there was a problem saving the new answers, please try again');
                   }
            });

        },

        Cancel: function () {

            $(this).dialog("close");

        }

    }

});

};

ここに画像の説明を入力してください

ここに画像の説明を入力してください

4

1 に答える 1

0

コメントで要求されたとおり：

$(".editButton").live("click", function (e) {
        e.preventDefault();
        var $title = $(this).attr("title");
        var $answers = $(this).attr("answers");
        var $controlid = $(this).attr("id");
        var questionID = $(this).attr('questionID');
        dropdownlist(this, questionID, $controlid, $title, $answers);
    });

function dropdownlist(el, questionID, controlid, title, answers) {
    var $answersreplaced = answers.replace( /\,/g , "&nbsp;\r");
    var $deleteDialog = $('<div><textarea id="answerlist"  rows="10" cols="50">' + $answersreplaced + '</textarea><div><div style="font-size:9px">(To change back to an open answer field, delete all choices above and save)</div>');
    $deleteDialog
        .dialog({
            resizable: false,
            height: 280,
            width: 350,
            title: title + " - Edit Choices",
            modal: true,
            buttons: {
                "Save": function () {
                    var dialog = $(this);
                    $.ajax(function()
                    {
                        url : 'controller-path',
                        type : 'POST',
                        dataType : 'json',
                        data : 
                        {
                            Answers : $("#answerlist").val(),
                            QuestionID : questionID
                        },
                        success : function(resp)
                        {
                            $(dialog).dialog("close");
                            var newanswers = $("#answerlist").val();
                            modifyanswers(controlid,newanswers);
                        },
                        error : function()
                        {
                            alert('there was a problem saving the new answers, please try again');
                        }
                    });
                },
                Cancel: function () {
                    $(this).dialog("close");
                }
            }
        });
};

これに加えてquestionID、回答が関連する行の ID を格納するという名前の属性を追加する必要があります。

別の注意として、この方法で属性を使用することは避けます。タイトルは有効な属性であるため、タイトルに保存できますが、回答と私の例では questionID は有効な属性ではなく、その結果、HTML 検証に失敗します。

別の方法でそれらを保存することを検討できます/すべきです。

于 2012-05-21T09:41:50.390 に答える