Develop Reference

Clicking 2 submit buttons in the same page

I have a project in .Net Core with Razor Pages and I have the form bellow that contains some input fields and 2 submit buttons.
<form class="form-style" method="post" id="createForm">
<div class="form-group button-position col-md4">
<input type="submit" id="placeRequest" name="placeRequest" value="Place Request" class="btn btn-primary" />
</div>
<div class="form-group button-position col-md4">
<input type="submit" value="GetHour" asp-page-handler="Hour" class="btn btn-primary btn-style" formnovalidate />
</div>
</form>
I need to be able to click the first submit button (GetHour) and then click the second one (Placer Request)
In my Razor Page model I have
public async Task<IActionResult> OnPost()
{
//code that will be executed when the Place Request button is clicked
}
public async Task OnPostGetHour()
{
////code that will be executed when the Get Hour button is clicked
}
The problem is that I am not allowed to make the 2 submits. If I only do one of them, it works but the second one does nothing
Is there any way I could make both of the submits?

This is because once you click the first submit button, The page does a redirect and loads again.
This is the nature of form submission. If you want to click both the buttons. Change the button type from "submit" to "button".
Then create 2 click handlers and handle the form submitting using Ajax
<form class="form-style" method="post" id="createForm">
<div class="form-group button-position col-md4">
<input onclick="onBtn1Click()" type="button" id="placeRequest" name="placeRequest" value="Place Request" class="btn btn-primary" />
</div>
<div class="form-group button-position col-md4">
<input onclick="onBtn2Click()" type="button" value="GetHour" asp-page-handler="Hour" class="btn btn-primary btn-style" formnovalidate />
</div>
</form>
Then write 2 JavaScript functions
function onBtn1Click()
{
//Submit code via Ajax here
}
function onBtn2Click()
{
//Submit code via Ajax here
}

How do I prevent validation when clicking a button in ASP.NET Core?

I have 1 form and 2 buttons, one within a form, one out side of a form on a page:
<form method="post">
<button asp-page-handler="AddRecord" id="addRecordBtn" class="btn btn-sm
btn-secondary" type="submit">Add Record</button>
</form>
<button asp-page-handler="EmailData" id="emailData" class="btn btn-sm btn-secondary data-btn">Email Data</button>
I've also created some custom validation. When I click the EmailData button, the custom validation fires and returns null as there's no form data. Both are POST.
How do I prevent this from happening? I can't seem to find an up to date answer for .NET Core.
Thanks

Add onsubmit:
<form method="post" onsubmit="return false">
<button asp-page-handler="AddRecord" id="addRecordBtn" class="btn btn-sm
btn-secondary" type="submit">Add Record</button>
</form>
return false will prevent form action

Make a property required/not required depending, when you have two submit buttons

I have two submit buttons on my form, one to save, one to resolve:
<input type="submit" name="submitButton" value="Save" class="btn btn-default" />
<input type="submit" name="submitButton" value="Resolve" class="btn btn-default" />
I am dealing with these in the Controller like so:
//POST: Exceptions
[HttpPost]
public ActionResult Edit(string submitButton, PersonViewModel personViewModel)
{
switch (submitButton)
{
case "Save":
return (Save(person));
case "Resolve":
return (Resolve(person));
default:
return (View());
}
}
I know that I can make certain properties required by using data annotations on my view model, however I only want these particular properties to be required when the user attempts to Resolve, Save should have no such restrictions.
What is the best way of achieving this?
update
http://weblogs.asp.net/imranbaloch/overriding-unobtrusive-client-side-validation-settings-in-asp-net-mvc-3
The above blog seems to suggest that you can assign an input you wish to be excluded from validating prior to submit by giving it a class and adding some JS like so:
<input id="btnSubmitSave" type="submit" name="submitButton" value="Save" class="btn btn-default ignore" />
<input id="btnSubmitResolve" type="submit" name="submitButton" value="Resolve" class="btn btn-default" />
$(function () {
var settngs = $.data($('form')[0], 'validator').settings;
settngs.ignore = ".ignore";
});
Unfortunately this is still attempting to validate when I click the Save button.

jQuery Validation plugin: disable validation for specified submit buttons
Sigh, it was as simple as giving my Save button the class of cancel wasted a few hours there.

Try using RequiredIf from:
https://foolproof.codeplex.com/
Exactly what you need

ASP.NET MVC 5 bootstrap button move to another view page

I want to move to another page from current
My View
<p class="btn btn-primary btn-lg">#Html.ActionLink("More information", "GoToApps") More information! »</p>
However my button have link from method ActionLink and string "More information". How is method without linkText ?
My method in controller:
public ActionResult GoToApps()
{
return RedirectToAction("IndexApps", "Apps");
}
This way is run, but I want better display.
Cheers,

If you need only Link you should use #Url.Action("GoToApps")

<form action="#Html.ActionLink("More information", "GoToApps")">
<button type="button" class="btn btn-primary btn-lg"> More information! »</button>
</form>

how to create two buttons within form and have only one submit form

I am trying to create a "next" button and a "back" button in my form. I want the "next" button to validate and submit the form. And I want the "back" button to simply go back to the "cart" page. But the "back" button keeps validating and trying to submit the form.
Here is my code:
<div class="buttons">
<button class = "button" id = "back">Back</button>
<input type="submit" value="Next" class="button" />
</div>
The reason I need the back link to be a button is so that it will look the same as the "next" button. Any ideas how I can get this working correctly?

A <button> element always submits the form. The same goes for a <input type="submit" /> element.
But a <input type="button" /> will not submit the form. That's what you want.
<div class="buttons">
<input type="button" class="button" id="back" onclick="window.location = '#Url.Action("Index", "Cart")';">Back</a>
<input type="submit" value="Next" class="button" />
</div>
Edit I'm not sure if you can put that inside an <a> element though. I reworked my example to use click events rather than a link. If it is valid to put inside a <a> element (can anyone confirm?), you can do it like that as well.