Unobtrusive ajax in Razor Pages to call different handler

600 Views Asked by At

I have a partial view with two buttons. The buttons will call different handler and update the partial view with the result. I managed to set the handler in the form and call one of the handler.

<form method="post" data-ajax="true" data-ajax-method="post" data-ajax-mode="replace" data- ajax-update="#dvx-p1704">
   <div id="dvx-p001">
       <partial for="P001" name="Partials/_Partial01" />
   </div>
</form>

But how to I call different handler with the two buttons? I want to send the form in the call?

<div class="row">
  <div class="col-sm-6">
    <button type="submit" data-ajax="true" data-ajax-method="post" data-ajax-url="Groups/Update">Clean</button>
  </div>
  <div class="col-sm-6">
    <button type="submit" data-ajax="true" data-ajax-method="post" data-ajax-url="Groups/Clean">Update</button>
  </div>
</div>
1

There are 1 best solutions below

2
Xinran Shen On

You can use this url:

<div class="row">
<form method="post" data-ajax-method="post" data-ajax="true" data-ajax-url="Privacy?handler=Index">
    <input asp-for="@Model.Test" />
    <button type="submit">Index</button>
</form> 
<form method="post" data-ajax-method="post" data-ajax="true" data-ajax-url="Privacy?handler=Privacy">
    <input asp-for="@Model.Test" />
    <button type="submit">Index</button>
</form>
</div>

enter image description here

==========================================

In ajax, We can set different onclick() methods for different buttons to submit the same form to different handlers, But unfortunately, I didn't find any similar method in Unobtrusive AJAX. So if you just want to post same form to two different handlers , you can use asp-page-handler attribute.

<form method="post">        
    <input asp-for="@Model.Test" />
    <button asp-page-handler="handlerA">handlerA</button>        
    <button asp-page-handler="handlerB">handlerB</button>
</form>

enter image description here