I would like to ask if why the <input type="submit" value="" is not included in the form when I tried to debug the form using F12.
Here is the code:
<table>
<tr>
#if (ViewBag.wthOutSupp == false)
{
using (#Html.BeginForm("Item_SendForApprovalMail", "BuyersTask", FormMethod.Post))
{
<td style="border-color:#1e7c97; background-color:#1e7c97" colspan="5">
#Html.Hidden("id",(int)#ViewBag.prfNo)
<center> <input type ="submit" id="subbttn1" value="Submit the Item/s to Reveiwer" /><center>
</td>
}
}
else if (ViewBag.wthOutSupp == true) {
using (#Html.BeginForm("OnHoldItems", "SearchItems", FormMethod.Post))
{
<td style="border-color:#1e7c97; background-color:#1e7c97" colspan="5">
#Html.Hidden("id",(int)#ViewBag.prfNo)
<center> <input type ="submit" id="subbttn" value="Hold Some Items that Have no Supplier Yet" /><center>
</td>
}
}
</tr>
</table>
In the F12 results:
Could someone help me with this one?
You code is generating invalid html. A <form> element cannot be a child of a <tr> element.
Change your code to
<table>
<tr>
<td style="border-color:#1e7c97; background-color:#1e7c97" colspan="5">
#if (ViewBag.wthOutSupp == false)
{
using (#Html.BeginForm("Item_SendForApprovalMail", "BuyersTask", FormMethod.Post))
{
#Html.Hidden("id",(int)#ViewBag.prfNo)
<center> <input type ="submit" id="subbttn1" value="Submit the Item/s to Reveiwer" /><center>
}
}
else
{
....
}
</td>
Related
#model OnlineExam.Models.CandidateExam.CandidateItem
#{
ViewData["Title"] = "Index";
var questionList = JsonConvert.DeserializeObject<List<OnlineExam.Models.AdminQuestionModel.QuestionAndAnswers>>(TempData["questionList"].ToString());
//var data = questionList as IEnumerable<OnlineExam.Models.AdminQuestionModel.QuestionAndAnswers>;
var data2 = questionList as List<OnlineExam.Models.AdminQuestionModel.QuestionAndAnswers>; //new stackov
int examAttemptId = Convert.ToInt32(TempData["examAttemptId"].ToString());
TempData.Keep();
}
<h1>Answer Exam</h1>
<h6>Best of luck!!</h6>
<div>
<form enctype="multipart/form-data" asp-action="AnswerExam">
#{
int counter = 0;
}
#for (var i = 0; i < data2.Count(); i++)
{
<table class="table">
<tbody>
<tr class="border-light" style="background-color: lavender">
#{
counter = counter + 1;
}
<td>Question #counter) #data2[i].Question.ToString()</td>
#{
<td>
<input type="hidden" asp-for="candidateExamsList[i].ExamId" value="#data2[i].ExamId" />
<input type="hidden" asp-for="candidateExamsList[i].QuestionId" value="#data2[i].QuestionId" />
<input type="hidden" asp-for="candidateExamsList[i].ExamAttemptId" value="#examAttemptId" />
</td>
}
</tr>
#*<tr class="border-white">
<td>Options : </td>
</tr>*#
<tr class="border-light">
<td>a) #Html.RadioButtonFor(x => x.candidateExamsList[i].OptionSelected, data2[i].OptionOne) #data2[i].OptionOne</td>
</tr>
<tr class="border-light" style="background-color: lavender">
<td>b) #Html.RadioButtonFor(x => x.candidateExamsList[i].OptionSelected, data2[i].OptionTwo) #data2[i].OptionTwo</td>
</tr>
<tr class="border-light">
<td>c) #Html.RadioButtonFor(x => x.candidateExamsList[i].OptionSelected, data2[i].OptionThree) #data2[i].OptionThree</td>
</tr>
<tr class="border-light" style="background-color: lavender">
<td>d) #Html.RadioButtonFor(x => x.candidateExamsList[i].OptionSelected, data2[i].OptionFour) #data2[i].OptionFour</td>
</tr>
<tr><td> </td></tr>
<tr><td> </td></tr>
</tbody>
</table>
}
<div class="form-group">
<input type="submit" value="Submit Test" class="btn btn-primary"/>
</div>
</form>
</div>
I have a list of questions in my model and i wish to display each question (model item) on single page and then click next to move on to next question (model item).
How do I achieve that?
As shown in my post here the GET action method Test(..) works fine when using foreach loop in the corresponding Test.chtml view but the POST action method Test(...) returns null. But, as mentioned by many users, the foreach is not reliable for POST method. So, I decided to use the for loop as shown below. But that returned unexpected results in the view since, according to this post, in a foreachloop type casting is done automatically but in for loop you have to type cast the objects Model[i].BlogID etc to a proper class object type.
So, I decided to type cast the objects Model[i].BlogID etc to a BlogsWithRelatedPostsViewModel class object type as shown in the second version of Test.cshml view below; and this time the Test.cshtml view is displayng the correct records. But although the submit button in the view is sending a a valid model (ModelState.IsValid is true) the Model.Count is 0 that results in no update to database. Why Model.Count is 0 and how to correct it? As you can see below the html page source of the view is showing the name attributes of the tags matching the property values in the View Model.
Note: For complete code, please see this OP. I'm using ASP.NET Core with EF Core and Tag Helpers.
Test.cshtml view with for loop - without type casting the loop objects:
#model IList<ASP_Core_Blogs.Models.BlogPostViewModels.BlogsWithRelatedPostsViewModel>
#using ASP_Core_Blogs.Models.BlogPostViewModels
#{ ViewData["Title"] = "Index"; }
<div class="row">
<div class="col-md-12">
<form asp-controller="Blogs" asp-action="Test" asp-route-returnurl="#ViewData["ReturnUrl"]" method="post">
#{
IEnumerable<SelectListItem> yearsList = (IEnumerable<SelectListItem>)ViewBag.YearsList;
var currentlySelectedIndex = 0; // Currently selected index (usually will come from model)
}
<strong>Select a Post Year</strong>
<h6>Choose a year and a URL to begin:</h6>
<label>Year:</label><select asp-for="#currentlySelectedIndex" asp-items="yearsList"></select><input type="submit" class="btn btn-default" name="GO" value="GO" />
<table class="table">
<thead>
<tr>
<th></th>
<th></th>
<th>Url</th>
<th>Title</th>
<th>Content</th>
</tr>
</thead>
<tbody>
#for (int i=0; i< Model.Count(); i++)
{
<tr>
<td><input type="hidden" asp-for="#Model[i].BlogID" /></td>
<td><input type="hidden" asp-for="#Model[i]).PostID" /></td>
<td>
<input type="text" asp-for="#Model[i].Url" style="border:0;" readonly />
</td>
<td>
<input asp-for="#Model[i].Title" />
</td>
<td>
<input asp-for="#Model[i].Content" />
</td>
</tr>
}
</tbody>
</table>
<button type="submit" class="btn btn-default">Save</button>
</form>
</div>
</div>
Test.cshtml view with for loop objects being casted as BlogsWithRelatedPostsViewModel class objects:
#model IList<ASP_Core_Blogs.Models.BlogPostViewModels.BlogsWithRelatedPostsViewModel>
#using ASP_Core_Blogs.Models.BlogPostViewModels
#{ ViewData["Title"] = "Index"; }
<div class="row">
<div class="col-md-12">
<form asp-controller="Blogs" asp-action="Test" asp-route-returnurl="#ViewData["ReturnUrl"]" method="post">
#{
IEnumerable<SelectListItem> yearsList = (IEnumerable<SelectListItem>)ViewBag.YearsList;
var currentlySelectedIndex = 0; // Currently selected index (usually will come from model)
}
<strong>Select a Post Year</strong>
<h6>Choose a year and a URL to begin:</h6>
<label>Year:</label><select asp-for="#currentlySelectedIndex" asp-items="yearsList"></select><input type="submit" class="btn btn-default" name="GO" value="GO" />
<table class="table">
<thead>
<tr>
<th></th>
<th></th>
<th>Url</th>
<th>Title</th>
<th>Content</th>
</tr>
</thead>
<tbody>
#for (int i=0; i< Model.Count(); i++)
{
<tr>
<td><input type="hidden" asp-for="((BlogsWithRelatedPostsViewModel)#Model[i]).BlogID" /></td>
<td><input type="hidden" asp-for="((BlogsWithRelatedPostsViewModel)#Model[i]).PostID" /></td>
<td>
<input type="text" asp-for="((BlogsWithRelatedPostsViewModel)#Model[i]).Url" style="border:0;" readonly />
</td>
<td>
<input asp-for="((BlogsWithRelatedPostsViewModel)#Model[i]).Title" />
</td>
<td>
<input asp-for="((BlogsWithRelatedPostsViewModel)#Model[i]).Content" />
</td>
</tr>
}
</tbody>
</table>
<button type="submit" class="btn btn-default">Save</button>
</form>
</div>
</div>
A Portion of html generated by View after Submit:
<tr>
<td><input type="hidden" data-val="true" data-val-required="The BlogID field is required." id="BlogID" name="BlogID" value="1" /></td>
<td><input type="hidden" data-val="true" data-val-required="The PostID field is required." id="PostID" name="PostID" value="1" /></td>
<td>
<input type="text" style="border:0;" readonly id="Url" name="Url" value="blog1#test.com" />
</td>
<td>
<input type="text" id="Title" name="Title" value="Title1" />
</td>
<td>
<input type="text" id="Content" name="Content" value="Content1" />
</td>
</tr>
I am new to MVC. Not sure how to NOT have the page do a full blinking refresh on click of the submit button. Have not found examples on this other than to put the code in an action in my controller, and I would prefer to have the code as I have it below. Thank you for your assistance!
<form method="post">
<div style="float: left">
Enter the number of days previous to today for which to search: <input type="text" name="NumberOfDays" value="#Request.Form["numberOfDays"]"/>
</div>
<div class="puck-button">
<input type="submit" value="GO!" class="btn btn-primary"/>
</div>
<br/><br/><br/><br/>
#{
var numberOfDays = int.Parse(Request.Form["NumberOfDays"].IsNullOrWhiteSpace() ? "0" : Request.Form["NumberOfDays"]);
var startDate = DateTime.Today.AddDays(-numberOfDays);
<table id="puckBoard" class="gridView">
<thead>
<tr>
#foreach (var item in Model.ProcessSteps)
{
<th>
<div class="puck-step">
#Html.DisplayFor(modelItem => item.Description)
</div>
</th>
}
</tr>
</thead>
<tbody>
#if(startDate != DateTime.Today) { #CompactTableRows(startDate, Model.Modules) }
else
{ #GetSimpleModuleTableRow(Model.Modules) }
</tbody>
</table>
}
</form>
I have this grid which has an edit button. How do I add code to the input button so that the value of the Id is sent to the Controller?
#using (Ajax.BeginForm("EditLineItem", "OrderSummary", new AjaxOptions() { InsertionMode = InsertionMode.Replace, UpdateTargetId = "content" })) {
<div id="summaryGrid">
<table >
<tr>
<th>Report Type</th>
<th>Borrower Name</th>
<th>Property Address</th>
<th>Est Comp Date</th>
<th>Report Price</th>
<th>Exp Fee</th>
<th>Disc.</th>
<th>Total Price</th>
</tr>
#{
foreach (var item in Model) {
<tr>
<td >#item.ReportName</td>
<td >#item.BorrowerName</td>
<td >#item.Address</td>
<td >#item.EstimatedCompletionDate</td>
<td >#item.ReportPrice</td>
<td >#item.ExpediteFee</td>
<td >#item.Discount</td>
<td >#item.TotalPrice</td>
<td >#item.Id</td>
<td ><input type="submit" value="Edit" /></td>
</tr>
}
}
</table>
</div>
}
just put a name on your input button.
<input type="submit" name="id" value="edit" />
Then on your action, you should be able to get the value for id.
If you want more complexity then you are going to have to rethink the way you are doing it. Most likely by writing your own JQuery methods.
$('input.edit').on('click', function (evt) {
evt.preventDefault();
var values = $(this).data();
$.post($(this).attr('href'), values, function (result) { /*do something*/ });
});
Html :
<a href="/edit/1" class="edit" type="submit" data-id="1" data-method="edit" />
That's a start, but you could probably tweak it to fit your needs. At that point, you don't need to wrap the whole table with the Ajax.BeginForm.
To add to Khalid's answer: I tested with this form:
<form method="get">
<input type="submit" name="Id1" value="Edit" id="id1" />
<input type="submit" name="Id2" value="Edit" id="id2" />
<input type="submit" name="Id3" value="Edit" id="id3" />
</form>
The post looks like this when clicking on the third button:
http://localhost:34605/HtmlPage.html?Id3=Edit
In other words, the browser passes the name of whichever button is clicked.
This is an example of getting the Id in the controller:
if (Request.QueryString.HasKeys()) {
string key = Request.QueryString.GetKey(0);
int id;
int.TryParse(key.Substring(2, 1), out id);
Response.Write("You selected id: " + id);
}
I have since found an even easier way of doing this:
Use the <button> element instead of <input>
With <button> you can do this:
<button type="submit" value="#item.Id" name="id">Edit</button>
and then in the controller, all you need is this:
public ActionResult EditLineItem(int id)
{ //Do something with id}
Note that this does not work with IE6.
I will create a list with checkboxlist. For those I use following code:
<s:form action="accept" namespace="/manager/course">
<s:checkboxlist list="courseRequests" name="acceptList" listValue="studentNickname" listKey="studentId" theme="checkbox-fix"/>
<s:url action="accept" namespace="/manager/course" var="accList" />
<s:a href="%{accList}"><s:text name="Accept"/> </s:a>
</s:form>
It work fine a create a check box list, that you can see its pic in the following:
and this is html code generated by above code:
<form id="accept" name="accept" action="/ESA/manager/course/accept.action" method="post">
<table class="wwFormTable">
<table class="gradienttable">
<tr>
<th class="row"><p>Row</p></th>
<th style="width: 240px;"><p>Student</p></th>
<th ><p>Accept</p></th>
</tr>
<tr>
<td id="row"><p><label>1</label></p></td>
<td style="width:250px;"><p>
<label for="acceptList-1" class="checkboxLabel">Mansour Barzegar</label>
</p></td>
<td style="text-align:center;"><p>
<input type="checkbox" name="acceptList" value="5" id="acceptList-1" </p></td>
</tr>
<tr>
<td id="row"><p><label>2</label></p></td>
<td style="width:250px;"><p>
<label for="acceptList-2" class="checkboxLabel">Ali Mahmoudi</label>
</p></td>
<td style="text-align:center;"><p>
<input type="checkbox" name="acceptList" value="6" id="acceptList-2" </p></td>
</tr>
<tr>
<td id="row"><p><label>3</label></p></td>
<td style="width:250px;"><p>
<label for="acceptList-3" class="checkboxLabel">Masih Zare</label>
</p></td>
<td style="text-align:center;"><p>
<input type="checkbox" name="acceptList" value="7" id="acceptList-3" </p></td>
</tr>
</table>
Accept
</table>
</form>
In the Action Class I tried to retrive seleced checkbox value by following code:
private int[] acceptList;
public void setAcceptList(int[] acceptList){
this.acceptList=acceptList;
}
and several other code but I all states I get null.
Do I use wrong code?
in your markup, do this:
<input type="checkbox" name="thename" id="checkbox_id1" value="value1" />
<input type="checkbox" name="thename" id="checkbox_id2" value="value2" />
in your action (or object) do this:
// action/object code...
Set<String> cbox = new HashSet();
public void setThename(String[] thenames) {
for (String thename : thenames) {
cbox.add(thename);
}
}
// action/object code...
notice the checkbox name matches the setter name, e.g. element name == someName and method == setSomeName
Same would apply for Set<Integer>, but you use int[] thenames as the argument. You could also use Integer[] thenames for the argument.
to test output:
if (cbox != null) {
for (String s : cbox) {
log.info(s);
}
}
http://struts.apache.org/release/2.2.x/docs/using-checkboxes.html