Telerik Forums
Kendo UI for jQuery Forum
2 answers
144 views
I see the KendoUI is jQuery based.  I love jQuery, but I am working with Joomla and some Joomla tools (Gantry) that use MooTools.

I would hate to have to include both MooTools and jQuery in the same project.  

Any plans for KendoUI to have a MooTools implementation?
Jeff Kershner
Top achievements
Rank 1
 answered on 05 Sep 2012
3 answers
281 views
Hi,

I have a listview that when an item is clicked an overlay view is displayed. When the overlay is shown I want to be able to change the Navbar title. However this is not working when I use the code listed in the documentation.

The HTML code I have for the overlay is: 

<div data-role="view" data-title="View Title" id="fav-list" data-transition="overlay:up">
    <header data-role="header">
        <div id="fav-list-navbar" data-role="navbar">
            <a class="nav-button" data-align="left" href="#my-favourites" data-transition="overlay:up reverse" data-role="backbutton" >Back</a>
            <span data-role="view-title"></span>
        </div>
    </header>
            
</div>


and the javascript that relates to the listview and the changing of the navbar title: 

function mobileListViewHeadersInit() {
 
        $("#myfavlist").kendoMobileListView({
 
            dataSource: kendo.data.DataSource.create({data: jsonObj, group: "letter" }),
 
            template: $("#myfavlistTemplate").html(),
 
            headerTemplate: "${value}",
 
            fixedHeaders: true,
             
            click: function(e) {
                 
                try {
                $("#fav-list-navbar
"
).data("kendoMobileNavBar").title("Foo");
                }
                catch(ee)
                {
                    alert("Error: " + ee.message);
                }
                 
                window.location = "#fav-list";
                 
                //alert(e.dataItem.name);
            }
 
        });
 
    }

The error message i receive when this is run is: 

'undefined' is not an object. 

However if I use jquery to look up any of the elements, they are accessable

Not sure what to try next.....


Chris
Petyo
Telerik team
 answered on 05 Sep 2012
2 answers
266 views
Hi All,

I am attempting to use Fetch in a change event for a combobox to update another combobox. Read works fine for the 2nd combobox's collection but when using fetch the data object for the second datasource does NOT update.

$("#comboOne").width(180).kendoComboBox({
        autoBind: false,
        dataTextField: "Name",
        dataValueField: "Id",
        dataSource: dsComboOne,
        change: function (e) {
            //dsComboTwo.read();
            dsComboTwo.fetch(function () {
                if (dsComboOne.total() == 0) {
                    //do stuff to DOM
                } else {
                    //do different stuff to DOM
                }
            });

            $("#comboTwo").data("kendoComboBox").value(null);
            $("#comboTwo").data("kendoComboBox").enable(true);
        }
    });


So calling dsComboTwo.read() works as expected. Calling dsComboTwo.fetch() does not actually update the dsComboTwo.data object. When i run a watch and break in the callback i can see the dsComboTwo.data is the same as the previous/initial call.

Is there some other way to do this? Callback on the datasource i am missing? The success: callback in the DS also does not seem to work. No error.. just does not fire. Same with the change: . Can someone clarify this with an example? I've seen variations of this question elsewhere.
N Mackay
Top achievements
Rank 1
 answered on 05 Sep 2012
0 answers
156 views
I have a form within a detail template on each grid row.  I've got the field showing up in the detail template, and I can enter data.  However, when I submit my changes on the grid, the object that is serialized does not have the information that was entered into the detail template form.  Only the information entered into the 'proper' row is present.

Is there a way to easily serialize this detail template form data along with the rest of the row?

View:
@model List<KendoUITestEnvironment.Models.ItemModel>
@using Kendo.Mvc.UI
 
<script id="ItemDetails" type="text/kendo-tmpl">
    <table id="hazmatDetailsTable">
        <tr><td><b>Hazmat</b></td></tr>
        <tr>
            <td><label>Hazmat</label><input>#= HazmatClass #</input></td>
        </tr>
    </table>  
</script>
 
@(Html.Kendo().Grid<KendoUITestEnvironment.Models.ItemModel>()
    .Name("QuoteItemGrid")
    .Columns(columns =>
    {
        columns.Bound(i => i.FreightClass).Width(50);
        columns.Bound(i => i.Length).Width(50);
        columns.Bound(i => i.Width).Width(50);
        columns.Bound(i => i.Height).Width(50);
        columns.Bound(i => i.DimensionUnitOfMeasure).Width(50);
        columns.Bound(i => i.QuantityValue).Width(50);
        columns.Bound(i => i.QuantityUnitOfMeasure).Width(50);
        columns.Bound(i => i.Weight).Width(50);
        columns.Bound(i => i.WeightUnitOfMeasure).Width(50);
        columns.Bound(i => i.NmfcCode).Width(50);
        columns.Bound(i => i.ItemDescription).Width(50);
        columns.Command(command => command.Destroy()).Width(110);
    })
    .ClientDetailTemplateId("ItemDetails")
    .ToolBar(toolbar =>
    {
        toolbar.Create();
        toolbar.Save();
    })
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .Pageable()
    .Sortable()
    .Scrollable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .ServerOperation(false)
        .Events(events => events.Error("QuoteItemGrid_ErrorHandler"))
        .Model(model =>
        {
            model.Id(i => i.ItemID);
            model.Field(i => i.FreightClass);
        })
        .Create(create => create.Action("CreateProducts", "Home"))
        .Read(read => read.Action("GetProducts", "Home"))
        .Update(update => update.Action("UpdateProducts", "Home"))
        .Destroy(destroy => destroy.Action("DeleteProducts", "Home"))
    )
)

Controller:
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult CreateProducts([DataSourceRequest]DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<Models.ItemModel> itemsToAdd)
{
    Models.ShipmentModel shipmentModel = SessionModel;
    var results = new List<Models.ItemModel>();
 
    foreach (Models.ItemModel newItem in itemsToAdd)
    {
 
        if (shipmentModel.ItemModelList.Count > 0)
        {
            var nextID = (from i in shipmentModel.ItemModelList
                          select i.ItemID).Max() + 1;
 
            newItem.ItemID = nextID;
        }
 
        shipmentModel.ItemModelList.Add(newItem);
        results.Add(newItem);
    }
 
    return Json(results.ToDataSourceResult(request, ModelState));
}

Jark Monster
Top achievements
Rank 1
 asked on 05 Sep 2012
2 answers
231 views
I have multiple sliders on one page, meant to update a Radial Gauge using mathematical equations happening in the background as each slider is changed. All is working well.

However, it's been requested that I use the "slide" event instead of "change" to be more visually appealing. I know how to use the "slide" event handler for a single slider, but now I need to use the values for multiple sliders upon each slider's "slide" event.

The problem is that using options.value appears to be one value behind when using multiple sliders, as opposed to when it happens. How can I grab the current values of all sliders INCLUDING the value of the one that's currently being changed? I can only seem to do one or the other, instead of both types of values.

This is what I'm currently using:
function get_sum_prod_2(e) {
    arry_smpr = [0.285811679343038, 0.125446827004167, 0.216179632937688, 0.201202024564389, 0.211742022094242, 0.373720493554278, 0.148421270571020];
    x = 0;
    for(i = 0 ; i < 7 ; i++) {
        x += $("#sldr_" + (i + 1)).data("kendoSlider").options.value * arry_smpr[i];
    }
    console.log(x);
}
Mike
Top achievements
Rank 1
 answered on 05 Sep 2012
1 answer
140 views
Hi,

we are using kendo Charts with Charts. Is it possible to create a tooltip with a hyperlink?

Thanks
best regards
rene
Iliana Dyankova
Telerik team
 answered on 05 Sep 2012
0 answers
49 views
I have kendo trial version, i used kendo auto complete with mvc 3, it is working fine. 

same thing i tried with mvc 4, it is not working and shows error loading page message.

Is kendo supports mvc 4 and can i include any extra js or any other files for mvc 4?

thanks 
Uma
Uma
Top achievements
Rank 1
 asked on 05 Sep 2012
1 answer
72 views
All,

I am able to read, save, update, and delete my kendoGrid just fine.  The issue I have is that on a new form, the line grid is of course empty, so when you click the 'Add New Record', the new row displays and you can enter in data just fine, but the row is only big enough for that one line and so, if there is a validation on a field, you cannot see it, since you're already at the bottom of the grid.

Then if you click 'Add New Record' again, the grid only displays enough room for the one line. You have to then scroll down to see the 1st line. I may be missing something here, but I would think the grid would auto-grow after each newly created record, but it doesn't.

Let's continue with the example above where I created 2 lines. When I save the form data, it gets saved to the db and so when that same form is opened, the grid shows both lines just fine.  Now adding a new record again, will just push the 1st line down and only display a max of 2 lines in the grid. I guess this part is ok.

Is there a way so that when you have an empty grid and click the 'Add New Record' for the first time, there is enough room to display more than just 1 row of data so you can see the validations and so that when users continue to add a new record, they can see all the rows in the grid without having to scroll the grid one row at a time?

Thanks in advance!
K
Ravikiran
Top achievements
Rank 1
 answered on 05 Sep 2012
2 answers
146 views
hi,

I am new to Kendo UI controls. i need to show the content as per my attached image, is window control is suitable for this case or how can i get this type of control, i need to create this app for mobile.

content is coming from web service.

thanks,
Uma
Radu
Top achievements
Rank 1
 answered on 05 Sep 2012
2 answers
130 views
I want to ask you to add support for this type of call to kendo.format:
    kendo.format('{0} - {1}', [3, 5]);
Of course this is not useful if you have the parameters in seperate variables.
But it is useful if you get the format and the parameters from some external source and that delivers the parameters as an array.
It will be a small change in the kendo.format function. I have changed the first line to this:

var values = arguments;
if (arguments.length == 2 && isArray(arguments[1])) {
    values = arguments[1];
    values.unshift(undefined);
}
(Perhaps you have better ideas about the implementation, but this is the idea and works for me now)

Regards, Jaap
Radu
Top achievements
Rank 1
 answered on 05 Sep 2012
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
Application
Map
Drag and Drop
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
MultiColumnComboBox
Chat
DateRangePicker
Dialog
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Effects
Accessibility
PivotGridV2
ScrollView
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Breadcrumb
Collapsible
Localization
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
TimePicker
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
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?