View
#using (Html.BeginForm())
{
...form elements
#Html.Action("PartialView")
}
PartialView
if (something) {
<input type="submit" value="Submit" />
} else {
#using (Html.BeginForm())
{
<input type="submit" value="Submit" />
}
Can anybody suggest a way around the above problem?
If the PartialView if statement returns false, I end up with nested forms. I can move the form close bracket within the partial view to avoid nesting the forms and the page renders correctly but this upsets visual studio because it expects to see the close bracket within the view. Does that matter?
Edit:
Based on Chris's comments, is the below modification a better approach? i.e. One form with two submit buttons that call different code within the same action method?
PartialView
if (something) {
<input type="submit" name="btn" value="Submit1" />
} else {
<input type="submit" name="btn" value="Submit2" />
}
Controller
[HttpPost]
public ActionResult Index()
{
if (btn == "Submit1") {
...do a thing
} else {
...do another thing
};
}
<form> tag inside another <form> is not a valid HTML
Refer W3c Spec
Workaround available
http://blog.avirtualhome.com/how-to-create-nested-forms/
I run into the same problem, and came up with a helper that really solves it.
/**
* Ensure consequent calls to Html.BeginForm are ignored. This is particularly useful
* on reusable nested components where both a parent and a child begin a form.
* When nested, the child form shouldn't be printed.
*/
public static class SingleFormExtensions
{
public static IDisposable BeginSingleForm(this HtmlHelper html)
{
return new SingleForm(html);
}
public class SingleForm: IDisposable
{
// The form, if it was needed
private MvcForm _form;
public SingleForm(HtmlHelper html)
{
// single per http request
if (!HttpContext.Current.Items.Contains(typeof(SingleForm).FullName))
{
_form = html.BeginForm();
HttpContext.Current.Items[typeof(SingleForm).FullName] = true; // we need the key added, value is a dummy
}
}
public void Dispose()
{
// close the form if it was opened
if (_form != null)
{
_form.EndForm();
HttpContext.Current.Items.Remove(typeof(SingleForm).FullName);
}
}
}
}
To use it, include the namespace of the extension and do #Html.BeginSingleForm( everywhere you want. Not just inside nested views, but also in the parent.
Points of interest: There is a need to save whether or not the form has opened earlier. We can't have a static or static per thread variable ThreadStatic, as this might be used by many Asp.Net threads. The only single-threaded and per-http-request place to add a variable is the HttpContext.Current.Items dictionary.
There is no limitation to the number of submit buttons. The problem is the nested form elements. To avoid having multiple submit buttons you can either hide them using jquery, or extend this helper to automatically add a submit button at the end.
Related
I've been running into to issue and I've been searching for an answer but nothing helped.
I have a Model:
public class Filters
{
public bool Filter1 { get; set; }
public bool Filter2 { get; set; }
public bool Filter3 { get; set; }
etc...
}
I have a partial view with multiple checkboxes and tried multiple things:
<input id="Filter1" name="Filter1" type="checkbox" value="true">
<input type="hidden" value="false" name="Filter1" />
and
#Html.CheckBoxFor(model => model.Filter1)
Then I have a main model:
public class Dashboard
{
...
public Filters FiltersDashboard { get; set; }
}
And somewhere in the main view I insert the partial view like this:
#Html.EditorFor(model => model.FiltersDashboard, "Filters")
In a jquery, I execute an alert when the checkbox is clicked and shows the value of the checkbox. This value remains unchanged.
<script>
$("#Filter1").click(function () {
alert(" #Model.FiltersDashboard.Filter1 ")
});
</script>
EDIT: Also tried it in the .submit function but model value remains unchanged:
<script>
$("#searchform").submit(function (event) {
alert(" #Model.FiltersDashboard.Filter1 ")
event.preventDefault();
});
</script>
This tells me that something isn't correctly bound but I have no clue what I'm doing wrong.
Also, the reason I'm not using a checkboxlist is because I need to execute a different query for each filter so I need specific names and bindings for them.
#Model.FiltersDashboard.Filter1 is razor code and is executed on the server before its sent to the view, so it will only ever return the initial value of the property (if you inspect the source code, you will see the initial value has been hard coded in your script).
However, if your script is being executed, then it means that you are using the manual <input> tags in your 2nd code snippet, in which case your view is not binding to your model because the correct name attribute would be name="FiltersDashboard.Filter1" and the associated id attribute would be id="FiltersDashboard_Filter1".
Always use the strong typed #Html.CheckBoxFor() which will generate the correct html for 2-way model binding and client side validation.
Note also that it just needs to be #Html.EditorFor(model => model.FiltersDashboard) - the 2nd parameter is unnecessary.
Then the script should be
<script>
$('#FiltersDashboard_Filter1').click(function () {
var isChecked = $(this).is(':checked');
alert(isChecked);
});
</script>
I'm very new in MVC :(
I created a dynamic form by cloning a principal DIV element and its elements. The elements are combobox, textbox and a date textbox. When I create a new "clone", the DIV every member of itself has an incremental ID like tab_Container, tab_Container_1, text, text1, combo, combo1, etc... Now, I'm trying to get the values of each member in the Divs into the controller.
Googling I find something like this:
[HttpPost]
public ActionResult NewEntry(Model Entry)
{
Control myControl = new Control();
myControl.FindControl("Text0");
if (myControl != null)
{
/// apparently, find the control,here i wanna to get the value of each field !! ¿?
/// do i have to create a list[] ... exist something like Entry.Text0 = myControl.value?
}
else
{
Response.Write("Control not found");
}
return View(Entry);
}
Any suggestion? Is Control the best option? Do I have to do something else in Javascript code?
While it's normally better to have some sort of Model / ViewModel this situation is a bit different. MVC binds on the "Name" property of your form inputs.
So say for instance your razor syntax generates something like this:
<form>
<input type="text" name="input1" />
<input type="text" name="input2" />
<!-- etc etc etc -->
<input type="submit" value="submit" />
</form>
since this is dynamically generated and you don't have a model that would cleanly bind to this. You can use the FormCollection type as the parameter of your action. This gives you a collection of all items posted to the server that you could then loop through or peer into to get the properties that you want.
public ActionResult myAction(FormCollection collection)
{
var value = collection["input1"];
var value2 = collection["input2"];
return View();
}
I am learning MVC, following THIS tutorial. (link will take you directly to where i'm stuck). so far I have learnt, there's a controller for every view. Now i have to take input from user through web entry form as mentioned in tutorial. In my project, i have a controller named Default1 and i can run it as localhost:xyz/Default1/Index. it runs perfect.
Then i created a new Controller, named Default2 and bound it to some view to display some data, and it worked perfect as localhost:xyz/Default2/Displaycustomer. the customer information was static (hard coded). and controller is as:
public ViewResult DisplayCustomers()
{
Customer cobj = new Customer();
cobj.Code = "12";
cobj.Name = "Zeeshan";
cobj.Amount = 7000;
return View("DisplayCustomers",cobj);
}
Now i have to take input from User, regarding cutomer iformation, using html page as mentioned in tutorial. so i tried adding a new webform under view folder, and and modified my controller as:
[HttpPost]
public ViewResult DisplayCustomers()
{
Customer cobj = new Customer();
cobj.Code = Request.Form["Id"].ToString();
cobj.Name = Request.Form["Name"].ToString();
cobj.Amount = Convert.ToDouble(Request.Form["Amount"].ToString());
return View("DisplayCustomers",cobj);
}
My Question is: How can i make my project stared, so that it takes input first, and then displays it, using above controller? Did i add the webform at right location? What would be the link to run it? i tried localhost:xyz/Default2/entryform etc. but failed.
(in my entryform.aspx, i have mentioned form action="DisplayCustomer" )
It sounds like what you're missing is an action to just display the form. In otherwords, you just need an action to display a form. That form's POST action should reference your controller's DisplayCustomers action.
So in your controller code:
public class CustomerController : Controller
{
[HttpGet]
public ViewResult New()
{
return View("NewCustomer"); //Our view that contains the new customer form.
}
// Add your code for displaying customers below
}
And in your view, you have code like this
#using(Html.BeginForm("DisplayCustomers", "Customer")) {
<!-- Add your form controls here -->
}
Notice that I'm using the version of the BeginForm helper that specifies the action method and controller to call. This will write the form tag to post back to your DisplayCustomers action. Here is the equivalent HTML:
<form method="POST" action="/Customer/DisplayCustomers">
You would then access your form using the URL http://test.server/Customer/New.
This may not be the best example in the world...but this will at least get you rolling..
url would be:localhost:1234/Home/Customer
the controller
public ActionResult Customer()
{
return View();
}
[HttpPost]
public ActionResult Customer(FormCollection frm)
{
var name = frm["name"].ToString();
var address = frm["address"].ToString();
ViewBag.Name = name;
ViewBag.Address = address;
return View();
}
The view
<div>
#using (Html.BeginForm())
{
<input type="text" name="name" id="name" />
<input type="text" name="address" id="address"/>
<input type="submit" name="submit" value="submit" />
<input type="text" name="namedisplay" value='#ViewBag.Name'/>
<input type="text" name="addressdisplay" value='#ViewBag.Address'/>
}
</div>
I'm having trouble with ASP.NET MVC and passing data from View to Controller. I have a model like this:
public class InputModel {
public List<Process> axProc { get; set; }
public string ToJson() {
return new JavaScriptSerializer().Serialize(this);
}
}
public class Process {
public string name { get; set; }
public string value { get; set; }
}
I create this InputModel in my Controller and pass it to the View:
public ActionResult Input() {
if (Session["InputModel"] == null)
Session["InputModel"] = loadInputModel();
return View(Session["InputModel"]);
}
In my Input.cshtml file I then have some code to generate the input form:
#model PROJ.Models.InputModel
#using(Html.BeginForm()) {
foreach(PROJ.Models.Process p in Model.axProc){
<input type="text" />
#* #Html.TextBoxFor(?? => p.value) *#
}
<input type="submit" value="SEND" />
}
Now when I click on the submit button, I want to work with the data that was put into the textfields.
QUESTION 1: I have seen this #Html.TextBoxFor(), but I don't really get this "stuff => otherstuff". I concluded that the "otherstuff" should be the field where I want to have my data written to, in this case it would probably be "p.value". But what is the "stuff" thing in front of the arrow?
Back in the Controller I then have a function for the POST with some debug:
[HttpPost]
public ActionResult Input(InputModel m) {
DEBUG(m.ToJson());
DEBUG("COUNT: " + m.axProc.Count);
return View(m);
}
Here the Debug only shows something like:
{"axProc":[]}
COUNT: 0
So the returned Model I get is empty.
QUESTION 2: Am I doing something fundamentally wrong with this #using(Html.BeginForm())? Is this not the correct choice here? If so, how do I get my model filled with data back to the controller?
(I cannot use "#model List< Process >" here (because the example above is abbreviated, in the actual code there would be more stuff).)
I hope someone can fill me in with some of the details I'm overlooking.
Change your view to some thing like this to properly bind the list on form submission.
#using(Html.BeginForm()) {
for(int i=0;i<Model.axProc.Count;i++){
<span>
#Html.TextBoxFor(model => model.axProc[i].value)
</span>
}
<input type="submit" value="SEND" />
}
In #Html.TextBoxFor(stuff => otherstuff) stuff is your View's model, otherstuff is your model's public member.
Since in the View you want to render input elements for the model member of a collection type (List), you should first create a separate partial view for rendering a single item of that collection (Process). It would look something like this (name it Process.cshtml, for example, and place into the /Views/Shared folder):
#model List<PROJ.Models.Process>
#Html.TextBoxFor(model => p.value)
Then, your main View would look like this:
#model PROJ.Models.InputModel
#using(Html.BeginForm()) {
foreach(PROJ.Models.Process p in Model.axProc){
#Html.Partial("Process", p)
}
<input type="submit" value="SEND" />
}
Also, check that the loadInputModel() method actually returns something, e.g. not an empty list.
I'm working on a bit of MVC where I'm needing to dynamically route a form to a certain action and parameter combination. So far, I've got this:
PageViewModel
{
public string Action {get;set;}
public string Parameter {get;set;}
/*... other properties for the form */
}
PageController
{
public ViewResult MyAction(string myParamterName) {
return View("CommonView",
new PageViewModel{Action="MyAction", Parameter="myParameterName"));
}
public ViewResult YourAction(string yourParamterName) {
return View("CommonView",
new PageViewModel{Action="YourAction", Parameter="yourParameterName"));
}
/* ... and about 15 more of these */
}
CommonView.aspx:
<%-- ... --%>
<% using (Html.BeginForm(Model.Action,"PageController",FormMethod.Get)) {%>
<%=Html.TextBox(Model.Parameter)%>
<input id="submit" type="submit" value="Submit" />
<%}%>
<%-- ... --%>
This works, but it's got a lot of strings floating around to tell it where to go.
What I'd like to have is a type-safe way of defining the form parameters inside the view, but I'm a bit lost on how to accomplish this. Perhaps something that looks like this -
<% using (Html.BeginForm<PageController>(Model.??ExpressionToGetAction??)) {%>
<%=Html.TextBox(Model.??ExpressionToGetParameter??)%>
<input id="submit" type="submit" value="Submit" />
<%}%>
Or, is there a way to get the action and parameter used to generate this view, perhaps from route data?
Or should there be a custom routing scheme that can handle all of this automagically?
So, what I'm really wanting is the most elegant and type-safe way to accomplish this. Thanks!
EDIT
As Josh points out, the form will submit back to the action. This trims the code somewhat :
PageViewModel
{
public string ParameterName {get;set;}
/*... other properties for the form */
}
PageController
{
public ViewResult MyAction(string myParamterName) {
return View("CommonView",
new PageViewModel{ParameterName ="myParameterName"));
}
public ViewResult YourAction(string yourParamterName) {
return View("CommonView",
new PageViewModel{ParameterName ="yourParameterName"));
}
/* ... and about 15 more of these */
}
CommonView.aspx:
<%-- ... --%>
<% using (Html.BeginForm(FormMethod.Get)) {%>
<%=Html.TextBox(Model.ParameterName)%>
<input id="submit" type="submit" value="Submit" />
<%}%>
<%-- ... --%>
It is still unclear how to have the textbox bind a parameter by name back to the action from which the view was created without explicitly specifying it.
Or, is there a way to get the action and parameter used to generate this view
If you leave the action and controller portion of the BeginForm arguments empty, it will to post back to where it came from. You can have two action with the same name, one decorated as HttpGet and the other HttpPost, as long as they have different parameters. Usually the get has one or none, and the post has several or a model bind.