Telerik Forums
Kendo UI for jQuery Forum
2 answers
108 views
Newie, so be kind...

I have 2 models, People and Projects.

People have ID and Name
Project has 4 differenct People references
PM, LD, Client, SME

People db has 500K records so, viewdata is not an option for combo bind.

Editor template is strongly typed to Project

I have the records selected in the combox from People, but canNOT update the Projects model...

On smaller object, 'Status' selection and bind work great using viewdata. 

How do I do this without using the viewdata bind to?

Code snipet:

Can't get it to work:


@(Html.Kendo().ComboBox()
.Name("ProjectManagerID")  --  in Project model
.DataTextField("EmpName") -- in person model
.DataValueField("EmpID")  - in person model
.Filter("contains")
.MinLength(4)
.HtmlAttributes(new { style = "width: 250px" })
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetEmployee", "Employee")
.Data("DonAdditionalData");
})
.ServerFiltering(true);
})
)

Works Great:

@(Html.Kendo().DropDownList()
.Name("StatusID")
.DataTextField("StatudsDesc")
.DataValueField("StatusID")
.BindTo((System.Collections.IEnumerable)ViewData["sType"]))
Michael
Top achievements
Rank 1
 answered on 24 Jun 2013
1 answer
148 views
Hi,

"Disabled" binding is a good for disabling single control, but we are in searching decision for disabling all child controls,  for example like this - http://jsbin.com/ahagiz/11/edit (we put binding in the top "div" element and we want to disable all child elements in this "div"). Guys, can you make advice in implementing this binding?

Best regards, 

Artem
Alexander Valchev
Telerik team
 answered on 24 Jun 2013
5 answers
2.2K+ views
Hi,
I used the customized template to add images on the left side of my list items. that works fine but not fulfilled all I needed. when I select an item from the list , it just shows the text of that item on the input field, however I need both the text and the image. 
I have attached two images of both my target and what I have now.
I appreciate any help on that :-)
Jayesh Goyani
Top achievements
Rank 2
 answered on 24 Jun 2013
1 answer
93 views
See attached.
Alexander Valchev
Telerik team
 answered on 24 Jun 2013
1 answer
135 views
If you have a back button in the header (like in the kendo mobile view demo), follow a link to an external site, then use the back button on the browser to go back to the kendo page, the back button no longer works. I had this happen with links to different sites on different views. Chrome throws the following error when you click the backbutton in the header after coming back from an external link:
Uncaught TypeError: Cannot call method split of undefined kendo.mobile.min.js:13

It looks like the app loses its internal history when you leave and come back. Is there a way to check the history, or have it default to go back to the home view?

I am using version 2013.1.514 of kendo mobile.
Alexander Valchev
Telerik team
 answered on 24 Jun 2013
10 answers
1.1K+ views
Hi,

Is there a way to customize the display of the group header as presented in the aggregates grid demo?

For instance, we would like the header to appear as an aggregated row with grouped data and totals for numeric columns. 
Ideally, the grid would start with all groups closed and look like a summary grid.  Then when the user expanded a group, the detail would look like it is part of the same grid, with the same column headers and positions and sizes (as opposed to the way the hierarchy demo is laid out with separate grids for the details).

Thanks,
Take care,
Ken Rubin
Vladimir Iliev
Telerik team
 answered on 24 Jun 2013
1 answer
718 views
Hello
I am using kendo grid.
in keno grid i want to enable/disable sorting functionality dynamic based on condition. when grid apply grouping to any column then grid sorting disable else sorting enable.

i tried below code but some issue occur
onGridDataboundEvent

   var GroupTable = $(gridName + ' .k-grouping-header').find('div');
                    if (GroupTable.length > 0) {
                    $(gridName).find('TH a').bind('click' , function(){return false;}).css('text-decoration', 'none').css('cursor','default');     

                    }
                    else {
                               $(gridName).find('TH a').bind('click' , function(){return true;}).css('text-decoration',
'underline').css('cursor','pointer');     
                    }

Thanks
Alexander Valchev
Telerik team
 answered on 24 Jun 2013
5 answers
180 views
I have a Grid, with a KendoDataSource that provides the data. That grid has some aggregate data. The entire data sits in a KendoObservableObject  in my VM.

01.vm.SetLayers = function (values) {
02.    //this.LayerTable.data(values);
03.    //this.LayerTable.aggregate = [{ field: "FileCount", aggregate: "count" }];
04.    //this.trigger("change", { field: "LayerTable" });
05.    this.LayerTable = new kendo.data.DataSource({
06.        data: values,
07.        aggregate: [
08.            { field: "FileCount", aggregate: "count" },
09.            { field: "Size", aggregate: "sum" }
10.        ]
11.    });
12.    this.trigger("change", { field: "LayerTable" });
13.};

I have another calculated field in the VM which shows the sum and count:

01.var totalFiles = function () {
02.    return this.LayerTable.aggregates().FileCount.count;
03.};
04.var totalSize = function () {
05.    return this.LayerTable.aggregates().Size.sum;
06.};
07.vm = kendo.observable({
08.    InfoTable: infoTable,
09.    LayerTable: layerTable,
10.    StatsTable: statsTable,
11.    TotalFiles: totalFiles,
12.    TotalSize: totalSize
13.});
I would like have the TotalFiles and TotalSize as column values in another Grid (which is backed by a different VM DataSource. Is this sort of chaining possible?

01.var infoTable = [
02.    { Item: "Status", Value: "Initializing" },
03.    { Item: "XHR2", Value: false },
04.    { Item: "B64", Value: false },
05.    { Item: "PouchDB", value: "" },
06.    { Item: "Center", Value: "xx" },
07.    { Item: "Date", Value: "xx" },
08.    { Item: "Zoom", Value: 0 },
09.    { Item: "Total Files", Value: 0 },
10.    { Item: "Total Size", Value: 0 }
11. 
12.];
Alexander Valchev
Telerik team
 answered on 24 Jun 2013
1 answer
182 views
Hello,

I'm working on styling a stacked bar chart and I want the chart to always take up 100% of it's containers height no matter what the data values are.  I will be binding local json data to this chart so obviously the values will change.    I wasn't sure if there was a way to set the valueAxis max property to do this?  Any help is appreciated!

<!DOCTYPE html>
<head>

<link rel="stylesheet" type="text/css" href="../css/kendo/kendo.common.min.css">
<link rel="stylesheet" type="text/css" href="../css/kendo/kendo.default.min.css">

</head>
<body>


 <div id="example" class="k-content" >
            <div class="chart-wrapper">
                <div id="chart"></div>
             </div>
</div>


<script src="../JavaScriptLib/jquery/main.js"></script> 
<script src="../JavaScriptLib/kendo/kendo.all.min.js"></script>

<script>

function createChart() {
                    $("#chart").kendoChart({
chartArea: {
background:"",
height:180,
width:70
},

                      legend: {
                            visible: false,

},
                        seriesDefaults: {
                            type: "column",
stack: true,
gap:0
},

series: [{
name: "Interest",
                            stack: "Mortgage",
                            data: [494.50],
color: "#f58025"
                        }, {
                            name: "Taxes",
                            stack: "Mortgage",
                            data: [375],
color: "#f58025"
                        }, {
                            name: "Principle",
                            stack: "Mortgage",
                            data: [269],
color: "#f58025"
                        }, {
                            name: "PMI",
                            stack: "Mortgage",
                            data: [200],
color: "#f58025"
                        }, {
                            name: "Rollover",
                            stack: "Mortgage",
                            data: [75],
color: "#f58025"
                      
                         }, {
                            name: "Insurance",
                            stack: "Mortgage",
                            data: [50],
color: "#f58025"
}],

              
                        valueAxis: {
max:1450,
color:"#ff0000",


labels:{
color:""
},

labels:{
visible:false
},
                            line: {
                                visible: false
                            },
majorGridLines: {
                                visible: false
                            },

                        },
                        categoryAxis: {
color:"",
majorGridLines: {
                                visible: false
                            }
},
                        tooltip: {
                            visible: true,
                            template: "#= series.name #: #= ['$']+value #"
                        }
                    });
                }



$(document).ready(function(){
$('#LoanActivityTable').dataTable();

setTimeout(function() {
                        // Initialize the chart with a delay to make sure
                        // the initial animation is visible
                        createChart();



                        $("#example").bind("kendo:skinChange", function(e) {
                            chart.options.series[0].color = chart.options.series[0].data[0].color;
createChart();
                        });
                    }, 400);

});

</script>
</body>
</html>
Iliana Dyankova
Telerik team
 answered on 24 Jun 2013
3 answers
648 views
Hi,

I currently am using the MVC wrapper extensions to create a TreeView from my models. I would like to pass some data from the model to the template so that I can display it alongside the text upon click.
Here is my TreeView:
@(Html.Kendo().TreeView()
    .Name("s-list-event-container")
    .HtmlAttributes(new { @class = "s-list-container", style = "color: white" })
    .Events(events => events
        .Select("preventSelect")
    )
    .TemplateId("template-list-event")
    .BindTo(Model.ToList(), mapping => mapping
        .For<ArdentMC.Sentry.Data.Event>(binding => binding
            .Children(e => e.EventObjects)
                .ItemDataBound((item, e) =>
                {
                    item.Id = e.EventID.ToString();
                    item.Text = e.Name;
                    // Here's where I'd like to add a description. The line below runs but appears to do nothing.
                    item.HtmlAttributes.Add("data-description", e.Description);
                })
        )
        .For<ArdentMC.Sentry.Data.EventObject>(binding => binding
            .Children(o => o.EventObjects)
                .ItemDataBound((item, o) =>
                {
                    item.Id = o.EventObjectID.ToString();
                    item.Text = o.Name;
                })
        )
    )
)
Thanks for any help,
Jeff
Petur Subev
Telerik team
 answered on 24 Jun 2013
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Drag and Drop
Application
Map
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
Filter
SPA
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
Chat
MultiColumnComboBox
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
PivotGridV2
Licensing
ScrollView
Switch
TextArea
BulletChart
QRCode
ResponsivePanel
Wizard
CheckBoxGroup
Localization
Barcode
Breadcrumb
Collapsible
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
TimePicker
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
SmartPasteButton
PromptBox
SegmentedControl
+? more
Top users last month
Hiba
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Max
Top achievements
Rank 1
Veteran
Iron
Alina
Top achievements
Rank 1
Rakhee
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Hiba
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Max
Top achievements
Rank 1
Veteran
Iron
Alina
Top achievements
Rank 1
Rakhee
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?