Getting _query error while using KendoGrid and Kendo Chart - kendo-ui

We are getting following error while page load for the first time when we are using kendoGrid and KendoChart.
‘Object doesn't support property or method '_query' in kendo.data.min.js file'
Can anyone tell whats the reason behind this?

Make sure you use jquery.min.js & kendo.web.min.js files. This might do the magic, if not let me know further requirement.

Related

Triggering Ajax onchange on a select list

I am working on a Drupal project which is using the Editable fields module.
Using that module I'm exposing a dropdown list of text options. It works just great. You click on the list, select an option and the option is updated via Ajax.
My challenge is I'm trying to change the options programmatically via jQuery. Using the following code:
jQuery('select#edit-field-status-0-field-status-und').val(1);
... my browser console area is happy with the code but the Ajax update does not take place.
I tried:
jQuery('select#edit-field-status-0-field-status-und').val(1).change();
Again no errors but the Ajax event still did not execute.
$('#edit-field-status-0-field-status-und').val("1");
will do the trick, as the only reason it wouldn't work would be that you have your select values as strings instead of numbers.
Alternatively the following is more detailed:
$('#edit-field-status-0-field-status-und option').eq(1).prop('selected', true);
Also this is not an 'AJAX' function, it's simply Jquery updating the DOM for the particular element.
The code I was using as recreated below was correct:
jQuery('select#edit-field-status-0-field-status-und').val(1).change();
I found out the reason why it wasn't working was because the ID of the target element changed dynamically.
So when I first inspected and found edit-field-status-0-field-status-und, the same element would change IDs to something like edit-field-status-0-field-status-und--1.
That was throwing things off and gave the impression my code wasn't working.
Thanks to #gts for your input.

Wicket replacing panel with ajax fails with MarkupNotFoundException

the page markup has
<div wicket:id="stepPanel" />
tag in it and when the page is first loaded it works great that is
add(new MyFirstPanel("stepPanel"));
works fine. But then when I trigger an Ajax event and request redrawing
addOrReplace(new MySecondPanel("stepPanel"));
target.add(MyPage.this);
i get the following error
Last cause: Failed to find markup file associated. MyFirstPanel: [MyFirstPanel [Component id = stepPanel]]
please note that it tries to find the wrong markup (should look for markup for MySecondPanel) and it fails regardless it succedded to do so before!
I instantiate panels using reflection, but could it be a problem here? No exceptions thrown.
Anwser:
Actually it was something else - I have noticed that one of my AjaxSubmitLinks had reference to a form that was no longer placed in a markup... so whatever you do just remember not to leave that reference.
You are adding MyPage after replacing the Panel causing MyPage to re-render.
There is a good example on how to replace panels here.
Yes you can call panels via reflection. I don't clearly know what you are trying to do with event here but if you want you can attach your panel with AjaxSelfUpdatingTimerBehavior and define the duration which will update this component in the given time period.
Hope its useful.

kendo grid works fine when javaScript alert exist but not working without javaScript alert

When I add a new row kendo ui grid it does not move to next page even I set page number dynamically.
But when there is a javaScrip alert it's working fine.
Has any one faced this issue before. Please suggest me a solution.
Thank you.
The problem is that when you add a new row there are a series of actions that happen in parallel and they are not immediate. If you try to move to the end but the row still is being created, if fails.
When you add an alert, you delay the fact of moving and creation now have time.
If you really need to do it, you can add a timeout (delay) it is not nice/clean but should work.
Do something like:
setTimeout(function() {
grid.page(3);
}, 500);
for introducing half second (500 ms) delay, should be enough.
We had sort of similar issue in IE - onchange fired twice with alert in the event handler. According to what you saying, it sounds like when the alert is NOT in you are getting correct behaviour. Review your code without having the alert in or post a fiddle. Below is an answer from Kendo support in regards to alerts while debugging. Do not use alerts with kendo to stay safe.
Basically this behavior is caused by using "alert" method for debugging purposes - please note that this is not recommended because it can lead to unexpected behavior when interacting with focusing elements. After replacing the "alert" method and with "debbuger" command or "console.log()" function the change event is working as expected - please check this screencast(http://screencast.com/t/7qIAdK6hZ5kD).
Hope it helps.

kendoui validation tooltip in custom popup editor not positioning correctly

Please see jsfiddle for example, blank out First Name field to have validation tooltip show. In a normal form the validation tooltip positions correctly to the right of each element. But in the popup editor for the grid it still trying to position the tooltip below the element as if it where editing inline. I have tried <span class="k-invalid-msg" data-for="FirstName"></span>but it doesn't change anything. Is there a setting I am missing to get this working in popupeditor? I guess I could manually modify the .k-tooltip but I am hoping for something more built in that handles the positioning correctly, because I am not very good at css.
As you've discovered, the error template for the grid is different to that provided by the kendo validator when applied to standard inputs.
Unfortunately, the validator that is created internally by the grid does not pass along any errorTemplate that you might define in the options object and by the time the "edit" event fires, the validator has already been created and the error template compiled, hence why setting the errorTemplate in the manner you describe does not work. Really, I think the Kendo grid should respect any user defined errorTemplate option but until it does we have to hack a little bit.
The key is to define a custom template and to apply it in the edit event, but instead of using the options object, set the private instance directly. Not ideal, but it works:
edit: function (e) {
e.sender.editable.validatable._errorTemplate =
kendo.template($('#tooltip-template').html());
}
See this updated fiddle for an example of what I think you might be looking to achieve.
http://jsfiddle.net/nukefusion/eQ2j7/10/
(I would post this as a comment but not enough reputation yet...)
I'm successfully using nukefusion's solution. I, too, fought with the syntax error from jQuery for a long time and discovered through debugging that how you define the template is important. In particular, it appears that the template has to be written on a single line without any formatting, as in:
<script id="tooltip-template" type="text/x-kendo-template"><span class="k-widget k-tooltip k-tooltip-validation"><span class="k-icon k-warning"></span>#=message#</span></script>
If you try to make it "pretty" and format the html in the template, you get the syntax error. I don't know where the real bug is, as this sort of thing shouldn't cause an error. But it does and I stopped worrying about it once I got it to work correctly.

Telerik MVC Grid paging error

I'm using the telerik mvc grid which shows up fine with the proper css classes applied and has data in it but the paging doesn't seem to work... When I click on the one of the page numbers at the bottom of the grid it throws this error:
The method 'Skip' is only supported for sorted input in LINQ to Entities. The method 'OrderBy' must be called before the method 'Skip'
I realized that I didn't have the scripts registered so I put them in:
#Html.Telerik().ScriptRegistrar.DefaultGroup(Sub(groups)
groups.Add("~/Scripts/2011.2.712/telerik.common.min.js")
groups.Add("~/Scripts/2011.2.712/telerik.grid.min.js")
End Sub)
Also tried:
#Html.telerik().ScriptRegistrar()
When it tries to register these scripts it complains that it cannont find telerik.common.js. I looked in the telerik folder (program files) where I got the script files originally and there is no telerik.common.js only the min version of it...
Any advice would be greatly appreciated!
Try to add it this way (without .min. )
group.Add("telerik.common.js").
Telerik ScriptRegistrar automatically converts it to "telerik.common.min.js"

Resources