여러 행 양식에 대해 여러 제출 단추를 구현하려면 어떻게합니까?

Question

I이 형식 것이다 형태 가지고

1. I는 첫 번째 행 (텍스트 박스) 오전 [제출 버튼]
2. I는 두 번째 행 (라디오 버튼)이다 I는 세 번째 행이다
3. 을 [버튼 제출] (체크 박스) 내가 네 번째 행 (드롭)를
4. 을 [버튼 제출] 제출 버튼]
5. I 다섯 번째 행 (텍스트 박스)이다 나는 여섯 번째 열 (텍스트 박스)
6. 을 [버튼 제출] 제출 버튼]
(: 나는 네 번째 행입니다 예) 및 컨트롤의 값이 데이터베이스에서로드됩니다
7. 나는

텍스트 [버튼 제출] 일곱 번째 행 (라디오 버튼)을 생각합니다. 제출 버튼이 컨트롤 (예 : 행 4, 드롭 다운 값 == N/A)의 값만 서버에 보내길 원합니다. 모든 컨트롤의 값이 아닙니다.

이제 각 행을 Html.BeginForm으로 줄이거 나 모든 행을 하나의 Html.BeginForm으로 래핑 할 수 있습니까? 그런 일을 처리하는 가장 좋은 (또는 더 나은) 방법은 무엇입니까?

참고 : 저는 주위를 수색했으며 이와 같은 문제는 보지 못했습니다.

Answer 1

테이블을 빌드하기 위해 루프를 만들어야하는 것과 같은 소리가 나고 조건부로 특정 요소 유형 (텍스트, 라디오, 체크 박스 등)을 입력하기 위해 키잉하는 것을 기반으로 행을 조건부로 만듭니다. .) 각 행은 양식 태그로 싸여 야합니다. 올바른 요소를 평가해야하기 때문에 BeginForm을 작성하여 액션에 게시 할 위치, 요소 유형별로 다른 액션을 지정하여 액션이 수신 할 데이터 만 수신하도록 할 수 있습니다

Answer 2

먼저 양식 태그를 중첩 할 수 없습니다 (브라우저에서 지원하지 않음).

클릭시 입력 [유형 = 제출]은 '상위 형식'에서 게시 후 이벤트를 트리거합니다. 예.

<form action='/PostBackTo' onsubmit='DoSomething()'> 
<input type='submit /> 
</form> 

그래서 당신은 자신의 형태로 내부의 모든 제어와 양식 내부 태그를 입력에 거주하거나 선택해야합니다 다시 게시 할 추가 데이터를 포장해야합니다.

는 당신이 다시 게시에 포함하도록 모든 형태의 태그 안에

<input type='hidden' value='@id' /> 

을 추가해야합니다, 모든 제출 당신이 ID를 다시 게시하고 싶은 말.

이렇게하면 자바 스크립트를 사용하여 제출 작업을 차단하고 AJAX 게시물을 통해 양식 데이터를 제출하십시오 ('변경 사항 저장'버튼과 같은 경우).

Answer 3

예 : 1.난 당신이 사용하는 jQuery를 할 수 있다고 생각

function post(name) 
{ 
    var txt = document.getElementById(name).value; 
    $.getJSON("/Controller/Action", 
    { 
     text: txt 
    }, 
    function (data) { 
     //returned result 
    }); 
} 

Answer 4

:

<input type="text" value="@textValue" id="txtFirstRow" /> 
<input type="button" onclick="post('txtFirstRow');" /> 

자바 스크립트 코드 : 나는 첫 번째 행입니다 모두의 우선 각 행에 대한 개별 형태를 만들 수 있습니다. 코드 이하로 사용해보십시오 .. JQuery와 :

function SubmitForm(btn) 
{ 
    var form = btn.serialize(); 
    $.post("your URL here",form,function() { 
     alert("Saved"); 
    }); 
} 

HTML :

<form id='form1' > 
... 
Other controls on your form 
... 
<input type="button" id="form1" onclick="SubmitForm(this)" /> 
</form>