DropDownListFor and Multiple Select Value - asp.net-mvc-4

I'm trying to generate a select tag with multiple options enabled, on the server side im generating a SelectListItem with NGO Objects, and a SelectedNGOes string array representing the values that should be selected:
#Html.DropDownListFor(x => x.SelectedNGOes,
new SelectList(Model.Ngoes, "Value", "Text"), new { #class = "span6", multiple = "true" })
Everything works well except the selected value are ignored during rendering, i made sure that the SelectedNGOes have the right values, not sure why the selections are being ignored.

DropDownListFor sets the selected value to the value of the lambda and ignores the selected value in the select list. set your lambda on the controller
Model.SelectedNGOes = "Selected Value";
and that value will be set on the view as long as it matches a value in the list

Related

DataTables - createdRow in conjunction with dynamic column hide/unhide

I implemented a dynamic column visibility to hide/show columns, e.g. DT.columns(5).visible(true) and DT.columns(5).visible(false) to show/hide column 5. I also have a callback for createdRow which let's say makes a html button out of the text in column 5.
Currently in createdRow I check this.api().columns(5).visible() and if true then I proceed to do $('td:eq(5)',row).html('<button>'+data[5]+'</button>') cell content, and if false then I return because otherwise I'd overwrite the current 5th <td> which is not the intended one. But then when I unhide column 5, it comes up as text since I did not run the previous code.
I'd like to be able to run the code and cache the html of the cell in column 5 so that when it's unhidden, it comes up with the intended <button>. What's the best way to do that? The column-visibility event?
Note that I know I can use the render: function (...) {} option for the column, but I do not want to use that because it affects the raw data of the table and affects filtering and searching - I want the raw data to remain unaffected, which is why I was using the createdRow or rawCallback callbacks.
Assume column 5 has visibile: false in the DataTable initialization object which looks like this:
var DT = $('#dt').DataTable({
...
createdRow: function (row, data) {
if (this.api().column(5).visible()) {
$('<button>' + data[5] + </button>')
.appendTo($('td:eq(5)',row).text(''));
}
);
Cheers
Look into using columnDefs and the 'render' function instead...
var DT = $('#dt').DataTable({
...
"columnDefs":[
{
'targets':[0],
'visible':false,
'render':function(data, type, row, meta){
...
}
]
});
https://datatables.net/reference/option/columns.render
https://datatables.net/reference/option/columns.data

Getting id from row clicked on a dgrid List

I just started using dgrid, and going through the dTunes sample, I'm unable to find the id associated with each row in the list. This is pretty remedial on my part, but how would I also get the id I sent from the datasource?
define([
'require',
'dgrid/List',
'dgrid/OnDemandGrid',
'dgrid/Selection',
'dgrid/Keyboard',
'dgrid/extensions/ColumnHider',
'dojo/_base/declare',
'dojo/_base/array',
'dojo/Stateful',
'dojo/when',
'dstore/RequestMemory',
'put-selector/put',
'dojo/domReady!'
], function (require, List, Grid, Selection,
Keyboard, Hider, declare, arrayUtil, Stateful,
when, RequestMemory, put) {
var cstsNode = put(listNode, 'div#cstsCars');
...
var cstsList = new TunesList({}, cstsNode);
var dataCSTS = new RequestMemory({ target: require.toUrl('./dataCSTS.json') });
...
dataCSTS.fetch().then(function (cars) {
cstsCars = arrayUtil.map(cars, pickField('Description'));
cstsCars.unshift('All (' + cstsCars.length + ' CSTS Cars' + (cstsCars.length !== 1 ? 's' : '') + ')');
cstsList.renderArray(cstsCars);
});
...
cstsList.on('dgrid-select', function (event) {
var row = event.rows[0];
console.log(row.id); // shows row number. How do I get the real id or other fields?
console.log(row.data); // shows row text that is displayed ("sample text 1")
console.log(row.data.id); // undefined
});
Here is a snippet of sample data like I'm supplying:
[{"id":"221","Description":"sample text 1"},
{"id":"222","Description":"sample text 2"},
{"id":"223","Description":"sample text 3"}]
I'd like to see the id. Instead, row.id returns 1,2 and 3, ie the row numbers (or id dgrid created?).
You haven't really shown a complete example, but given that you're using a store anyway, you'd have a much easier time if you let dgrid manage querying the store for you. If you use dgrid/OnDemandList (or dgrid/List plus dgrid/extensions/Pagination), you can pass your dataCSTS store to the collection property, it will render it all for you, and it will properly pick up your IDs (since Memory, and RequestMemory by extension, default to using id as their identity property).
The most appropriate place to do what you're currently doing prior to renderArray would probably be in the renderRow method if you're just using List, not Grid. (The default in List just returns a div with a text node containing whatever is passed to it; you'll be passing an object, so you'd want to dig out whatever property you actually want to display, first.)
If you want a header row, consider setting showHeader: true and implementing renderHeader. (This is false in List by default, but Grid sets it to true and implements it.)
You might want to check out the Grids and Stores tutorial.
I think the problem might be that I was modeling my code based on the dTunes sample code, which has 3 lists that behave a little differently than a regular grid.
For now, I'm using the cachingStore that is available in the lists. So the way I get the id:
cstsList.on('dgrid-select', function (event) {
var row = event.rows[0];
var id = storeCSTS.cachingStore.data[row.id - 1].id; // -1 because a header was added
console.log(id);
});
I'm not sure whether this will work if I ever try to do sorting.

display related field based on textbox id

I have two textboxes
<div>#Html.TextBoxFor(model=>model.Voyage_ID, new{id="VID"})<br /></div>
<div>#Html.EditorFor(model=>model.Arrived, new { #id = "arrived",})</div>
The first is updated dynamically from json based on the selected index of a dropdownlist. In the same manner, I wish to display the second field (and many more other fields that are) associated with the id captured in VID .
How can I accomplish this?
You can use jQuery .change() method:
$(document).ready(function(){
$('#VID').change(function(){
var currentValue = $(this).val(); //get current value of the input
//here comes your logic
});
})

Html.DropdownListFor troubleshoot

I'm trying to learn the syntax for DropDownListFor.
Given the following in a for loop:
#Html.DropDownListFor(
model => model.SalutationID, Model.AvailableSalutations.Select(option => new SelectListItem
{
Selected = (option.ID == staff.SalutationID),
Text = option.Desc.ToString(),
Value = option.ID.ToString()
}
),
"Choose...")
... and given that staff.SalutationID does echo correct values (when, for example, I just use #Html.ValueFor(model => staff.SalutationID)), why does every dropdown echoed in my loop default to "Choose..." and not the Selected option?
What decides what is the selected option in the drop down list is the value of the model property specified by the lambda in the first parameter in the Html.DropDownListFor. In your case model => model.SalutationID.
Verify that model.SalutationID has the expected value in the model. If not, specify it in the controller's action, before rendering the view.

Not able to populate combo box label IN EXTJS

I am using Extjs 4.2 and I have a combo box field on my page. When I am updating this page, I need to show the selected value in the combo box. If I use static data it will work properly, but when I am loading data from the database then data is coming but it is displaying the value (not the label) for the selected combo box.
I have done the work around by using the select method of the combo box, but I need to iterate the store for getting the selected value. The store value does not start at 1 but starts at 100, and the select method of the combo box uses the index for the list.
Below is the code you can check, but this is not working for multiple combo boxes.
var specilizationComboBox = Ext.getCmp("doctorMasterVO.specilizationFkId");
var specilizationValue = 0;
specilizationStore.each(function (record) {
if (record.get('value') != dataRead.dataVO.doctorMasterVO.specilizationFkId) {
specilizationValue = specilizationValue + 1;
}
else {
return false;
}
});
specilizationComboBox.select(specilizationComboBox.store.data.items[specilizationValue]);
Please tell me there is any other way to do this because iterating over the whole store is not a good idea.
Check out these methods:
find
findBy
findRecord
findExact
Basicly what you want to do is something like this:
var myId = dataRead.dataVO.doctorMasterVO.specilizationFkId;
var record = store.findRecord("id", myId);
specilizationComboBox.select(record);
Where "id" is the name of the field you are trying to find a match for in your store.
Note that myRecord could be null if the record is not there or if the store is not properly loaded.
To make sure the store is loaded you could execute the code above in a load handler:
specilizationComboBox.getStore().load({
scope: this,
callback: function(records, operation, success) {
//code goes here
}
});
If you are not sure if the store has loaded you could check the getCount method.