I have a view that has the ultimate aim of being a user creation form. It is structured in the following way:
<fieldset>
#Html.DropDownList("first dropdown")
</fieldset>
<fieldset id="exists">
#Html.DropDownList("seconddropdown")
#Html.DropDownList("third dropdown")
#Html.DropDownList("fourth dropdown")
<input type="submit" value="Create User"/>
</fieldset>
<fieldset id="new">
#Html.DropDownList("dropdown")
#Html.DropDownList("dropdown")
#Html.DropDownList("dropdown")
<input type="submit" value="Create User"/>
</fieldset>
<script>
//script here shows and hides fieldsets depending on value chosen in first dropdown
</script>
Depening on the value chosen in the first dropdown, either fieldset exist or fieldset new will show. they both interact with the database differently so I really need to be able to handle the submit action separately for each. I have tried creating a submit within each fieldset, but the controller action is never hit.
I am obviously missing the mark with MVC submit buttons so could anyone help me understand how these work and how to create multiple (and separate) submit possibilities on one view.
Many thanks
You could have two forms, each that post to a different action...the submit will then only submit the form values in that form...
e.g.
#using (Html.BeginForm("Login", "Account", FormMethod.Post))
{
<fieldset id="exists">
#Html.DropDownList("seconddropdown")
#Html.DropDownList("third dropdown")
#Html.DropDownList("fourth dropdown")
<input type="submit" value="Log in"/>
</fieldset>
}
#using (Html.BeginForm("Create", "Account", FormMethod.Post))
{
<fieldset id="new">
#Html.DropDownList("dropdown")
#Html.DropDownList("dropdown")
#Html.DropDownList("dropdown")
<input type="submit" value="Create"/>
</fieldset>
}
Related
I've looked into many sources to find the exact answer that I need, but unfortunately, I couldn't understand or they never hit the exact spot that I need.
Basicly, I am developing a spring-mvc web application and I am going to allow user to add post to the website. While adding this post, he/she is going to identify some features of the post, and one of the feature is category. Everything is working fine but category. I've tried to implement this category field with a dropdown menu, but I get nothing populated in dropdown when I run the project.
Here is my jsp page:
<%#taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%#include file="/WEB-INF/views/template/header.jsp" %>
<div id="page">
<div id="main">
<div class="row">
<div class="three columns"></div>
<div class="six columns">
<form:form action="${pageContext.request.contextPath}/addPost" method="post" commandName="post"
enctype="multipart/form-data">
<div class="form-group">
<label>Kategori</label>
<form:select path="category" id="category">
<form:option value="NONE" label="--- Seçiniz ---"/>
<form:options items="${category}"></form:options>
</form:select>
<!--select name="category">
<option name="category_id" value="0">Seçiniz</option>
</select-->
</div>
<div class="form-group">
<label>İlan Başlığı</label> <form:errors path="postTitle" cssStyle="color: #ff0000"/>
<form:input path="postTitle" id="title" class="form-Control"/>
</div>
<div class="form-group">
<label>İlan Açıklaması</label>
<form:input path="description" id="description" class="form-Control"/>
</div>
<!--div class="form-group">
<label>Etiketler</label>
<input type="text" class="asdasd" name="title" placeholder="İlanınız ile ilgili etiketler" required>
</div-->
<div class="form-control">
<label>Fiyat</label> <form:errors path="price" cssStyle="color: #ff0000"/>
<form:input path="price" id="price" class="form-Control"/>
</div>
<div class="form-group">
<label>Lokasyon</label>
<form:input path="postAddress" id="address" class="form-Control"/>
</div>
<div class="form-group">
<label class="control-label" for="postImage">Fotoğraf Yükle</label>
<form:input name="file" path="postImage" id="postImage" type="file" class="form:input-large"/>
</div>
<div class="form-group">
<button type="submit" value="submit" class="btn btn-send-message pull-right">İLAN OLUŞTUR</button>
</div>
</form:form>
</div>
<div class="three columns"></div>
</div>
</div>
And here is my Controller function:
#RequestMapping(value= "/addPost", method = RequestMethod.GET)
public String addPost(Model model) {
Post post = new Post();
post.setActive(true);
List<Category> category = categoryService.getAllCategories();
model.addAttribute("category", category);
model.addAttribute("post", post);
return "addPost";
}
What I want to do here is, I want to get the necessary data from the database table that I've created by the help of Hibernate, and send it to dropdown menu.
Many examples here in SO and some other blogs shows that feature like filling the dropdown menu from the controller by manually. This is the one that I don't want. So far, the closest answer that I can find is this. But since I am new in Spring, I couldn't get it.
If anyone can even point me in the right direction on how to set this up that would be a great help.
Thanks in advance.
From what I can see, it looks like you have two model attributes, the post and list of categories. The JSP has a form, this form is bound to the post bean, and you want to have the list of categories appear in a dropdown on the form.
As far as I know, and google this is not possible, as long as you have two separate model attributes. The problem is that <form:select path="category"..>
is scoped by your commandName bean, so it is looking for category as a property on post, and not in the view model.
I think you need to make a new class FormBean which has two properties, category and post, and then bind that to the from using commandName="formBean", and then use path="post.postTitle" for a single property on the post object, and <form:select path="category"...> for the dropdown.
Hope this helps
I have a basic ASP.NET MVC3 view like this:
#Html.Label("Administrative Options");
<br />
#Html.ListBoxFor(m => m.SelectedUsers, Model.Users)
<br />
using (Html.BeginForm("AssignAdmins", "Account"))
{
<div id="MakeAdminsbtn">
<input id="MakeAdmins" type="submit" value="Assign Administrators" onclick="return confirm('Are you sure you want to Admin?');" />
</div>
}
<br />
using (Html.BeginForm("RevokeAdmins", "Account"))
{
<div id="RemAdminsbtn">
<input id="RemAdmins" type="submit" value="Revoke Administrators" onclick="return confirm('Are you sure you want to De-Admin?');" />
</div>
}
<br />
using (Html.BeginForm("DeleteAccounts", "Account"))
{
<div id="DelAcctbtn">
<input id="DelAcct" type="submit" value="Delete Accounts" onclick="return confirm('Are you sure you want to Delete?');" />
</div>
}
Each button is in it's own form because I think that's what I have to do in order to submit to different actions?
The problem I'm having is that the returned model does not contain the SelectedUsers from the ListBoxFor unless that statement is inside the form used by the submit button.
How can I get the model appropriately populated with the selected users for each of the given submit options while only displaying a single ListBox?
You could use only one ActionMethod and there base on witch button is clicked to call that action that you nead example:
#using (Html.BeginForm("Index", "Home"))
{
<div>
#Html.ListBoxFor(m => m.SelectedUsers, Model.Users)
<input id="MakeAdmins" type="submit" name="btnSubmit" value="Assign Administrators" onclick="return confirm('Are you sure you want to Admin?');" />
<input id="RemAdmins" type="submit" name="btnSubmit" value="Revoke Administrators" onclick="return confirm('Are you sure you want to De-Admin?');" />
<input id="DelAcct" type="submit" name="btnSubmit" value="Delete Accounts" onclick="return confirm('Are you sure you want to Delete?');" />
</div>
}
and then in your controller
[HttpPost]
public ActionResult Index(string btnSubmit, FormCollection collection)
{
//btnSubmit this is the button that is clicked.
return View();
}
Sorry for my bad English.
In my View I have something like:
#model CreatorModel
<form name="myForm" action="/Creator/CreateAction" enctype="multipart/form-data" id="myForm" method="post">
<div class="a">
<h2 class="a">....</h2>
<div class="b">
<br />
Select a file for a <input type="file" name="aFile" id="aFile" />
<br /><br />
Select a file for b<input type="file" name="bFile" id="bFile" />
<br /><br />
<input type="submit" id="CreateAction" name="CreateAction" value="CreateAction" />
</div>
</form>
But I have an error : File /Creator/CreateAction is not found (CreateAction is an action from CreatorController)
What can I enter as action in <form...> in order to find action from controller?
When I'm using this syntax:
#using (Html.BeginForm("FileUpload", "Board", FormMethod.Post, new { enctype = "multipart/form-data" })) { <input type="file" /> <input type="submit" /> }
I also have an error: A reference is not set to an instance of an object"
Maybe there is a bad routing?
when using MVC widgets in Hybrid mode (on a webforms template) you need to use a special version of BeginForm (because webforms only allows one form on the page).
#Html.BeginSitefinityForm()
should be the form you use to define a form area in your widget. Replace the regular one with that and the widget should work as expected.
I hope this is helpful!
here is my view:
#model IDictionary<int, RemoteControl.Core.Slot>
<div style="left: 20px; width: 350px">
<form id="rcForm">
#foreach (var a in Model)
{
<div id="#a.Key-div">
<div style="float: left; width: 225px">
<input type="radio" class="slotRadio" name="slots" id="#a.Key" value="#a.Key"/>#a.Value.Name</div>
<div>
<input type="text" readonly="readonly" value="#a.Value.Status" style="width:20px"/>
<input disabled="disabled" type="submit" class="buttonOperation" id="#a.Key-btnON" value="ON" />
<input disabled="disabled" class="buttonOperation" type="submit" id="#a.Key-btnOFF" value="OFF" /></div>
</div>
}
</form>
</div>
this view receives IDictionary from my Index action of my Home Controller. it displays the elements of the dictionary with each element corresponding a radio button.
each element has a name and status. Every radio button of the elements has two buttons besides it: ON and OFF.
I want to everytime either the ON/OFF button is clicked, the name and status of the element selected in the radio buttons will be passed to an action in a controller. I have been trying to do a form collection but I always see examples that uses only input text box.. so how could i do this??
PS: dont worry about the readonly and disabled attribs... i am doing something with it in my jquery..
I have three partial views that are each strongly typed with separate models. Each view contains it's own form and submits to different actions. Some of the models contain properties with the same names and when I use the html helper methods to create the textboxes and labels, I'm ending up with duplicate html ids on the page.
Partial _Residential View
#model MyProject.Models.ResidentialModel
#using (Html.BeginForm("Residential", "Transaction"))
{
#Html.LabelFor(m => m.PersonName)
#Html.TextBoxFor(m => m.PersonName)
#Html.LabelFor(m => m.ReferenceNumber)
#Html.LabelForm(m => m.ReferenceNumber)
<input type="submit" value="Submit" />
}
Partial _Business View
#model MyProject.Models.BusinessModel
#using (Html.BeginForm("Business", "Transaction"))
{
#Html.LabelFor(m => m.BusinessName)
#Html.TextBoxFor(m => m.BusinessName)
#Html.LabelFor(m => m.ReferenceNumber)
#Html.LabelForm(m => m.ReferenceNumber)
<input type="submit" value="Submit" />
}
Normal View
<h2>Residential Transaction</h2>
#Html.Partial("_Residential")
<h2>Business Transaction</h2>
#Html.Partial("_Business")
The output that I'm getting looks like the following:
<h2>Residential Transaction</h2>
<form action="/Transaction/Residential" method="post">
<label for="PersonName">Person Name:</label>
<input type="text id="PersonName" name="PersonName" />
<label for="ReferenceNumber">Reference Number:</label>
<input type="text" id="ReferenceNumber" name="ReferenceNumber" />
<input type="submit" value="Submit" />
</form>
<h2>Business Transaction</h2>
<form action="/Transaction/Business" method="post">
<label for="BusinessName">Business Name:</label>
<input type="text" id="BusinessName" name="BusinessName" />
<label for="ReferenceNumber">Reference Number:</label>
<input type="text" id="ReferenceNumber" name="ReferenceNumber" />
<input type="submit" value="Submit" />
</form>
Since ReferenceNumber is in both models, I'm getting a duplicate id on the page. I figured out that i can pass an extra htmlAttributes parameter to TextBoxFor to change the id.
#Html.TextBoxFor(m => m.ReferenceNumber, new { id = "ResidentialReferenceNumber" })
...
#Html.TextBoxFor(m => m.ReferenceNumber, new { id = "BusinessReferenceNumber" })
This fixes the ids on the inputs but the 'for' attribute on the labels still has the wrong value. I looked through the various overloads for LabelFor() and unlike the TextBoxFor, there isn't an htmlAttributes property. Is there some way that I can tell model or view to use a different id for these fields?
MVC helpers do not take into account that you can have multiple models in a view. All properties that have the same name will get duplicate values (one value per model).
That is, if ResidentalTransaction and BusinessModel has a Name property, your html form will have two <input type="text" name="Name" /> fields.
I'm unsure of how it works if you add all models to the same viewmodel and use Html.TextBoxFor(m => m.ResidentalTransaction.Id);