add snippets dynamically to the editor toolbar kendo - kendo-ui

I want to add snippets dynamically to the editor toolbar kendo ui
I use this code
#(Html.Kendo().Editor()
.Name("textarea_question")
.HtmlAttributes(new { #class = "span5", style = "height:10px;" })
.Tools(tools => tools.Clear()
.Bold().Italic().Underline()
.Formatting()
.JustifyLeft()
.JustifyCenter()
.JustifyRight()
.JustifyFull()
.Snippets(s =>
{
foreach (var item in Model.pipingText)
{
s.Add(item.Name, item.Name);
}
})
)
)
But it has error
Failed to load resource: the server responded with a status of 500 (Internal Server Error)
help me please!!!

Probably somethings is wrong with these values that you get out of the pipingText collection, because rest of the code looks fine. Probably you should use the type collection instead of using var.
What exactly is the exception of that 500 status. Give more info about the exception.

Related

Kendo Splitter Nesting with Treeview

I am getting the error:
Delegate 'System.Action' does not take 1 arguments
While creating a Splitter with Partial view rendered inside one of the panes of Splitter. The error is at Content property of the the pane. Please suggest me any changes to solve the problem
#(Html.Kendo().Splitter()
.Name("vertical")
.HtmlAttributes(new { style = "height:900px" })
.Orientation(SplitterOrientation.Horizontal)
.Panes(panes =>
{
panes.Add()
.HtmlAttributes(new { id = "pane1" })
.Resizable(true)
.Size("300px")
.Collapsible(false)
.Content((#<text><div>#Html.RenderPartial("GetUsers", Model)</div></text>));
})
)
with the information from the following link I am able solve my problem. When you have to nest container controls of kendo UI you need to create a helper method for nested content and call the helper method as cotent for container control.
Kendo widgets two level deep in Razor, inline markup blocks cannot be nested

Kendo Grid - PopUp windows not being removed from the DOM

I have a kendo grid with a custom popup:
columns.Command(commands =>
{
commands.Edit();
}
.Editable(editing => editing.Mode(Kendo.Mvc.UI.GridEditMode.PopUp))
Each time I click the edit button the window pops up but when I close it the window is not removed from the DOM.
I saw this post: http://www.telerik.com/forums/popup-windows-do-not-get-removed-from-dom and Telerik says the issue has been fixed.
What are some things that would cause this behavior?
UPDATED
This grid is nested in a Kendo TabStrip if that helps. Other than that I don't see anything out of the ordinary. The popup is entirely managed by the grid.
UPDATED 2
So I got the un-minimized code for the grid (kendo.grid.min.js, version 2013.3.1119, starting at line 1172), slopped it into my project and modified just the following with the two log statements to verify that destroy is being bound and called:
_destroyEditable: function () {
var that = this;
var destroy = function () {
if (that.editable) {
// My edit
console.log("...destroy() called");
that._detachModelChange();
that.editable.destroy();
that.editable = null;
that._editContainer = null;
}
};
if (that.editable) {
if (that._editMode() === "popup") {
// My edit
console.log("Binding destroy() to 'deactivate'...");
that._editContainer.data("kendoWindow").bind("deactivate", destroy).close();
} else {
destroy();
}
}
},
Each time I click edit and then close the window I see the expected two messages yet the window is not removed. Here is a screenshot of the debugger:
The outlined windows are the dom elements generated.
After much trial and error and deep diving it turns out this problem has to do with our scripts in our site's layout. At some point whomever setup the kendo scripts put in not only the 'kendo.all.min.js' but right after it 'kendo.web.min.js', 'kendo.aspnetmvc.min.js' and then about 10 individual kendo.*.js including the grid.
After viewing this link:
http://docs.telerik.com/kendo-ui/getting-started/javascript-dependencies
I realized that the site is creating these objects multiple times. Removing the script references in accordance to the link above resolves the issue.

Kendo ComboBox Change event Value method is not supported

I have a Kendo ComboBox in an EditorTemplate: it looks like this:
#(Html.Kendo().ComboBox()
.HtmlAttributes(new { style = "font-size:10px; background-color: #f4f4f4;" })
.Name("myBox" )
.Placeholder("Choose a value...")
.DataTextField("Name")
.DataValueField("Value")
.DataSource( source =>
{
source.Read( read => read.Action( "GetItems", "MyBoxController" ) )
.Events( e => e.Change( "ComboBoxChanged" ) );
} )
)
The ComboBoxChanged function couldn't be simpler:
function ComboBoxChanged(e) {
var value = this.value();
}
but, as the template comes up, it throws an error, "Object doesn't support property or method 'value'". [This indicates to me that, at least the data-binding is working, causing some item in the ComboBox to be selected.] What am I missing? This looks just like all the examples to me, except, as I said, I'm in an EditorTemplate, rather than a main View.
The ComboBoxChanged should be wired to the ComboBox Events, not the ComboBox DataSource Events.

Kendo Binding to DataTable with additional custom column

Someone pointed me to Kendo Bind to Data Table, which has this code in the grid builder:
.Columns(columns =>
{
foreach (System.Data.DataColumn column in Model.Columns)
{
columns.Bound(column.ColumnName);
}
})
This works, but I also want to add an "edit" column, so I added this line before the foreach:
columns.Command(command => command.Edit().Text("Edit").UpdateText("Submit")).Width(70).HtmlAttributes(new { style = "text-align: right;" });
which throws "Templates can be used only with field access, property access, single-dimension array index, or single-parameter custom indexer expressions."
How can I add an Edit column?
As it turns out, "How can I add an Edit column?" is the wrong question. There is nothing wrong with the code to add the Edit command; however, adding it surfaced the problem that was reported. In other words, the "Template" in the error message is the Edit template which doesn't know what column in the DataTable to use for its Id.
When defining the DataSource for the grid, I had this code:
.Model(model =>
{
foreach (System.Data.DataColumn column in Model.Columns)
{
model.Field(column.ColumnName, column.DataType);
}
})
as defined in a sample in a Telerik support forum. This was OK for simply displaying the data in a grid, but when I introduced the idea of Editing, it then mattered that there was no Model.Id. The question then became, how do I define an Id when the Model is a DataTable. That is a separate question, which I have posted here.

JQuery UI Tabs - loading tab with AJAX is 'breaking' a plugin

I have page that creates a table: http://gupii.co.uk/rap/weekTable.php and I'm using a plugin to add a filter functionality: _http://gupii.co.uk/rap/js/mylibs/tablefilter.js
In weekTable.php:
var theTable = $('#weekTable')
$("#filter").keyup(function() {
$.uiTableFilter( theTable, this.value );
})
This works fine when your directly on the weekTable page, but when I load the page into a JQueryUI tab and try and use the filter I get this error:
Uncaught TypeError: Object function ( selector, context ) {
// The jQuery object is actually just the init constructor 'enhanced'
return new jQuery.fn.init( selector, context );
} has no method 'uiTableFilter'
Whats going on here, why am I getting this error?
The page I'm trying to load into is _http://gupii.co.uk/rap/guilda.php (tab:This Week) if it helps
(apologies for posting more links than I should but I thought it would be helpful in diagnosing the problem)
Try this:
$("#filter").live("keyup", function() {
...
http://api.jquery.com/live/

Resources