2010-02-02 1 views
1

각 행에 데이터베이스의 상태 비트를 토글하는 버튼이있는 HTML 표가 있습니다. Javascript가 옵션이 아니라고 가정 할 때, 이것을 처리하는 "모범 사례"는 무엇일까요?ASP.NET MVC 2 : 각 HTML 테이블 행에서 여러 버튼을 처리하는 더 나은 방법은 무엇입니까?

나는 현재 폼이 같은에 포장 각 행하여 처리 해요 :

<table> 
    <tr> 
     <td> 
      <form action="/FooArea/BarController/BazAction" id="frm0" name="frm0" method="post"> 
       <span>Item 1</span> 
       <input type="submit" value="Toggle1" name="submitButton" /> 
       <input type="submit" value="Toggle2" name="submitButton" /> 
       <input type="hidden" name="itemID" value="1" /> 
      </form> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <form action="/FooArea/BarController/BazAction" id="frm1" name="frm1" method="post"> 
       <span>Item 2</span> 
       <input type="submit" value="Toggle1" name="submitButton" /> 
       <input type="submit" value="Toggle2" name="submitButton" /> 
       <input type="hidden" name="itemID" value="2" /> 
      </form> 
     </td> 
    </tr> 
</table> 

그리고 포스트 방법은 다음과 같이 보입니다 :

string buttonName = Request.Form["submitButton"];  
if (!String.IsNullOrEmpty(buttonName)) 
{ 
    int itemID = Convert.ToInt32(Request.Form["itemID"]); 
    switch (buttonName) 
    { 
     case "Toggle1": 
     DoSomething(itemID); 
     break; 

     case "Toggle2": 
     DoSomethingElse(itemID); 
     break; 
    } 
} 

더 좋은 제안을? 한 페이지에 50 개의 양식이 포함되어 있습니까? 몰라요.이 경우에 당신이하고있는 일을 알려주세요.

답변

2

JavaScript가없는 POST 시나리오를 처리하는 가장 좋은 방법은 여러 다른 사람이 말한 것처럼 필요한 값만있는 작은 양식과 제출 단추 하나뿐입니다. 기본적으로 숨겨진 필드와 제출 버튼에 필요한 POST 값이있는 양식을 만드는 도우미 메서드를 만드는 것이 좋습니다. 예를 들어, 당신은 다음과 같이 사용하는 방법 할 수 : 그것은 꽤 자세한 보이는

<%= Html.PostLink("FooArea/BarController/BazAction", "Toggle1", new List<KeyValuePair<string, string>>{ new KeyValuePair<string, string>("itemId", 1), new KeyValuePair("action", "option1") }); %> 

을, 그러나 나는 가능한 한 포괄적으로 만들기 위해 노력했습니다. 뷰를 렌더링 할 때 당신은 아마 컨트롤러에 List<KeyValuePair<string, string>>를 만들 수 있습니다, 그래서 당신은 단지 게시물을 처리하는 액션 메소드에서 뭔가

<%= Html.PostLink("FooArea/BarController/BazAction", "Toggle1", Model.Values) %> 

에게 전화를해야, 당신이 게시 FormCollection에 결합, 그리고 값을 검색 및 action을 입력하여 Request.Form 값을 확인하는 대신 수행 할 작업을 결정하십시오.

도우미 방법의 구현은 다음과 같습니다

public static string PostLink(this HtmlHelper helper, string postAction, string submitText, IEnumerable<KeyValuePair<string, string>> postValues) 
{ 
    var form = new TagBuilder("form"); 

    // Setup basic properties like method, action 
    form.Attributes.Add("method", "post"); 
    form.Attributes.Add("action", postAction); 

    // Instantiate a stringbuilder for the inner html of the form 
    var innerHtml = new StringBuilder(); 

    // Create and append hidden fields for the post values 
    foreach(var value in postValues) 
    { 
     var hidden = new TagBuilder("input"); 
     hidden.Attributes.Add("type", "hidden"); 
     hidden.Attributes.Add("name", value.Key); 
     hidden.Attributes.Add("value", value.Value); 
     innerHtml.Append(hidden.ToString(TagRenderMode.SelfClosing)); 
    } 

    // Create the submit button 
    var submit = new TagBuilder("input"); 
    submit.Attributes.Add("type", "submit"); 
    submit.Attributes.Add("value", submitText); 
    // Append it to the stringbuilder 
    innerHtml.Append(submit.ToString(TagRenderMode.SelfClosing)); 

    // Set the InnerHtml property of the form, and return it 
    form.InnerHtml = innerHtml.ToString(); 
    return form.ToString(TagRenderMode.Normal); 
} 
+0

숨겨진 필드를 사용하는 HTML 도우미 양식을 만드는 것은 매우 흥미로운 방법입니다. 나는 그것을 좋아한다. 특히 컨트롤러에서 숨겨진 입력 집합을 전달하고 전체 거래를 단순화 할 수 있기 때문에 특히 그렇습니다. :) 이것을 공유해 주셔서 감사합니다! –

0

이것은 일부 JQuery 및 Ajax 기능의 주요한 케이스처럼 보입니다. 하지만 javascript가 옵션이 아니라면 폼에서 각각을 래핑하는 것이 가장 간단한 해결책 일 것입니다.

+0

감사합니다, 참으로 내가 내려다 보이는 해요 뭔가가 있는지 알아 내려고 노력하고있어. 나는 이것이 가장 우아한 해결책이라고 확신하지 않는다. 그렇다면 그것을 수행하는 방법이라면, 어이 ...;) –

0

내가 이와 같은 일을해야 할 때 나는 여기서 한 것처럼 거의 같은 방식으로합니다. 하나의보기에서 여러 양식을 갖는 것은 문제가되지 않습니다. 하나의보기에 여러 개의 링크가있는 것 (그러나 GET 대신 POST가 사용됨). 많은 .net 개발자가 하나의 form 태그 만 갖는 webform 때문에 잘못 생각한다고 생각합니다. 귀하의 경우에는 제출 단추마다 다른 양식을 작성하는 것처럼 양식을 더 작성합니다. 나는 코드 냄새가 컨트롤러에서 버튼의 이름을 확인하는 데 고려해야 할 고려하십시오. 그들이 활성화/비활성화와 같은 일을하는 경우에는 bool 또는 무언가로 게시해야하며 두 양식 모두 동일한 작업에 게시해야합니다.

+0

페이지 당 1 개의 양식에 익숙해 져있어서 50을 보아도 무방하다. 하나는 충격으로 나를 공격합니다.귀하의 의견에 감사드립니다 Mattias. –

+0

P. 또한 내가 지적한 이유로 Activate/Disable에서 값을 편집했습니다. 나는 그 하나가 오는 것을 보았다. –

+1

예, 이해할 수 있습니다. 웹 양식에서 이전 한 것과 같은 느낌이었습니다. 비록 당신이 자바 스크립트와 아약스로 이것을 할지라도 아마 어쨌든 그 폼들을 추가 할 것입니다. 그렇게하면 브라우저에서 자바 스크립트가 비활성화되고 jquery 아약스 양식 플러그인을 사용하기가 쉽습니다. –

0

기술적으로 이것이 최선의 방법이라고 생각합니다. 사용성 관점에서 이것이 최선의 방법인지 질문 할 수 있습니다. 목록에있는 20 개 이상의 항목이 상당히 혼란 스러울 수 있습니다. 그러나 당연히, 나는 당신이 무엇을 프로그래밍하고 있는지 정말로 모른다. :)

활성화 및 비활성화 버튼에 대한 다른 동작을 만드는 것에 관해 Mattias는 동의한다. 이렇게하면 switch 문을 사용하지 않아도됩니다.

관련 문제