C# Razor Submitted form on Success Refresh Errors - c#

I have a contact form that is in C# - Razor and built into the Umbraco Scaffold CMS.
Everything almost works .. except after a successful submission - if I refresh the page the web declares I must resubmit the information - clicking ok then causes the page to attempt a refresh but instead of looking for the page as a page it looks for the action method that was called.
How do I get it to refresh the proper location
<button class="btn btn-primary"
id="btnSubmit"
type="submit"
value="submit"
data-action='CreateMessage'
style="height: 75px;">
<h2>Submit</h2>
</button>
function onSubmit(token) {
document.getElementById("form-outer").submit();
}
EDIT
if (ViewBag.Contact != null)
{
[mxmissile THIS SHOULD BE A REDIRECT? instead of simple content ..]
var viewModel = (MyWeb.ContactModel)ViewBag.Contact;
<div id="form-outer" class="contact-confirmation">
<div>
<h2>
<p>Thank you for your message.</p>
</h2>
<p>We will be in touch soon.</p>
</div>
</div>
}
else
{
Html.RenderPartial("/Views/Partials/ContactView.cshtml");
}

Related

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
}

Submitting form to two different actions in two different controllers asp.net mvc

I have googled a lot about this question but couldn't find any help regarding my scenario. So, here is the question
I have a form containing a single drop down, named Sections, user can select a Section and then user have two choices.
1-Add File to this Section By Going To File Uploading Form
2-Add Further Subsection By Going to Add Section FormThis is image of my form
#using (Html.BeginForm("SectionForm","Sections"))
{
<div class="form-group">
#Html.DisplayFor(s => s.SectionName)
#Html.DropDownListFor(s => s.SelectedSection, new SelectList(Model.Sections,"SectionId","SectionName"),"Select a Section",new {#class = "form-control",autofocus="autofocus"} )
</div>
<p>
If you don't see your desired section here, Click <strong>Add Section</strong>.
</p>
<button type="submit" class="btn btn-primary">Add Further Subsection</button>
<br />
Add File
}
<br>
SectionForm and FileForm are my actions and Sections and LawFiles are controllers.
anchor tag at the end won't work until I don't submit the form
You could use javascript to modify the action of your form. You’ll add a click event on the submit button and overwrite the default submit action.
<html>
<body>
<form id="myform">
<input type="submit" id="submit1"/>
<input type="submit" id="submit2"/>
</form>
</body>
<script>
$("#submit1").click(function() {
document.myform.action = “http://localhost/controller/action1”;
});
$("#submit2").click(function() {
document.myform.action = “http://localhost/controller/action2”;
});
</script>
</html>

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>

razor/mvc code running on page load instead of onclick?

I have a loop that creates some buttons and (is meant to) make a function call when that button is pressed.
foreach (Answer a in qanswers)
{
//Guid answerid = new Guid();
<form method="post" action="">
<div class="float-left">
<input type="submit" value="#a.Answer1" class="submit" style="width:600px" onmousedown="#{saveTest(a, module, user, quest, healthsafety);}">
<br /><br />
</div>
</form>
}
However, it calls the "saveTest" procedure at page load for each button produced, rather than onmousedown/onmouseclick.
Is it possible to change this?
I assume from this that saveTest is a server side function that you are trying to call.
onmousedown is a client side event and can only directly run client side script.
If you wish to call a server side function then you will need to specify an action in the form that the page will post pack to.
Have a look here for more on this
http://msdn.microsoft.com/en-us/library/system.web.mvc.html.formextensions.beginform(v=vs.108).aspx
A quickly modified version of your code would be:
foreach (Answer a in qanswers)
{
using (Html.BeginForm("saveTest", "ControllerName"))
{
<div class="float-left">
<input type="submit" value="#a.Answer1" class="submit" style="width:600px")>
<br /><br />
</div>
}
}
The button will submit to the controller and action that has specified in the form. So please check carefully which controller and action you have specified.
using (Html.BeginForm("saveTest", "Controller"))
{
}
This is the way you have to specify your form.
Regards,
Pavan.G

Does ASP.NET MVC swallow submit values?

I have a single form in ASP.NET MVC (v1) that has 2 input buttons. Each submit button has to be contained within this single form and I need to know which one the user pressed.
I know about the trick to check the FormCollection values which will be returned based on the button pressed. For example, if I have and and the user clicks Button2, I should be able to say Request.Form["Button2"] != null and that will evaluate to true in which case I know that the user clicked that button.
However, this is not working for me. The values of all my buttons is null as non of them are contained within the Request.Form values. Is there a bug in ASP.NET MVC which swallows these values?
Here is my form code:
<% using (Html.BeginForm()) {%>
<% Html.RenderPartial( "EditAreaControl", Model ); %>
<div class="form-layout-command-container">
<div class="form-layout-command-area-alpha"><button type="submit" name="submit1" value="Save">Save</button></div>
<div class="form-layout-command-area-alpha"><button type="submit" name="submit2" value="SaveAndCopy">Save and Create Copy</button></div>
<div class="form-layout-command-area-beta"><%= Html.ActionLink("Cancel", "list") %></div>
</div>
<% } %>
Here is my controller code:
[AcceptVerbs( HttpVerbs.Post )]
public ActionResult Add(FormCollection values )
{
if (values["submit1"] != null)
// always false
if (values["submit2"] != null)
// always false as well
}
From w3schools:
Important: If you use the button element in an HTML form, different browsers will submit different values. Internet Explorer will submit the text between the and tags, while other browsers will submit the content of the value attribute. Use the input element to create buttons in an HTML form.
It seems that this is not standardized. You should stick to
<input type="submit" name="submitButton" value="Save" />
<input type="submit" name="submitButton" value="Cancel" />
I would use inputs of type submit instead of buttons. Non-inputs may not passed back in a form post or at least can be passed back inconsistently. Note that they can have the same name with different values so that you can use the same parameter for any button that submits the form.
<input type="submit" name="submitButton" value="Save" />
<input type="submit" name="submitButton" value="SaveAndCopy" />
public ActionResult Save( string submitButton, ... )
{
if (submitButton == "Save")
{
...
}
else if (submitButton == "SaveAndCopy")
{
...
}
....
}
Using Firebug, I found that the submit buttons were not being sent in the response and because of that, there isn't much I can do on the MVC side. I decided to use a client side hack to populate a hidden input field on the client side which would be passed to the controller values.
I changed the input buttons to be:
<input type="submit" value="Save" onclick="actions.copyValues($(this), $('#submitAction'));" />
<input type="submit" value="Save and Copy" onclick="actions.copyValues($(this), $('#submitAction'));" />
<input type="hidden" id="submitAction" name="submitAction" />
The jquery script simply copies the values:
Actions.prototype.copyValues = function(from, to) {
$(to).val($(from).val());
};
The controller action then looks for the hidden input values:
var request = HttpContext.Request;
return request.Form["submitAction"];
This solves the issue from above but I realize it is not that clean.
Put them in two different forms and you will know which one submitted based on which action was called on the controller.

Categories

Resources