3

削除にリンクを使用すべきではないことを読みました。代わりにこれをボタンに変更するにはどうすればよいですか?

 @Html.ActionLink("Delete", "Delete", new { id = Model.ListOfRecipients[i].RecipientId,applicationId=Model.ApplicationId },  new { @class = "button delete_recipient" })

edit @using (Html.BeginForm()) {

        <div id='added_recipients'>

          <table class='header'>
            <tr>
                @if (Model.ListOfRecipients != null)
                {
                <td class='recipient-title'>
                    @if (Model.ListOfRecipients.Count == 1) {@Model.ListOfRecipients.Count.ToString() <span>Recipient</span>}
                    @if (Model.ListOfRecipients.Count > 1)  {@Model.ListOfRecipients.Count.ToString() <span>Recipients</span>}

                </td>
                <td class='express'>
                  Express
                </td>
                <td class='quantity'>
                  Quantity
                </td>
                <td class='action'>
                </td>
                }
            </tr>
          </table>


            @if (Model.ListOfRecipients != null)
            {
                for (int i = 0; i < Model.ListOfRecipients.Count; i++)
                { 

                <div class='recipient-wrapper'>
                    <div class='decision_block'>
                        <table class='recipient'>
                            <tr>
                                <td class='recipient-title'>
                                    @Html.HiddenFor(model=>model.ListOfRecipients[i].RecipientId)
                                    <h3>
                                    @if(Model.ListOfRecipients[i].RecipientTypeId==1)
                                    {
                                        @Html.DisplayTextFor(model => model.ListOfRecipients[i].MedicalLicensingAuthorityName) 
                                        @Html.HiddenFor(model => model.ListOfRecipients[i].MedicalLicensingAuthorityName)                           
                                     }
                                    else
                                    {
                                        @Html.DisplayTextFor(model => model.ListOfRecipients[i].RecipientName) 
                                        @Html.HiddenFor(model => model.ListOfRecipients[i].RecipientName)
                                    }
                                    </h3>
                                    <div class='delivery-type'>
                                        Delivery Type: @Html.DisplayTextFor(model => model.ListOfRecipients[i].DeliveryType)
                                                       @Html.HiddenFor(model => model.ListOfRecipients[i].DeliveryType)
                                    </div>
                                </td>
                                <td class='na express'>
                                    @Html.CheckBoxFor(model => model.ListOfRecipients[i].ExpressIndicator)
                                    @Html.HiddenFor(model => model.ListOfRecipients[i].ExpressIndicator)
                                </td>
                                <td class='quantity'>
                                    <h3>
                                      Qty @Html.DisplayTextFor(model => model.ListOfRecipients[i].Quantity)
                                          @Html.HiddenFor(model => model.ListOfRecipients[i].Quantity)
                                    </h3>
                                </td>
                                <td class='action'>
                                    <input class='button edit_recipient' type='button' value='Edit' />

                                   @* <input class='button delete_recipient' type='button' value='Delete' />*@


                                @Html.ActionLink("Delete", 
                                                 "Delete", 
                                                  new { id = Model.ListOfRecipients[i].RecipientId,applicationId=Model.ApplicationId },  
                                                  new { @class = "button delete_recipient",onlick = "$.post(this.href); return false;" }) 


                                </td>
                            </tr>
                        </table>
                        <div class='recipient_editable'>
                            <br />
                            <hr />


                            <br />
                            <input class='button update_recipient' type='button' value='Update' />
                            <a class='button cancel_update' href='#'>Cancel</a>
                        </div>
                    </div>
                </div>

                }
            }


        </div>

        <input class='button' type='submit' value='Continue' />

        }
4

2 に答える 2

3

削除にリンクを使用すべきではないことを読みました。

そのとおりです。

代わりにこれをボタンに変更するにはどうすればよいですか?

コントローラーアクションPOSTに送信ボタンがあるフォームを使用します。Delete

@using (Html.BeginForm("Delete", null, new { id = Model.ListOfRecipients[i].RecipientId, applicationId = Model.ApplicationId }, FormMethod.Post))
{
   <button type="submit" class="button delete_recipient">Delete</button>
}

HTTP 動詞をシミュレートするDELETEには (標準の HTML フォームでは DELETE がサポートされていないため):

@using (Html.BeginForm("Delete", null, new { id = Model.ListOfRecipients[i].RecipientId, applicationId = Model.ApplicationId }, FormMethod.Post))
{
   @Html.HttpMethodOverride(HttpVerbs.Delete)
   <button type="submit" class="button delete_recipient">Delete</button>
}

次に、コントローラーの削除アクションを HttpDelete 属性で装飾します。

[HttpDelete]
public ActionResult Delete(int id, int applicationId)
{
    ...
}

アップデート：

実際のコードを投稿したので、for ループの外側に既に HTML フォームがあるようです。フォームをネストできないため、このソリューションは機能しません。したがって、1 つの可能性は AJAX を使用することです。

@Ajax.ActionLink(
    "Delete", 
    "Delete", 
    new { 
         id = Model.ListOfRecipients[i].RecipientId,
         applicationId = Model.ApplicationId 
    },
    new AjaxOptions {
        HttpMethod = "DELETE",
        OnSuccess = "function() { alert('The item has been deleted'); }"
    },
    new { 
         @class = "button delete_recipient",
    }
)

AJAX を使用したくない場合はHtml.BeginForm、フォームのネストを避けるために、これらのフォームをメインの外で生成する必要があります。

于 2012-09-17T19:52:58.383 に答える
0

httppostアンカータグを使用して、動詞を使用して削除することもできます。$.post(this.href); return false;アンカータグに属性を追加できます。詳細はこちら

    $(".delete_recipient").click(function() {
     $.post(this.href); 
     return false;
    });

@Html.ActionLink("Delete", "Delete", new { id = Model.ListOfRecipients[i].RecipientId,applicationId=Model.ApplicationId },  new { @class = "button delete_recipient" })
于 2012-09-17T20:01:37.730 に答える