Drop down list not refreshed - asp.net-mvc-3

I have one master and child record tables.. After creating master record, try to create its child group with out refreshing the screen, the filed named 'parent' drop down list wont show the one which we created initially. The drop downs will show the field 'parent' which we created initially only after refreshing the screen.
The code that i have added in controller for creating dropdown list as..
public JsonResult GetGroups()
{
var activitygroup = db.ActivityGroup
.Select(c => new
{
DisplayText = c.ActvityGroupCode + " - " + c.ActvityGroupName,
Value = c.ActvityGroupId
})
.OrderBy(c => c.DisplayText).ToList();
return Json(new { Result = "OK", Options = activitygroup });
}
in view
ParentGroupId:{
Weightage : 1,
title: 'Parent Group',
type: 'combobox',
optionsSorting: 'text',
options : '#Url.Action("GetGroups")'
//call the action to populate combo box,with id and display name
}
Note: Datas are populated from jtable
please give solution for this .. ie populates data in dropdown without page refresh.
I have 2 fields parent and sub the sub is a textbox field the data that i added in sub field get populated in parent field without any page refresh. this is the short description for this.

Related

Kendo UI - Tree List on rebind lost exapnd and collapse functionality

I am using a Kendo UI in angular Js and binded my TreeList with Json, where I have set my parent and child properties as given.
schema: {
model: {
id: "Id",
fields: {
parentId: { field: "ParentId", nullable: true }
}
}
}
And then I have a filter function on a button click which gets the required data from the json.
$scope.getFilteredData = function (id) {
var filterData = _.filter($scope.bookSource, (item) => { return item.BookId == id; });
if (filterData.length > 0) {
$scope.filteredDataSource = filterData;
$scope.ktlBookTreeList.setDataSource({
data: $scope.filteredDataSource
});
}
}
Although the data I get after the filter is correct , I dont have the expand collapse function any more. In one of the result set I got the parent record and two child records, even then the tree displayed it as separate rows, rather than with in the Expanded / collapsed rows.
Can you please guide me to understand what I am doing wrong here..
Probably you have to add the parent child model again, when you are resetting the data source.

ExtJS Menu parameter to pass

I am creating an ExtJS MVC application with a dynamic menu. I have several menu elements which will call the same screen (set an active card in a layout) but need to pass a different value in as a parameter each time. So that one card can display different data depending on the parameter which will act as a filter.
my menu elements have a click listener:
listeners: {
itemclick: function(view, record, item, index, e){
Ext.getCmp('contentpanel').layout.setActiveItem(record.getId());
}
}
the record Id will be the card I am setting as active.
How can I pass along a parameter to the card?
You could just add another attribute to the Panel if you want. For example:
Ext.define('YourApp.view.YourCardPanel' ,{
extend: 'Ext.panel.Panel',
id: 'contentpanel',
alias : 'widget.yourcardpanel',
layout: 'card',
newParam: null, // Just to know that this attribute exists but there is no need to declare it.
items: [],
changeLayout: function(){
if (this.newParam == 'new value') {
// Do your stuff
}
}
});
And then you could change the value of that parameter.
listeners: {
itemclick: function(view, record, item, index, e){
var cardPanel = Ext.getCmp('contentpanel');
cardPanel.newParam = 'new value';
cardPanel.changeLayout();
cardPanel.layout.setActiveItem(record.getId());
}
}

MVC 3 Bind Model property to 2 fields (e.g. Other Title)

I'm trying to achieve a very common scenario whereas given a list of options to choose from, the last one says "Other" and when selected the user is presented with the input field to specify what "other" is.
In my case, it's a list of Person's titles:
public List<string> TitleList
{
get
{
return new List<string> { "Mr", "Mrs", "Miss", "Dr", "Other" };
}
}
and what I'm trying to do is this:
#Html.DropDownListFor(m => m.Title, new SelectList(Model.TitleList), "Please select...") #Html.TextBoxFor(m => m.Title)
I want the model to bind the TextBox value when "Other" is selected in the DropDownLis, and bind to selected item in DropDownList in all other cases.
Is this achievable without adding an extra property on the Model?
a better solution is not to bind to two fields, instead, copy selected item from a drop-down into bound textbox with some clever javascript:
#Html.DropDownList("ddlTitle", new SelectList(Model.TitleList), "Please select")
#Html.TextBoxFor(m => m.Title, new { maxLength = 10 })
Javascript:
ToggleTitleFields = function () {
var title, txtTitle;
title = $('select#ddlTitle').val();
txtTitle = $('input#Title');
if (title === "Other") {
txtTitle.val("");
txtTitle.show();
return txtTitle.focus();
} else {
txtTitle.hide();
txtTitle.val(title);
return $('span[data-valmsg-for="Title"]').empty();
}
};
$(document).on("change", "select#ddlTitle", function(e) {
return ToggleTitleFields();
});
hope this helps somebody
found a client-side solution: add/remove the "name" attribute from DropDownList. Here's my coffee script:
ToggleTitleFields = () ->
if $('select#Title').val() == "Other"
$('select#Title').removeAttr('name')
else
$('select#Title').attr('name','Title')
Tsar,
Being honest, this isn't a scenario that I've had to deal with before, but is nonetheless a good one. If I were faced with this dilemma and was allowed to use a javascript solution, i'd present a previously 'hidden' textbox when other was chosen. The user would then have to enter the new value into this texbox, which on loosing focus would populate the selectlist and be selected. Then when the form was submitted, you'd have this new value still as part of the exisiting model.
Of course, you could also do a similar logic of showing the textbox when selecting other but this time, do a little logic on the httpost controller action to determine if the 'other' item was selected and then populate the model from the 'textbox' value.
Of course, both scenarios would need a heap of validation, but in principle, either approach would 'work'

how to display text and bind to primary key in MVC 3 comboboxfor

In MVC3 app, how to display the text (say product name) but at the same time bind the value to its primary key (say product id). here is my html combo box
#(Html.Telerik().ComboBoxFor(model => model.ProductId)
.AutoFill(true)
.HighlightFirstMatch(true)
.DataBinding(binding => binding.Ajax().Select("GetProductsyKeyword", "Product")))
and the method GetProductsyKeyword returns:
return new JsonResult { Data = new SelectList(Products, "Id", "Description") };
The above code is ok for a newly created product but not when load and display the data from database as the combo box has no idea how to display the text. please help!

how to load a partial view on button click in mvc3

I have a DDL, on its change I load a partial view _GetX. Right now I am using it like this
#Html.DropDownListFor(model => model.XId, Model.XList, "Select", new { GetUrl = Url.Action("GetX", "Route") })
I need to load this partial view on clicking a button. How do I do this?
Assuming your GetX controller action already returns the partial view:
$(function() {
$('#someButton').click(function() {
// get the DDL. It would be better to add an id to it
var ddl = $('#XId');
// get the url from the ddl
var url = ddl.attr('GetUrl');
// get the selected value of the ddl to send it to the action as well
var selectedValue = ddl.val();
// send an AJAX request to the controller action passing the currently
// selected value of the DDL and store the results into
// some content placeholder
$('#somePlaceholder').load(url, { value: selectedValue });
return false;
});
});

Resources