DropDownList MVC3 - asp.net-mvc-3

I am doing a edit operation on a record in Grid . One of the column is DropDownValue.
When I go to Edit View , depending upon this dropdownvalue , I make few fields editable and readable. And , One more point is here, I didnt select the dropdown Yet, But whatever its value selected before is the one which I should retrieve. I know I have to use jQuery .But I didnt exact Syntax to do tht.
Here is my dropdown
<div id="dvstatus">
#Html.DropDownListFor(model => model.Study.StudyStatusId, Model.StatusSelectList, new { id = "ddlStatus" })
</div>
NOT SELECTED VALUE, BUT THE VALUE WITH WHICH IT IS LOADED
My requirement is how to get the dropdown value item , when it is loaded onto .cshtml

If you're not referring to the selected value of the dropdown then just pass the value from the controller to your view using your model if you're using a strongly-typed view or pass it some other way like using ViewBag and just set the value when it's passed on view.

You can add a hidden field to save the initially loaded value. Eg
<div id="dvstatus">
#Html.HiddenFor(model => model.Study.StudyStatusId)
#Html.DropDownListFor(model => model.Study.StudyStatusId, Model.StatusSelectList, new { id = "ddlStatus" })
</div>
Then you can use java script to compare current value of the drop down and the value of the hidden field(which has the initial value).

Related

how to get selected value for Kendo DropDownList

I can't figure out how to determine which item is selected in the my kendo dropdownlist. My view defines it's model as:
#model KendoApp.Models.SelectorViewModel
The ViewModel is defined as:
public class SelectorViewModel
{
//I want to set this to the selected item in the view
//And use it to set the initial item in the DropDownList
public int EncSelected { get; set; }
//contains the list if items for the DropDownList
//SelectionTypes contains an ID and Description
public IEnumerable<SelectionTypes> ENCTypes
}
and in My view I have:
#(Html.Kendo().DropDownList()
.Name("EncounterTypes")
.DataTextField("Description")
.DataValueField("ID")
.BindTo(Model.ENCTypes)
.SelectedIndex(Model.EncSelected)
)
This DropDownList contains the values I expect but I need to pass the selected value back to my controller when the user clicks the submit button. Everything works fine except I don't have access to which item was selected from the controller's [HttpPost] action. So, how do i assign the DropDownList's value to a hidden form field so it will be available to the controller?
For anyone who found this wondering how to get the selected value in JavaScript, this is the correct answer:
$("#EncounterTypes").data("kendoDropDownList").value();
From the documentation: http://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist#methods-value
when select a value from a dropdown list, and in the selec event , we can get the selected value as following ,
#(Html.Kendo().DropDownList()
.Name("booksDropDown")
.HtmlAttributes(new { style = "width:37%" })
.DataTextField("BookName")
.DataValueField("BookId")
.Events(x => x.Select("onSelectBookValue"))
.DataSource(datasource => datasource.Read(action => action.Action("ReadBookDropDow", "PlanningBook").Type(HttpVerbs.Get)))
.OptionLabel("Select"))
javascript function like following ,
function onSelectBookValue(e) {
var dataItem = this.dataItem(e.item.index());
var bookId = dataItem.BookId;
//other user code
}
I believe this will help someone
Thanks
Hello I was just going through this problem,kept on searching for 2 hours and came up with a solution of my own.
So here is the line to fetch any data bidden to the kendo drop down.
$("#customers").data("kendoDropDownList").dataSource._data[$("#customers").data("kendoDropDownList").selectedIndex].colour;
Just change the id customers to the id you have given tot he kendo drop down.
Maybe you should be using the DropDownListFor construct of the Kendo DropDownList like so in your view:
#(Html.Kendo().DropDownListFor(m => m.EncSelected)
.Name("EncounterTypes")
.DataTextField("Description")
.DataValueField("ID")
.BindTo(Model.ENCTypes)
.SelectedIndex(Model.EncSelected)
)
This way, when you submit, it will be availble on the POST request and you won't need to put an hidden field anywhere.
BUT should you need to use the hidden field for some reason, put it there, subscribe the the select event of the dropdown list and put using JQuery (for instance) put the selected item on the hidden field.
It's your choice :)
If you want to read also out the text of the dropdown, you can get or set the value by using the following kendo function:
$('#EncounterTypes').data("kendoDropDownList").text();
REFERENCE TO THE DOCUMENTATION
Using this .val() as #Vivek Parekh mentions will not work - there is no function .val() in the kendo framework.
If you want you could use jQuery and get the value back: $('#EncounterTypes').val()
Updated DEMO
$("#EncounterTypes").kendoDropDownList().val();
You can get the selected item like following code and then use item.property to get further information
var selectedFooType = $("#fooType").data("kendoDropDownList").dataItem();
selectedFooType.name
//OR
selectedFooType.id

Post values to controller from table rows that are created dynamically

I am using codeigniter for a project.
I have a table with rows added dynamically through jquery append.
So when I click on a button submit, it post values for all the rows values to the controller, but I am not sure how to do that.
My table row is like this
<td>
<input type="text" class="createWOBlockBG large ui-autocomplete-input" name="basefabrics" id="basefabrics1" autocomplete="off">
</td>
I do not want to use ajax calls.. How do I pass many of the inputs from the view to the controller?Thanks in advance for the help.
If your table with rows and as mentioned submit button is inside a form
then specify action attribute of your form to the controller where you want to access your values
and in the controller you can get the values as follows
$value = $this->input->post('name_of_your_input');
considering your input
$base_fabrics = $this->input->post('basefabrics');
if your form action is calling the same controller method which loaded the view, you can check for the click of submit button and then fetch values
if ($this->input->post('name_of_submit_btn'))
{
$base_fabrics = $this->input->post('basefabrics');
}
EDIT: if all your inputs have same name then better name it as name="basefabrics[]"
so that when you fetch the value
$base_fabrics = $this->input->post('basefabrics');
$base_fabrics will be an array

Binding current value to SelectList's display

I've been able to correctly display a dictionary as a dropdownlist as well as pull it's value on a page submit. But on the GET (initial display) the selected item does not reflect the object's value. My controller is passing state:
ViewData["Status"] = new SelectList(AppHelper.WebinarStatuses, "Key", "Value", selectedStatus);
the View:
<%: Html.DropDownListFor(m => m.Status, (ViewData["Status"] as SelectList), Model.Status )%>
I understand that I need to find the right overload of the DropDownListFor helper - I don't understand how I go about doing that. Small picture, what syntax forces the select list to display what the controller's sending - bigger picture, how do I discover/interpret which overload does what?
profuse thanks

how to retrieve value of dropdown selection when form is not been submitted yet

I have following code
#using (Html.BeginForm())
{
#Html.DropDownListFor(m => m.IDs, new SelectList(Model. IDs), Model.SelectedID)
}
So user selection from this combo bind to SelectedID property of the model. My understanding is that this binding happen only when form is submitted. Let’s say from the same page, I need to do an AJAX call but at this point ) Model.SelectedID does not provide any value because form hasn’t been submitted yet (although user has selected something from drop down). Any ideas how to best deal with this situation?
You can use javascript.
var selectedValue = $("#IDs").val();
bind a change event to your DD
$("#DDL_ID").change(function(){
var currVal = $(this).val();
//do ajax
});
As others have pointed you would get this value with javascript on the change of the drop down list.
I wanted to point out however, that your understanding of the overload you are using for the drop down list is incorrect. This overload will display a default option box label.
For example you could prompt the users to select select something from the list:
#Html.DropDownListFor(m => m.IDs, new SelectList(Model. IDs), "Select Something...")
If you were to post the form in your example as is, you can see the selected item come across in the form. If your view model is setup in such a fashion the model binder would take over and bind this value to your "SelectedID" property.
[HttpPost]
public string DropDown(FormCollection form)
{
var selectedItem = form["IDs"];
return selectedItem;
}

MVC Html.DropDownList selected value being overriden by QueryString value

I am using a dropdownlist in my view like so:
#Html.DropDownList("ClientId", Model.AvailableClients, "-- None --")
Model.AvailableClients is an IEnumerable one of the item's Selected property is set to true. If in the query string for the page request includes "ClientId=" (as in its not set) MVC ignores my selected item. I assume this is because MVC is trying to be helpful and set the selected item automatically using the querystring, but I dont want this.
How can I prevent the querystring value from overriding my item's selected value?
If the name you give your DropDownList is already the name of an element in your model then DropDownList will automatically override the selected value with the model value. If letting ClientId determine the selected value isn't an option then the only solution I know is to rename the DropDownList with a name not included in the model.
#Html.HiddenFor(m => m.ClientId)
#Html.DropDownList("ClientIdNewName", Model.AvailableClients, "-- None --", new { onchange = "ClientId.value = this.value"})
This will keep the value in ClientId without making it the default selection value.

Resources