ASP.NET MVC ActionLink 및 게시 방법

StackOverflow https://stackoverflow.com/questions/2048778

  •  20-09-2019
  •  | 
  •  

문제

ActionLink 및 POST 메서드를 사용하여 컨트롤러에 값을 제출하는 방법을 알려줄 수 있는 사람이 있나요?
버튼을 사용하고 싶지 않습니다.
나는 그것이 jquery와 관련이 있다고 생각합니다.

도움이 되었습니까?

해결책

당신은 사용할 수 없습니다 ActionLink 그것은 단지 앵커를 렌더링하기 때문입니다 <a> 꼬리표.
당신은 a를 사용할 수 있습니다 jQuery ajax 게시물.
또는 아마도 jQuery가 있거나없는 양식의 제출 방법을 호출합니다 (아마 onclick 어떤 통제 가든 이벤트가 당신의 공상을 취합니다.

다른 팁

ASP MVC3을 사용하는 경우 ajax.actionLink ()를 사용할 수 있으므로 "POST"로 설정할 수있는 HTTP 메소드를 지정할 수 있습니다.

jQuery를 사용하여 모든 버튼에 대한 게시물을 수행 할 수 있습니다. 그들에게 동일한 cssclass 이름을주십시오.

"반환 거짓"을 사용하십시오. OnClick JavaScript 이벤트가 끝나면 게시물 후 서버 측 리디렉션 연합을 수행하려면보기를 반환하십시오.

면도기 코드

@using (Html.BeginForm())
{
    @Html.HiddenFor(model => model.ID) 
    @Html.ActionLink("Save", "SaveAction", "MainController", null, new { @class = "saveButton", onclick = "return false;" })
}

jQuery 코드

$(document).ready(function () {
        $('.saveButton').click(function () {
            $(this).closest('form')[0].submit();
        });
    });

씨#

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult SaveAction(SaveViewModel model)
{
    // Save code here...

    return RedirectToAction("Index");
    //return View(model);
}

@aidos는 @codingwithspike가 만든 그의 게시물에 대한 의견 안에 숨겨져 있기 때문에 정답을 분명히하고 싶었습니다.

@Ajax.ActionLink("Delete", "Delete", new { id = item.ApkModelId }, new AjaxOptions { HttpMethod = "POST" })

다음은 기본 ASP.NET MVC 5 프로젝트에 구워진 답변이 있습니다. UI에서 스타일링 목표를 멋지게 달성한다고 생각합니다. 양식은 순수한 자바 스크립트를 사용하여 일부 포함 된 양식에 제출하십시오.

@using (Html.BeginForm("Logout", "Account", FormMethod.Post, new { id = "logoutForm", @class = "navbar-right" }))
{
   <a href="javascript:document.getElementById('logoutForm').submit()">
      <span>Sign out</span>
   </a>
}

완전히 표시된 유스 케이스는 웹 앱의 내비게이션 막대에서 로그 아웃 드롭 다운입니다.

@using (Html.BeginForm("Logout", "Account", FormMethod.Post, new { id = "logoutForm", @class = "navbar-right" }))
{
    @Html.AntiForgeryToken()

    <div class="dropdown">
        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
            <span class="ma-nav-text ma-account-name">@User.Identity.Name</span>
            <i class="material-icons md-36 text-inverse">person</i>
        </button>

        <ul class="dropdown-menu dropdown-menu-right ma-dropdown-tray">
            <li>
                <a href="javascript:document.getElementById('logoutForm').submit()">
                    <i class="material-icons">system_update_alt</i>
                    <span>Sign out</span>
                </a>
            </li>
        </ul>
    </div>
}

ActionLink는 게시물을 발사하지 않습니다. 항상 요청을 시작합니다.

다음 호출 조치 링크를 사용하십시오.

<%= Html.ActionLink("Click Here" , "ActionName","ContorllerName" )%>

양식 값을 제출하려면 사용하십시오.

 <% using (Html.BeginForm("CustomerSearchResults", "Customer"))
   { %>
      <input type="text" id="Name" />
      <input type="submit" class="dASButton" value="Submit" />
   <% } %>

데이터를 고객 컨트롤러 및 CustomerEarchResults Action에 제출합니다.

이 링크를 ajax.beginform 내에서 사용하십시오

@Html.ActionLink(
    "Save", 
    "SaveAction", 
    null, 
    null, 
    onclick = "$(this).parents('form').attr('action', $(this).attr('href'));$(this).parents('form').submit();return false;" })

;)

이 문제에 대한 나의 해결책은 상당히 간단합니다. 고객 검색을 수행하는 페이지가 전체 이메일로 검색하고 다른 쪽은 부분적으로 부분적으로 검색하고 부분적으로 당기고 목록에 표시되는 목록에 액션 링크가있는 ActionResult를 가리키고 ID에서 통과합니다.

GetByid는 선택한 고객의 데이터를 가져오고 반환합니다. 

return View("Index", model);

게시물 방법입니다

이것이 어려운 문제를 해결합니다.어떻게 만들 수 있습니 동적 링크를 면도칼 및 html 할 수 있는 통화 작업 방법을 통과 값을 특정 작업 방법이 있나요?는 몇 가지 옵션을 포함하여 사용자 지정 html helper.나는 그냥 와서와 함께하는 간단하고 우아한 솔루션입니다.

보기

@model IEnumerable<MyMvcApp.Models.Product>

@using (Html.BeginForm()) {

     <table>
         <thead>
             <tr>
                 <td>Name</td>
                 <td>Price</td>
                 <td>Quantity</td>
            </tr>
        </thead>
        @foreach (Product p in Model.Products)
        {
            <tr>
                <td><a href="@Url.Action("Edit", "Product", p)">@p.Name</a></td>
                <td>@p.Price.ToString()</td>
                <td>@p.Quantity.ToString()</td>
            </tr>
         }
    </table>
}

작업 방법

public ViewResult Edit(Product prod)
{
    ContextDB contextDB = new ContextDB();

    Product product = contextDB.Products.Single(p => p.ProductID == prod.ProductId);

    product = prod;

    contextDB.SaveChanges();

    return View("Edit");
}

여기에 포인트에는 Url 이 있습니다.작은 걱정하지 않는지 여부를 조치 방법을 게시합니다.그것은에 액세스하거나 유형의 방법입니다.전달할 수 있습니다 데이터 작업에 사용하는 방법 

@Url.Action(string actionName, string controllerName, object routeValues)

이 routeValues 개체입니다.내가 이것을 시도 하고 작동합니다.No,당신은 기술적으로 게시하는 양식을 제출 하는 경우 routeValues 체에 포함되는 데이터,이 경우 문제 해당 게시물 또는 얻을.당신이 사용할 수 있는 특정 조치 방법을 서명하는 선택 방법입니다.

다음 코드를 사용하여 동일한 문제를 수행했습니다.

@using (Html.BeginForm("Delete", "Admin"))
{
       @Html.Hidden("ProductID", item.ProductID)
       <input type="submit" value="Delete" />
}

이것은 문제에 대한 나의 해결책입니다. 이것은 2 가지 동작 방법이있는 컨트롤러입니다

public class FeedbackController : Controller
{
public ActionResult Index()
{
   var feedbacks =dataFromSomeSource.getData;
   return View(feedbacks);
}

[System.Web.Mvc.HttpDelete]
[System.Web.Mvc.Authorize(Roles = "admin")]
public ActionResult Delete([FromBody]int id)
{
   return RedirectToAction("Index");
}
}

고려할 때 나는 구조를 따르는 구조를 렌더링한다.

<html>
..
<script src="~/Scripts/bootbox.min.js"></script>
<script>
function confirmDelete(id) {
  bootbox.confirm('@Resources.Resource.AreYouSure', function(result) {
    if (result) {
      document.getElementById('idField').value = id;
      document.getElementById('myForm').submit();
    }
  }.bind(this));
}
</script>

@using (Html.BeginForm("Delete", "Feedback", FormMethod.Post, new { id = "myForm" }))
{
  @Html.HttpMethodOverride(HttpVerbs.Delete)
  @Html.Hidden("id",null,new{id="idField"})
  foreach (var feedback in @Model)
  {
   if (User.Identity.IsAuthenticated && User.IsInRole("admin"))
   {
    @Html.ActionLink("Delete Item", "", new { id = @feedback.Id }, new { onClick = "confirmDelete("+feedback.Id+");return false;" })
   }
  }
...
</html>

면도기보기에 대한 관심 지점:

  1. 자바 스크립트 기능 confirmDelete(id) 링크가 생성 될 때 호출됩니다 @Html.ActionLink 클릭됩니다.

  2. confirmDelete() 클릭중인 항목의 기능 필수 ID. 이 항목은 전달됩니다 onClick 매니저 confirmDelete("+feedback.Id+");return false; 지불 핸들러 지불 기본 조치를 방지하여 타겟팅에 요청을받습니다. OnClick 버튼의 이벤트는 목록의 모든 버튼에 대한 jQuery로 첨부 될 수 있습니다 (HTML 페이지에서 텍스트가 적을 수 있으므로 데이터를 전달할 수 있기 때문에 더 나을 것입니다. data- 기인하다).

  3. 양식이 있습니다 id=myForm, 그것을 찾기 위해 confirmDelete().

  4. 양식이 포함됩니다 @Html.HttpMethodOverride(HttpVerbs.Delete) 사용하기 위해 HttpDelete 동사, HttpDeleteAttribute.

  5. JS 기능에서는 작업 확인을 사용합니다 (외부 플러그인의 도움으로 표준 확인도 잘 작동합니다. 사용하는 것을 잊지 마십시오. bind() 전화 또는 var that=this (당신이 선호하는 것은 무엇이든).

  6. 양식에는 숨겨진 요소가 있습니다 id='idField' 그리고 name='id'. 따라서 확인 후 양식을 제출하기 전에 (result==true), 숨겨진 요소의 값은 전달 된 인수로 설정되며 브라우저는 다음과 같이 컨트롤러에 데이터를 제출합니다.

URL을 요청하십시오:http://localhost:38874/Feedback/Delete

요청 방법: 사후 상태 코드 : 302 발견

응답 헤더

위치 :/피드백 호스트 : LocalHost : 38874양식 데이터 x-http-method-override : 삭제 ID : 5

보시다시피 X-HTTP-Method-Override : 삭제 및 본문의 데이터가 "ID : 5"로 설정된 사후 요청입니다. 응답에는 인덱스 작업으로 리디렉션되는 302 코드가 있습니다.이를 통해 삭제 후 화면을 새로 고칩니다.

순수한 휴식 원칙을 유지하고 삭제에 HTTP 삭제를 사용하는 것이 좋습니다. 불행히도 HTML 사양에는 HTTP get & post 만 있습니다. 태그는 HTTP 만 얻을 수 있습니다. 양식 태그는 http get 또는 post를 수행 할 수 있습니다. 다행스럽게도 AJAX를 사용하면 HTTP 삭제를 수행 할 수 있으며 이것이 제가 권장하는 것입니다. 자세한 내용은 다음 게시물을 참조하십시오. HTTP 삭제

$.post() 호출은 Ajax 기반이므로 작동하지 않습니다.따라서 이를 위해서는 하이브리드 방식을 사용해야 합니다.

다음은 나를 위해 일하는 솔루션입니다.

단계:1.URL 및 매개 변수 2가있는 메소드를 호출하는 href 용 URL을 만듭니다.JavaScript 메소드를 사용하여 일반 POST 호출

해결책:

.cshtml에서:

<a href="javascript:(function(){$.postGo( '@Url.Action("View")', { 'id': @receipt.ReceiptId  } );})()">View</a>

메모:익명의 방법은 (....) () IE로 싸여 있어야합니다. 

(function() {
    //code...
})();

포스트고 JavaScript에서는 아래와 같이 정의됩니다.나머지는 간단합니다..

@Url.Action("보기") 통화에 대한 URL을 생성합니다

{ 'ID':@receipt.ReceiptId } postGo 메소드에서 POST 필드로 변환되는 객체로 매개변수를 생성합니다.필요한 모든 매개변수가 될 수 있습니다.

자바스크립트에서:

(function ($) {
    $.extend({
        getGo: function (url, params) {
            document.location = url + '?' + $.param(params);
        },
        postGo: function (url, params) {
            var $form = $("<form>")
                .attr("method", "post")
                .attr("action", url);
            $.each(params, function (name, value) {
                $("<input type='hidden'>")
                    .attr("name", name)
                    .attr("value", value)
                    .appendTo($form);
            });
            $form.appendTo("body");
            $form.submit();
        }
    });
})(jQuery);

postGo에 사용한 참조 URL

jQuery를 사용하는 비 ajax GET/POST(플러그인?)

http://nuonical.com/jquery-postgo-plugin/

jQuery.post() 사용자 정의 데이터가 있으면 작동합니다. 기존 양식을 게시하려면 사용하기가 더 쉽습니다. ajaxSubmit().

이 코드를 설정할 필요가 없습니다. ActionLink 그 자체로, 당신은 링크 핸들러를 document.ready() 이벤트 (어쨌든 선호되는 메소드), 예를 들어 $(function(){ ... }) jQuery 트릭.

검색 (인덱스) 페이지에서 결과 페이지로 게시 해야하는이 문제가 발생했습니다. @vitaliy가 말한 것만 큼 필요하지는 않았지만 올바른 방향으로 나를 가리 켰습니다. 내가해야 할 일은 다음과 같습니다.

@using (Html.BeginForm("Result", "Search", FormMethod.Post)) {
  <div class="row">
    <div class="col-md-4">
      <div class="field">Search Term:</div>
      <input id="k" name="k" type="text" placeholder="Search" />
    </div>
  </div>
  <br />
  <div class="row">
    <div class="col-md-12">
      <button type="submit" class="btn btn-default">Search</button>
    </div>
  </div>
}

내 컨트롤러에는 다음과 같은 시그니처 방법이 있습니다.

[HttpPost]
public async Task<ActionResult> Result(string k)

이것은 MVC 샘플 프로젝트에서 가져옵니다

@if (ViewBag.ShowRemoveButton)
      {
         using (Html.BeginForm("RemoveLogin", "Manage"))
           {
              @Html.AntiForgeryToken()
                  <div>
                     @Html.Hidden("company_name", account)
                     @Html.Hidden("returnUrl", Model.returnUrl)
                     <input type="submit" class="btn btn-default" value="Remove" title="Remove your email address from @account" />
                  </div>
            }
        }
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top