first I have a list of records that has an edit button for each row (Please see below image 1 parent window). Once I clicked the edit button, a pop-up will appear which shows the Answer field in the pop-up window (Please see image 2 child window). In the pop-up window, there is a text area which handles the answer value, from here the user can add/delete a value. once the user clicked the save button, the values should be save in the database and reflects the modified value of the answer field on the particular row that was choosen to edit in the parent window.
Here is my code so far, I didn't implement a Controller yet for this because I don't know how to, I don't know if the controller can be called here for saving the data in to the dadabase.
I am new to MVC, I am hoping that there is someone who can help and understand my problem.
Controller:
[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");
}
}
});
};
