MVC 양식 방법= 두 개의 제출 버튼이있는 '포스트'
-
21-12-2019 - |
문제
여기에서 여러 개의 게시물을 검토했습니다. 나는 새로운 질문을 시도 할 것이다.
내 형식 :
<form method="post" action="@Url.Action("Manage")" data-cs-ajax="true" data-cs-target="#catalogList" >
.
Scott Allen의 OdeToFood 예제와 매우 유사한 자동 완전한 필드와 페이징이 있습니다.
다음이 있습니다 :
<input type="submit" value="Update" class="btn btn-default" />
.
일부 필터링 된 항목을 선택할 수있는 일부 필터링 된 항목을 업데이트합니다.
<input type="submit" name="btnSave" id="btnSave" value="Save" class="btn btn-default" />
.
둘 다 성공적으로 쳤습니다 :
//POST: /WebCatalog/Manage/5
[HttpPost, ActionName("Manage")]
[ValidateAntiForgeryToken]
public ActionResult Manage([Bind(Include = "Id,CatalogId,CatalogColourId,CatalogSizeId,CatalogCategoryId,CatelogSupplierId,StartDate,EndDate,Active,isSubmitted")] WebCatalogViewModel model, string searchTerm = null, int page = 1)
{ ...
.
JavaScript로 인해 컨트롤러 동작을 쳤습니다.
$(function () {
var ajaxFormSubmit = function () {
var $form = $(this);
var options = {
url: $form.attr("action"),
type: $form.attr("method"),
data: $form.serialize()
};
$.ajax(options).done(function (data) {
var $target = $($form.attr("data-cs-target"));
var $newHtml = $(data);
$target.replaceWith($newHtml);
var options = {};
$newHtml.effect("highlight", options, 500, doneEffect);
});
return false;
};
.
지금 ...
Controller가 두 번째 BTNSAVE 버튼을 클릭 한 것으로 알려주기 위해 모델의 필드를 설정하고 싶습니다. 물론 기록을 저장하려면 ....
soo ...
$(function () {
$("#btnSave").click(function () {
$("isSubmitted").val("1");
return true;
});
});
.
및 해당 화재 : AjaxFormSubmit에서 페이지가 제출되기 전에 $ (# btnsave "의 버튼 jQuery 코드가 성공적으로 화재됩니다.
그러나 컨트롤러 동작에서 Issubmitted는 항상 0입니다.
시도한 것 :
$("isSubmitted").val(1);
.
방법= '가져 오기'로 형식을 시도했고 여전히 게시물이 없었지만, BTNSAVE에서 JavaScript로 메소드를 변경하려고 시도 할 수 있습니다. 어떻게 해야할지 모르겠습니다. 양식 컨트롤에서 값을 저장할 수 없으므로 양식 방법을 변경할 수 있습니까 ??
$ ajax.actionLink를 시도했지만 항상 500 IIS 오류를 얻습니다.
기본적으로 사용자가 업데이트 버튼이 아닌 저장 버튼을 클릭 한 것을 알 수있는 방법이 필요합니다.
모든 조언을 높이 평가합니다!
해결책
@robert achmann, 여기에 내 대답이 있습니다
$ ( "발급")가 누락 된 것 같습니다.ID가 발급 된 ID가있는 입력을위한 $ ( "# 발급).
다른 팁
컨트롤러를 클릭 한 버튼을 알려주는 숨겨진 값이 필요하지 않습니다.해야 할 일은 2 개의 버튼의 이름을 따르는 것입니다
<input type="submit" name="btnAction" value="Update" class="btn btn-default" />
<input type="submit" name="btnAction" value="Save" id="btnSave" class="btn btn-default" />
.
보시다시피, 동일한 이름이지만 다른 값 (vs 저장 업데이트)이 있습니다.
컨트롤러에서 버튼의 이름 인 btnAction
라는 다른 매개 변수를 동작에 추가합니다.
[HttpPost, ActionName("Manage")]
[ValidateAntiForgeryToken]
public ActionResult Manage(string btnAction, [Bind(Include = "Id,CatalogId,CatalogColourId,CatalogSizeId,CatalogCategoryId,CatelogSupplierId,StartDate,EndDate,Active,isSubmitted")] WebCatalogViewModel model, string searchTerm = null, int page = 1)
{
if(btnAction.ToLower() == "save")
{
// The save button was clicked
}
else if(btnAction.ToLower() == "update")
{
// The update button was clicked
}
else
{
// default ...
}
}
.
기본적으로 PerganeCodicicetagcode 매개 변수는 양식을 트리거하여 포스트를 얻는 제출 단추의 값을 가져옵니다.
이 도움이되기를 바랍니다.
양식의 숨겨진 필드가 숨어있는 필드를 클릭하여 (jQuery 이벤트 핸들러로 제어)하고,이를 입력하는 대신 버튼 유형="버튼"을 만들 수 있습니다.jQuery 코드에서 양식을 제출하거나 EventPreventDefault를 사용할 수 있습니다.
다음은 도움이 될 수있는 코드 샘플입니다.
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("#bt1").click(function(){
alert(' Save button');
$("#operation").val('save');
$("#frm").submit();
});
$("#bt2").click(function(){
alert(' Update button');
$("#operation").val('update');
$("#frm").submit();
});
});
</script>
</head>
<body>
<form id="frm">
<div id="div1"><h2> Form buttons - What of then was clicked? </h2></div>
<button id="bt1"> Save button </button>
<button id="bt2"> Update button </button>
<input type="hidden" id="operation" name="operation" value=""/>
</form>
</body>
</html>
.