two submit buttons for different form within the same view and controller - asp.net-mvc

I have a view screen that has two different form on it, that will be activated differently. if the first button is clicked, the first form comes up and the user can fill and submit after which he proceed to click the other button to activate the other form which will then be submitted to a different table. I tried giving it different each submit button different name but my controller isn't recognizing the name. any help will be appreciated.
this is my view presently
<div class="container">
<form class="form-horizontal" role="form" method="post" id="head">
<div class="form-group">
<label for="warehouse" class="col-sm-2 control-label">Transaction type</label>
<div class="col-sm-7">
#Html.TextBoxFor(m => m.vwint0, ViewBag.action_flag == "Create" ? (object)new { #class = "form-control", style = "width : 120px", #maxlength = 10 } : new { #disabled = "disabled", style = "width : 120px" })
#Html.ValidationMessageFor(m => m.vwint0)
</div>
</div>
<div class="form-group">
<label for="code" class="col-sm-2 control-label">Customer code</label>
<div class="col-sm-7">
#Html.DropDownListFor(m => m.vwstring1, ViewBag.cus as SelectList, "Select", new { #class = "form-control" })
</div>
</div>
<div class="form-group">
<div class="col-sm-9 col-sm-offset-3">
<button type="submit" class="btn btn-primary" name="update" value="headsub">Submit</button>
</div>
</div>
</form>
<form class="form-horizontal" role="form" method="post" id="details">
<div class="form-group">
<label for="firstName" class="col-sm-2 control-label">Sale sequence number </label>
<div class="col-sm-9">
#Html.TextBoxFor(m => m.vwint0, new { #class = "form-control", style = "width : 80px", maxlength = 10 })
</div>
</div>
<div class="form-group">
<label for="email" class="col-sm-2 control-label">Quote sequence</label>
<div class="col-sm-9">
#Html.TextBoxFor(m => m.vwstring9, new { #class = "form-control", style = "width : 80px", maxlength = 10 })
</div>
</div>
<div class="form-group">
<label for="password" class="col-sm-2 control-label">Item code</label>
<div class="col-sm-9">
#Html.DropDownListFor(m => m.vwstring10, ViewBag.item as SelectList, "Select", new { #class = "form-control" })
</div>
</div>
<div class="form-group">
<div class="col-sm-9 col-sm-offset-3">
<button type="submit" class="btn btn-primary" name="update" value="detailsub">Submit</button>
</div>
</div>
</form>
</div>
In my controller, I tried this but my controller isn't even recognizing the button name.
if (update == "headsub")
{
AR_002_SALES gdoc = new AR_002_SALES();
gdoc.sale_sequence_number = glay.vwint0;
gdoc.customer_code = glay.vwstring1;
gdoc.currency_code = glay.vwstring2;
}
else
{
AR_002_QUOTE = new AR_002_QUOTE();
AR_002_QUOTE.sale_sequence_number = glay.vwint0;
AR_002_QUOTE.quote_sequence = glay.vwstring9;
AR_002_QUOTE.item_code = string.IsNullOrWhiteSpace(glay.vwstring10) ? "" : glay.vwstring10;
AR_002_QUOTE.quote_qty = glay.vwdclarray0[0];
AR_002_QUOTE.price = glay.vwdclarray0[1];
}

Instead of using <form class="form-horizontal" role="form" method="post" id="head">
use #using (Html.BeginForm("ActionMethod", "Controller", FormMethod.Post, new { #class = "form-horizontal" ,#id="head" }))
to submit a form and action method will process that form and does stuff.Similarly you can do for another form also.
In your .cshtml it looks like it will not hit any action method of that controller.

Related

Radio-Buttons overlapping each other

I am building a form using bootstrap 4.3 with few Radio-Buttons, but the issue is, it overlaps each other as shown below.
I tried it in jsfiddle and the result is same. Here is my working in jsfiddle: https://jsfiddle.net/hifni/ky3xzej0/7/
My Razor page looks like this:
<div class="alert alert-info">
<p>The request will enable your Credit Balance to be in your account for future trading/settlement.</p>
<footer class="blockquote-footer">Subject to T&C</footer>
</div>
<style>
.form-control {
height: auto;
}
</style>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form">
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.HiddenFor(model => model.AccountId)
<input type="hidden" id="tempStore" />
#Html.HiddenFor(model => model.SendSMS)
#Html.HiddenFor(model => model.RequiresApproval)
</div>
<div class="form-group">
<label>Pick a Settlement Mode</label>
<div class="form-control">
<div class="form-check">
#Html.RadioButtonFor(model => model.IsSettlementOnHold, "No", new { #class = "form-check-input", #id = "rbIsSettlementOnHold_No" })
#Html.Label("rbIsSettlementOnHold_No", "Standard ", new { #class = "form-check-label" })
#Html.RadioButtonFor(model => model.IsSettlementOnHold, "Yes", new { #class = "form-check-input", #id = "rbIsSettlementOnHold_Yes" })
#Html.Label("rbIsSettlementOnHold_Yes", "On Request ", new { #class = "form-check-label" })
#Html.ValidationMessageFor(model => model.IsSettlementOnHold, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
#Html.TextAreaFor(model => model.AdditionalNote, 3, 50, new { #class = "form-control", #placeholder = "Any Aditional Note" })
#Html.ValidationMessageFor(model => model.AdditionalNote, "", new { #class = "text-danger" })
</div>
<div class="form-group">
#*<input type="submit" value="Submit" class="btn btn-default" id="btnSelfServiceRequestSubmit"/>*#
<button type="submit"
class="btn btn-dark"
id="btnSelfServiceRequestSubmit"
#*data-toggle="modal"
data-target="#modalEntityDetail"
data-url="#Url.Action("_CodePrompt", "ExternalSelfServiceRequest")"*#>
Submit
</button>
<button type="reset"
class="btn btn-warning">
Reset
</button>
</div>
#if (Model.RequiresApproval.Equals("Yes"))
{
<div class="alert alert-info" role="alert">
For security verification purpose you will be required to access your JKSB Registered Mobile, there will
be a verification code sent to it.
</div>
}
</div>
}
Appreciate any help.
You can separate your "form-check" div like this;
<div class="form-control">
<div class="form-check form-check-inline">
<input checked="checked" class="form-check-input" id="rbIsSettlementOnHold_No" name="IsSettlementOnHold" type="radio" value="No">
<label for="rbIsSettlementOnHold_No" class="form-check-label"> Standard</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" id="rbIsSettlementOnHold_Yes" name="IsSettlementOnHold" type="radio" value="Yes">
<label for="rbIsSettlementOnHold_Yes" class="form-check-label"> On Request </label>
</div>
</div>
And using "form-check-inline" class will be provide you a horizontal alignment.
I hope this helps.

How to convert a static html into razor view in asp.net mvc?

I have the following simple bootstrap form:
#{
ViewBag.Title = "Register";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h3>Register</h3>
<br>
<form action="/User/Register">
<div class="form-group row">
<label class="col-sm-2 col-md-1 col-form-label">Name</label>
<div class="col-sm-10 col-md-2">
<input name="name" type="text" class="form-control" placeholder="Enter Name">
</div>
</div>
<div class="form-group row">
<label for="staticEmail" class="col-sm-2 col-md-1 col-form-label">Email</label>
<div class="col-sm-10 col-md-2">
<input name="email" type="email" class="form-control" placeholder="Enter email">
</div>
</div>
<div class="form-group row">
<label for="staticEmail" class="col-sm-2 col-md-1 col-form-label">MAC</label>
<div class="col-sm-10 col-md-2 positioned_relative">
<span class="add-new-icon glyphicon glyphicon-plus-sign" id="add_mac"> </span>
<input type="text" class="form-control" id="mac_addr" placeholder="Enter MAC">
</div>
</div>
<div class="form-group row new_mac_wrapper">
<div class="col-md-offset-3">
<div class="new_mac_container">
</div>
</div>
</div>
<button type="submit" class="btn btn-primary col-sm-offset-1">Register</button>
</form>
I want to convert this into razor view as follows:
#model RouterManagement.Models.UserViewModel
#{
ViewBag.Title = "Register";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h3 class="pull-left">Register</h3> <br />
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group row">
#Html.LabelFor(model => model.Name, htmlAttributes: new { #class = "col-sm-2 col-md-1 col-form-label" })
<div class="col-sm-10 col-md-2">
#Html.EditorFor(model => model.Name, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Name, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Email, htmlAttributes: new { #class = "col-sm-2 col-md-1 col-form-label" })
<div class="col-sm-10 col-md-2">
#Html.EditorFor(model => model.Email, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Email, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Password, htmlAttributes: new { #class = "col-sm-2 col-md-1 col-form-label" })
<div class="col-sm-10 col-md-2">
#Html.EditorFor(model => model.Password, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Password, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Mac, htmlAttributes: new { #class = "col-sm-2 col-md-1 col-form-label" })
<div class="col-sm-10 col-md-2">
#Html.EditorFor(model => model.Mac, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Mac, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-sm-10 col-md-2">
<input type="submit" value="Create" class="btn btn-primary col-sm-offset-1" />
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
And for this conversion I get the following rendered HTML:
<form action="/Users/Register" method="post"><input name="__RequestVerificationToken" type="hidden" value="IZ_dvCy7QtB1VsoqQGh6x_Yzr1DME9V6LjKs1Fi8KL6KxOoKNNvFlH6mdw8yD4xIj-LKaUXFsNZndDTeHOa8xCVZPdu7b8qNXeL05IdIyiQ1"> <div class="form-group row">
<label class="col-sm-2 col-md-1 col-form-label" for="Name">Name</label>
<div class="col-sm-10 col-md-2">
<input class="form-control text-box single-line" id="Name" name="Name" type="text" value="">
<span class="field-validation-valid text-danger" data-valmsg-for="Name" data-valmsg-replace="true"></span>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 col-md-1 col-form-label" for="Email">Email</label>
<div class="col-sm-10 col-md-2">
<input class="form-control text-box single-line" id="Email" name="Email" type="text" value="">
<span class="field-validation-valid text-danger" data-valmsg-for="Email" data-valmsg-replace="true"></span>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 col-md-1 col-form-label" for="Password">Password</label>
<div class="col-sm-10 col-md-2">
<input class="form-control text-box single-line" id="Password" name="Password" type="text" value="">
<span class="field-validation-valid text-danger" data-valmsg-for="Password" data-valmsg-replace="true"></span>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 col-md-1 col-form-label" for="Mac">Mac</label>
<div class="col-sm-10 col-md-2">
<span class="field-validation-valid text-danger" data-valmsg-for="Mac" data-valmsg-replace="true"></span>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-sm-10 col-md-2">
<input type="submit" value="Create" class="btn btn-primary col-sm-offset-1">
</div>
</div>
</form>
This is approximately close to my static html. If you pay a deep attention you can see some additional html generated in case of razor view. I am okay with this additional html but why my design has been broken. I checked for css and js files. All are okay, but there is something related to razor conversion only. Any Idea?
N.S: I am switching from PHP to ASP. So I am apologizing if my question is not standard to ask here. Thanks for your time.
In brief - this two HTML's are not the same.
They differ in a few things:
- in original bootstrap form, you have inputs for Name, Email, and Mac - in generated you have Name, Email, Password, and Mac.
Then in original, each input tag is wrapped in div with class = "form-group row" in generated only first input has these, and the rest have only "form-group". Then in original inside MAC input group, you have div with class="col-sm-10 col-md-2 positioned_relative" and in original, there is no such thing.
Also in original, you have div with class="form-group row new_mac_wrapper" and in the generated code there is none.
I will not go further into details but as you can see you have two different code - hard to tell what is breaking things without a chance to see the whole project.
However, the suggestion is to start little by little - start with just one field (Name) in original and on generated code.
See the differences and only when there is none keep up adding and comparing one field at the time.

How to redirect button that is inside Html.BeginForm

I have this View which displays 3 text boxes and a drop down list for displaying nationalities. The form itself works just fine, posts back to the controller and nothing is wrong. However what i want is, say a nationality is not present in the drop down and a user clicks a button which would redirect to a different page where they can add a nationality. Here is what i have so far:
#model WebApp.Models.ViewModels.AddPersonViewModel
<div class="container card">
#using (Html.BeginForm("AddPersonPost", "Persons", FormMethod.Post))
{
<form>
<div class="form-row">
<div class="col">
#Html.TextBoxFor(m => m.PersonModel.Name, new { #class = "form-control", #placeholder = "Name" })
</div>
<div class="col">
#Html.TextBoxFor(m => m.PersonModel.Relationship, new { #class = "form-control", #placeholder = "Relationship" })
</div>
<div class="col">
#Html.TextBoxFor(m => m.PersonModel.Comment, new { #class = "form-control", #placeholder = "Comment" })
</div>
<div class="col dropdown show">
#Html.DropDownListFor(m => m.PersonModel.Nationality, Model.NationalityList)
<input type="submit" class="btn-sm btn-primary mt-1" value="Add Nationality" onclick="window.location='#Url.Action("GetAll", "Persons")'">
</div>
</div>
<div class="m-sm-2">
<input type="submit" class="btn-sm btn-primary" value="Add Person">
</div>
</form>
}
</div>
I have tried the redirect option but when i click the button to add nationality it keeps going to the Action in the BeginForm, not to the intended Action in the button. So i was wondering 1. is this good practice to do what i am attempting to do? 2. How to go about it? Any help is appreciated.

MVC Form Validation Thrown to All Forms in Page

so i have this view with multiple same form like this
<div class="col-md-5">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">Special Leave on Purposes Rules</h3>
</div>
<div class="panel-body">
#using (Html.BeginForm("Rule", "Admin", FormMethod.Post, new { #class = "form-horizontal", placeholder = ViewBag.maternity }))
{
<div class="form-group">
<label for="inputEmail3" class="col-sm-4 control-label">Set Max For</label>
<div class="col-sm-8">
#Html.DropDownListFor(
model => model.ID, (SelectList)ViewBag.special,
"--Select One--",
new
{ //anonymous type
#class = "form-control input-sm",
id= "inputEmail3"
})
</div>
#Html.ValidationMessageFor(m => m.ID, null, new { #class = "text-danger" })
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-4 control-label">Set Max</label>
<div class="col-sm-8">
#Html.TextBoxFor(model => model.Max, new { #Class = "form-control" })
</div>
#Html.ValidationMessageFor(m => m.Max, null, new { #class = "text-danger" })
</div>
<div class="form-group">
<button type="submit" class="btn btn-success">Save</button>
</div>
}
</div>
</div>
</div>
<div class="col-md-5">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">Maternity Leave Rules</h3>
</div>
<div class="panel-body">
#using (Html.BeginForm("Rule", "Admin", FormMethod.Post, new { #class = "form-horizontal" }))
{
<div class="form-group">
<label for="inputEmail3" class="col-sm-4 control-label">Maximum Leave</label>
<div class="col-sm-8">
<div class="input-group">
#Html.TextBoxFor(model => model.Max, new { #Class = "form-control", placeholder = ViewBag.maternity })
<span class="input-group-addon">In Row</span>
#Html.HiddenFor(model => model.ID, new { Value = 2 })
</div>
</div>
#Html.ValidationMessageFor(m => m.Max, null, new { #class = "text-danger" })
</div>
<div class="form-group">
<button type="submit" name="submit" value="Annual" class="btn btn-success">Save</button>
</div>
}
</div>
</div>
</div>
The problem here is that when the form submitted with wrong value, the modelstate validated and return error message for ALL of the form like in this picture.
I want that the error message is only shown for the form i submit, is that possible? Thanks for your help guys

How to toggle Partial View on Single Submit Button in MVC?

Here is my Code
View
#using (Html.BeginForm("userrights", "Users", FormMethod.Post, new { #class = "form-horizontal", role = "form"}))
{
<div class="form-group">
<div class="col-md-7" style="padding-right:10px">
#Html.TextBoxFor(m => m.companyname, new { #class = "form-control", #placeholder = "Serach By Sponser Name" })
</div>
<div class="clearfix"></div>
</div>
<div class="form-group">
<div class="col-sm-2">
<button type="submit" id="btn_search" value="Search" name="btn_search" class="btn btn-default">Search</button>
</div>
<div class="clearfix"></div>
</div>
</div>
#Html.Partial("_userRightPartial", Model._UserRightPartialView)
<div class="clear"></div>
}
Controller Method
public ActionResult userrights()
{
IEnumerable<MenuListModel> _MenuListModel = _ftwCommonMethods.GetMenuItems();
IEnumerable<SubMenuListModel> _SubMenuListModel = _ftwCommonMethods.GetSubMenuItems("1");
UserRightViewSearch _UserRightViewSearch = new UserRightViewSearch();
UserRightPartialView _UserRightPartialView = new UserRightPartialView();
_UserRightPartialView._SubMenuListModel = _SubMenuListModel;
_UserRightViewSearch._UserRightPartialView = _UserRightPartialView;
_UserRightViewSearch._menu = _MenuListModel;
_UserRightViewSearch.selectedMenu = 0;
return View(_UserRightViewSearch);
}
I want when page first time loads, _userRightPartial partial view should be hidden. After Submitting By Search Button it should appear.
I know it can be possible by Hide and Show DIV. But i want is there other way to do it with MVC Code?

Resources