#using (Html.BeginForm("Boxing", "Company",FormMethod.Post))
{
<div class="box">
<div>
<div class="left">
<div class="topLabel">
Id No:</div>
<div class="input_text_65">
#Html.TextBoxFor(m => m.Id)
</div>
<div class="botLabel">
percentt:
</div>
<div>
<input type="text" style="width: 50px" name="percent" />%
</div>
</div>
<div class="lastDetailField">
<div class="topLabel">
D/C:
</div>
<div class="select_110">
#Html.DropDownListFor(m => m.cType, new SelectList((IEnumerable<Model.cType>)ViewData[ViewDataKeys.cTypes]), "----")
</div>
<div class="margin_top_45">
<input id="submit" type="submit" value="submit" />
</div>
</div>
</div>
</div>
}
If I didn't select any option in the dropdownlist (leaving the optionlabel "----" selected) and I press the submit button, the form will not be posted and the focus will be move to the dropdownlist
if I remove the optional Label, like this:
#Html.DropDownListFor(m => m.cType, new SelectList((IEnumerable)ViewData[ViewDataKeys.cTypes]))
then it will work just fine. I'm thinking if I will put an optional label, does that mean I am required to choose an item? I want the form to be submitted even if I leave the dropdownlist with the optionallabel selected.
thanks in advance!
Do you have a required attribute in your model/viewmoden on cType? I think the clientside validation is kicking in, but because you didn't set a validation helper, you're not seeing the message. The form won't submit though if you select the optional label.
Related
I am having an issue with binding an onChange event to an EditorFor thats being dynamically loaded a dropdown list of countries in a partial view. I have spent a few hours looking for a solution as to what i am doing wrong and why the prop/attribute onChange event is not binding to the div element when the page loads.
The EditorFor block:
<div class="row">
<div class="col-md-2 labelText">#Html.GetResourceString("BuyNow.Step5", "CountryLabel")</div>`enter code here`
<div class="col-md-10">
#Html.EditorFor(m => m.Country, "DropDownSelect", new { DisplayLabel = "empty", List = BaseController.CountryList, CssClass = "tealInput", onChange = "OnChange()" })
</div>
</div>
Now when i view source on the page once its loaded to check if the onChange is present in the div it is not.
Viewed Source after page load:
<select class="tealInput" data-bind="value: DefaultBilling.Country" data-val="true" data-val-length="The Country value cannot exceed 50 characters. " data-val-length-max="50" id="DefaultBilling_Country" name="DefaultBilling.Country"><option value="">Select</option>
As you can see the onchange isnt present and so far i have not been able to debug the issue. Any information on this and possible resources to go study to find out why this is happening would be greatly appreciated.
I have changed the way I am displaying the dropdown:
<div class="row">
<div class="col-md-2 labelText" style="white-space:nowrap;">#Html.GetResourceString("BuyNow.Step5", "CountryLabel")</div>
<div class="col-md-10">
<select class="tealInput" name="country" data-bind='value: DefaultBilling.Country' id="ddlCountry_#Model.AddressTypeId" style="text-align:right;" onchange="OnChange()">
#foreach (var countries in BaseController.CountryList)
{
<option value="#countries.Value">#countries.Text</option>
}
</select>
</div>
</div>
Same issue here as well, on my watch its showing OnChange() is unavailable
In my following ASP.NET MVC Core project view, I want to display input, its corresponding label and submit button Add controls in the same line. but they are displaying in three separate lines, why?. How can I make them display in the same line (please note that the dropdown control is correctly showing its label and submit button Go in the same line). Note: Probably not related - but we know the content of the labels are coming from the data annotations of the corresponding model.
View:
<div class="col-md-9">
<form asp-controller="myControllerName" asp-action="myTestAction" method="post" class="form-horizontal">
<hr />
<div asp-validation-summary="All" class="text-danger"></div>
<div class="form-group">
<div class="col-md-9">
<label asp-for="SelectedYear" class="control-label"></label>
<select asp-for="SelectedYear" asp-items="Model.lstYears"></select><button type="submit" class="btn btn-info btn-xs">GO</button>
</div>
</div>
<div class="form-group">
<div class="col-md-9">
<label asp-for="testDesc" class="control-label"></label>
<input asp-for="testDesc" class="form-control"/><button type="submit" class="btn btn-info btn-xs">Add</button>
</div>
</div>
</form>
</div>
Snapshot of Page display from the above View
UPDATE:
After following a suggestion from the user #RatHat I've been able to display the three controls inline. But, still why they are not aligned left like the other three controls for dropdown. New display:
When using a .form-horizontal, you need to specify the number of columns that each element should cover:
<div class="form-group">
<!-- add the number of columns that the label should use -->
<label asp-for="testDesc" class="control-label col-sm-2"></label>
<!-- add the number of columns that the input should use -->
<div class="col-sm-8">
<input asp-for="testDesc" class="form-control">
</div>
<!-- add the number of columns that the Add button should use -->
<div class="col-sm-2">
<button type="submit" class="btn btn-info btn-xs">Add</button>
</div>
</div>
I have a log-in page. When the user hits the log-in button the button will calla another action method. that action method will have two parameter. the user provided userid and password. then it do some validation and redirect to another action method according to the outcome. I am struggling with there. i guess this is pretty simple. i am new to MVC. Any help would be appriciated.
View
<div class="container-fluid">
<div class="starter-template">
<h1>Policy Assessment Tool</h1>
<p class="lead">Are You Following Right?</p>
<button type="button" class="btn btn-primary btn-lg" onclick="location.href='#Url.Action("Create","UserDatas")'">Register for a An Account</button>
<h3><strong>OR</strong></h3>
</div>
<div class="row">
<form class="form-signin" role="form" method="post">
<div class="col-lg-4"></div>
<div class="col-lg-4">
<h2 class="form-signin-heading">Please Sign-In to Continue</h2>
<div class="input-group">
<input type="text" name="input_domain_id" class="form-control text-center" placeholder="Domain ID" autofocus required>
<input type="password" name="input_domain_password" class="form-control text-center" placeholder="Domain Password" required>
<div class="col-lg-12">
<p><button class="btn btn-lg btn-primary btn-block" type="submit" onclick="location.href='#Url.Action("Verify_Login", "Ldap_Login_Verify")'">Login</button></p>
</div>
</div><!-- /input-group -->
</div><!-- /.col-lg-4 -->
<div class="col-lg-4"></div>
</form>
</div><!-- /.row -->
</div>
Controller
[HttpPost]
public ActionResult Verify_Login(string input_domain_id, string input_domain_password)
//Log-in Logic
return View("Success")
Instead of using form tag use Html.BeginForm HtmlHelper and pass Model from Controller to View for the best practice. Here is link for you to get Getting Started With MVC5.
Based on the mark up above you need not worry about it, When the form is posted the values will get bound to the parameters of the action method, As the parameter names are similar to the form field names.
The above concept is called model binding. The below two links should give you a good idea on the same.
http://www.codeproject.com/Articles/710776/Introduction-to-ASP-NET-MVC-Model-Binding-An-Absol
http://dotnetslackers.com/articles/aspnet/Understanding-ASP-NET-MVC-Model-Binding.aspx
I have tried to compile a simple example below.
Lets assume there is a view like below.
#model string
#{
ViewBag.Title = "Injection";
}
<h2>Injection</h2>
#using(Html.BeginForm())
{
<div id="formDetails">
#Html.TextBox("UserName")
</div>
<div>
<input type="submit" id="btnTest" value="Click Me" />
</div>
}
The Action method for the same would be like
[HttpPost]
public ActionResult Injection(string UserName)
{
return View("Injection");
}
So when i click on the submit button, The form is posted , Since the ViewName is injection, and there is a corresponding action method called injection it will automatically hit that action method. Since the parameter name of the method and field is the same, What ever value is there in the username textbox will get automatically bound to the method parameter.
I have used the basic angular script which update what ever you type in the input field on any element we specify, real time...
<!doctype html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
</head>
<body>
<div>
<label>Name:</label>
<input type="text" ng-model="yourName" placeholder="Enter a name here">
<hr>
<h1>Hello {{yourName}}!</h1>
</div>
</body>
</html>
Im new to Angular. I used this on may rails app. But the problem is, the field I used ng-model will reset its valu after submit. Even setting the 'value' attribute won't work. How can I fix this?
Exact code generated from my rails application :
<form accept-charset="UTF-8" action="/members" class="custom" id="new_member" method="post">
<div class="row collapse text-field">
<div class="small-4 columns">
<h3>Add Member : </h3>
</div>
<div class="small-6 columns left inline">
<h3 class="subheader inline"> {{newEntry.name}}</h3>
</div>
</div>
<div class="row collapse text-field">
<div class="small-3 columns">
<label class="prefix" for="member_name">Full Name</label>
</div>
<div class="small-7 columns left">
<input class="input" id="member_name" name="member[name]" ng-model="newEntry.name" type="text" value="gj" />
</div>
</div>
<div class="row collapse text-field">
<div class="small-3 columns">
<label class="prefix" for="member_address">Address</label>
</div>
<div class="small-9 columns">
<textarea class="input" height="115" id="member_address" name="member[address]">
</textarea>
</div>
</div>
<div class="row">
<div class="small-9 columns" ><input class="button radius" name="commit" type="submit" value="Add Member" /></div>
</div>
</form>
Note : I haven't used an ng-controller. Im new to Angular. If its required, please tell me how to convert the above to the controller. I can get the value of the field and send it back to the form in rails. Its there in a variable. But Angular keeps wiping it!
Note2 : This problem persist only for the input field I used angular-model.. All the other fields retained the data!
Ok this is not the best solution but you could do this:
<input type="text" ng-init="yourName = 'Your Value Goes Here'" ng-model="yourName" placeholder="Enter a name here">
ng-init directives are run when the app intialises, so your value will be assigned to angular's internal "yourName" model and be updated in the view accordingly.
That would solve your problem but its not the best way. Hopefully that will get you going for now - I'll try and post a more "ideal" solution shortly.
i have written this code in one of the view using ASP.NET MVC. MVC returns me the checkboxes values (only those are checked) and with textboxes it returns me all (0,1,2 etc). how can i co-relate which textbox value belongs to which checkbox (since only i get the checked checkbox values)
For Each item As InternalMailCalendarViewModel In ViewData("InternalMailCalendar")
End Code
<div class="editor-field">
#Html.CheckBox("InternalMailCalendarID", New With {.value = item.ID})
<label for="#item.ID">#item.Days</label>
</div>
<div class="editor-field">
<input type="text" id="RunsPerDay" name="RunsPerDay" placeholder="Runs Per Day" />
#Html.ValidationMessageFor(Function(model) model.RunsPerDay)
</div>
#*
<div class="editor-field">
<input type="checkbox" id="InternalMailCalendarID" name="InternalMailCalendarID" value="#item.ID" />
<label for="#item.ID">#item.Days</label>
</div>
<div class="editor-field">
<input type="text" id="RunsPerDay" name="RunsPerDay" placeholder="Runs Per Day" />
#Html.ValidationMessageFor(Function(model) model.RunsPerDay)
</div>
*#
#Code
Next
End Code
According to my understanding of your code and problem, I suggest you following solution:
Just assign hmtl "Name" property to textbox uniquely and that unique name assign to checkbox as a value. So that you can co-relate textbox with checkbox.