I need multi select checkbox inside dropdown list mvc
<div class="form-group">
<label for="Product" class="required">Product</label>
#Html.DropDownList("SellerSKUid", null, new { #id = "txtOeCustomer",#name = "SellerSKUid", #class =
"form-control", placeholder = "Select SellerSKUid"})
</div>
<div class="form-group">
<label for="Product" class="required">Product</label>
#Html.DropDownList("SellerSKUid", null, new { #id = "txtOeCustomer",#name = "SellerSKUid", #class =
"form-control", placeholder = "Select SellerSKUid"})
</div>
Related
How do I add a dollar symbol in front of a TextBox, which cannot be edited? I want to have the dollar symbol so people don't need to type '$' by themselves. Here is my code:
#Html.Label("lblP1", "Rate 1", htmlAttributes: new { #class = "control-label", #style = "margin-right: 30px" })
<br />
#Html.EditorFor(m => m.Pricing.Price1, null, new { htmlAttributes = new { #type = "string", #class = "form-control" } })
This is an example using bootstrap:
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text">$</span>
</div>
#Html.EditorFor(m => m.Pricing.Price1, null, new { htmlAttributes = new { #type = "string", #class = "form-control" } })
</div>
Source: https://getbootstrap.com/docs/4.0/components/input-group/
<div class="form-group">
<label>Quoted With New Combo Endorsement</label>
#Html.DropDownListFor(a => a.Quoted_With_New_Combo_Endorsement, new[]
{
new SelectListItem {Text = "Yes", Value = "Yes"},
new SelectListItem {Text = "No", Value = "No"},
}, "Select the Value", new { style = "width:250px", #class = "form-control" })
</div>
How to convert this code to the checkbox for(Yes/NO)?
Reminder: datatype can't be changed to bool
I've done this in a project and it's working fine.
<div class="form-group">
<label class="col-md-2 control-label">Scan in Colour?</label>
<div class="col-md-10">
<div class="radio-group">
#Html.RadioButtonFor(m => m.ScanInColour, "Yes",
new { #id = "ScanInColourYes", #class = "form-control" })
<span>Yes</span>
#Html.RadioButtonFor(m => m.ScanInColour, "No",
new { #id = "ScanInColourNo", #class = "form-control" })
<span>No</span>
</div>
</div>
</div>
Shouldn't it be a radio-button because it either yes or no?
Instead of the #Html.DropDownListFor use:
#Html.RadioButton("YesNo","Yes")
#Html.RadioButton("YesNo","No")
View:
<div class="form-group">
<label for="country" class="control-label col-lg-5">#Html.Label(#BetXOnline.TranslationProvider.Instance.GetTranslationMessage("COUNTRY")):#Html.ValidationMessageFor(m => m.Register.SelectCountryId, null, new { #class = "required" })</label>
<div class="col-lg-7">
#Html.DropDownListFor(m => m.Register.SelectCountryId, Model.Register.Country, "Select country", new { id = "country", #class = "form-control" })
</div>
</div>
<!-- Region-->
<div class="form-group">
<label for="region" class="control-label col-lg-5">#Html.Label(#BetXOnline.TranslationProvider.Instance.GetTranslationMessage("REGION")):#Html.ValidationMessageFor(m => m.Register.SelectRegionId, null, new { #class = "required" })</label>
<div class="col-lg-7">
#Html.DropDownListFor(m => m.Register.SelectRegionId, Model.Register.Region, "Select region", new { id = "region", #class = "form-control" })
</div>
</div>
<!-- City-->
<div class="form-group">
<label for="region" class="control-label col-lg-5">#Html.Label(#BetXOnline.TranslationProvider.Instance.GetTranslationMessage("CITY")):#Html.ValidationMessageFor(m => m.Register.SelectCityId, null, new { #class = "required" })</label>
<div class="col-lg-7">
#Html.DropDownListFor(m => m.Register.SelectCityId, Model.Register.City, "Select region", new { id = "region", #class = "form-control" })
</div>
</div>
Controller:
model.Register.Country = new SelectList(manager.GetCountries(), "Id", "Name");
model.Register.Region = new SelectList(manager.GetRegions(model.Register.SelectCountryId), "Id", "Name");
model.Register.WebTypeOfLicense = new SelectList(CommonDbService.GetAllLicense(), "Id", "Name");
model.Register.City = new SelectList(manager.GetCities(model.Register.SelectRegionId), "Id", "Name");
Function:
IEnumerable<ICountry> GetAllCountries();
ICountry GetCountry(int countryId);
IEnumerable<IRegion> GetRegions(int countryId);
IRegion GetRegion(int regionId);
IEnumerable<ICity> GetCities(int regionId);
ICity GetCity(int cityId);
Main idea is when i select country to get state and when i click on state to get cities...State recives id of country so i need to populate state with id of country to get states and then cites recive id of state to populate cities
You need some javascript function that will fire on dropdown change event and bring the respective child element of selected parent in dropdown. once you receive response fill the child dropdown with latest value you have.
one of simple example : sample
I am trying to Filter/Search kendoUI grid using my custom Dropdownlist. I have been able to get a result on singe column filtering but if i try to add new dropdownlist for filtering the Grid i can't get the required result.
my problem is with logic operator and it's different values.
is it the correct way ? or any other suggestions?
I add here the images for more description and hope you to help me please. thanks
HTML dropdowns :
<html>
<div class="form-group col-md-2" style="margin-bottom:0px;">
#Html.Label("Media", htmlAttributes: (new { #class = "col-sm-4 control-label" }))
<div class="col-sm-8" style="float:none;">
#Html.DropDownListFor(model => model.MediaTypeID, (ViewData["media"] as SelectList), "select media", new { #class = "form-control btnregister chosen-select", onchange = "changes_dropdown(this.id)", data_placeholder = "select media", style = "border-bottom:none;border-radius:0px;" })
#* #Html.ValidationMessageFor(model => model.MediaTypeID, "", new { #class = "text-danger" })*#
</div>
</div>
<div class="form-group col-md-2" style="margin-bottom:0px;">
#Html.Label("Outlet", htmlAttributes: (new { #class = "col-sm-4 control-label" }))
<div class="col-sm-8" style="float:none;">
#Html.DropDownListFor(model => model.channel, (ViewData["company"] as SelectList), "select channel", new { #class = "form-control btnregister chosen-select", onchange = "changes_dropdown(this.id)", data_placeholder = "select channel", style = "border-bottom:none;border-radius:0px;" })
#Html.ValidationMessageFor(model => model.channel, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group col-md-2" style="margin-bottom:0px;">
#Html.Label("Start Date", htmlAttributes: (new { #class = "col-sm-6 control-label" }))
<div class="col-sm-6" style="float:none;">
#Html.DropDownListFor(model => model.EntryDate, (ViewData["entryDate"] as SelectList), "select date", new { #class = "form-control btnregister chosen-select", onchange = "changes_dropdown(this.id)", data_placeholder = "select date", style = "border-bottom:none;border-radius:0px;", id = "startDate" })
#Html.ValidationMessageFor(model => model.EntryDate, "", new { #class = "text-danger" })
</div>
</div>
</html>
Javascript Function and filltering:
<script type="text/javascript">
function changes_dropdown(fieldID)
{
var fieldValue = document.getElementById(fieldID).value;
$("#grid").data("kendoGrid").dataSource.filter({
logic: "and",
filters: [
{
field: fieldID,
operator: "contains",
value: fieldValue
}
]
});
}
</script>
At first you don't need to pass id of current field to changes_dropdown function. Instead you can use onchange = "changes_dropdown() and inside this function use var fieldValue = this.value
Also when you define single filter you don't need to specify logic between predicates (http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-filter):
$("#grid").data("kendoGrid").dataSource.filter({
filters: [
{
field: fieldID,
operator: "contains",
value: fieldValue
}
]
});
I have the following dynamically created textboxes in my view:
#for (int i = 0; i < Model.MullionList.Count; i++)
{
ItemDrops curMullItem = Model.MullionList.ElementAt(i);
<div class="form-group">
#Html.Label(curMullItem.ItemName.ToString(), new { #class = "col-sm-6 control-label" })
<div class="col-sm-6">
#Html.TextBoxFor(x => x.MullionList[i].ItemPossInfo, new { #class = "form-control" })
#Html.HiddenFor(x => x.MullionList[i].ItemName)
</div>
</div>
}
I noticed occaionally for certain types of product this was returning null when posted (for MullionList), even though i selected these dropdowns.
so it works for certain product but not others.
The even weirder part is when i remove this section further down the view it works (ie MulionList is not null when the form is posted)
<div class="form-group">
#Html.Label("Glass", new { #class = "col-sm-6 control-label", id = "glass-first-label" })
<div class="col-sm-6">
#Html.DropDownListFor(gu => gu.GlassItems[0].Value, Model.GlassTypes, "-- Select --", new { #class = "form-control glass-multi-select", id = "Glass" + 0 })
</div>
</div>
<div id="hidden-glass-select" style="display: none">
#for (int i = 1; i < Model.GlassUnitsCount; i++)
{
var glassUnit = Model.GlassUnits.ElementAt(i);
<div class="form-group">
#Html.Label(glassUnit.ToString(), new { #class = "col-sm-6 control-label" })
<div class="col-sm-6">
#Html.DropDownListFor(gu => gu.GlassItems[i].Value, Model.GlassTypes, "-- Select --", new { #class = "form-control glass-multi-select", id = "Glass" + i })
</div>
</div>
}
</div>
<div class="form-group">
#Html.LabelFor(go => go.GlazzingInfoVal, "Glazzing Option", new { #class = "col-sm-6 control-label" })
<div class="col-sm-6">
#Html.DropDownListFor(go => go.GlazzingInfoVal, Model.GlazzingOptions, "-- Select --", new { #class = "form-control" })
</div>
</div>
I think I have fixed this now.
I renamed all items (lists that started with Glass or Glazzing and it works!)
This looks like a proper MVC bug
Thanks to this answer:https://stackoverflow.com/a/16113919/66975
This has costed me several hours, GRRRR