sebfz1 / wicket-jquery-ui

jQuery UI & Kendo UI integration in Wicket
http://www.7thweb.net/wicket-jquery-ui/
Other
92 stars 58 forks source link

wicket kendo datatable missing kendo.all.min.js #318

Closed shilan closed 4 years ago

shilan commented 4 years ago

Hi, I am using kendo wicket 8 datatable when I get this error: ?1:50 Uncaught TypeError: jQuery(...).kendoGrid is not a function at HTMLDocument. (?1:50) at i (jquery-2.2.4-ver-F9EE266EF993962AD59E804AD9DEBE66.js:2) at Object.fireWith [as resolveWith] (jquery-2.2.4-ver-F9EE266EF993962AD59E804AD9DEBE66.js:2) at Function.ready (jquery-2.2.4-ver-F9EE266EF993962AD59E804AD9DEBE66.js:2) at HTMLDocument.J (jquery-2.2.4-ver-F9EE266EF993962AD59E804AD9DEBE66.js:2)

I included the kendo.all.min.js file in my base page and then it start working locally. However when I deployed the application on the server, I got the same error plus the following: Uncaught SyntaxError: Invalid or unexpected token when I look at the kendo.all.min.js the red marked part is here: <Relationships xmlns="http: followed by a line break })+"\n "+d(i,function(e){return'<Override PartName="/xl/drawings

First of all, why do I need to add this kendo.all.min to get this datatable work? It wasn't required when I was working with wicket kendo datepickers.

Second why I cannot download or point to kendo.all.js instead of minimized version to find out what is the error properly?

Third, why then it works locally and not on the server?

I am totally confused and unhappy that I have to change my entire datatable library now that I have to deploy it to some real servers...

For the record I have added these two dependencies: `

com.googlecode.wicket-jquery-ui
        <artifactId>wicket-kendo-ui</artifactId>
        <version>8.6.0</version>
    </dependency>

com.googlecode.wicket-jquery-ui wicket-kendo-ui-theme-default 8.0.0 `
sebfz1 commented 4 years ago

Hi, kendo.all.min.js is the library for Kendo UI professional. Therefore it is not embedded in wicket-kendo-ui, only the core version (which is free) is bundled. To get kendo-ui all, you can point to the cdn, or if you want to bundle it in your deployment, download it from the cdn and add it to the resources (if your server disallow to connect outside for instance). You have to change the dependency in Application to use it instead of core. Look at the wiki, I think there is something about it. (And it the link should also be present from the demo site). Otherwise I will give you the snippet tomorrow, please let me know. Using the downloaded "all" from the cdn, ie without a license, means you are supposed for evaluation purpose....

shilan commented 4 years ago

Yes, hot links are not allowed in our company. Therefore I downloaded the file and added it to my resources, worked locally but then on the server it just breaks in different lines. No matter if I copy paste it or right click download it. I think I should move on to another component... it is just annoying.

you mean in this link? https://docs.telerik.com/kendo-ui/intro/installation/cdn-service

Thanks for the clarification, I was so confused.

shilan commented 4 years ago

By the way you mean I should be able to make java dependency out of a js file? Interesting! I have never done that. @sebfz1 can you please create me that snippet?

shilan commented 4 years ago

here is the error I get now on the server:

kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:37 Uncaught TypeError: d.ui.validator.validateOnInit is not a function at init._validateOnInit (kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:37) at new init (kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:37) at init.refresh (kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:54) at new init (kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:54) at init._createInlineEditor (kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:59) at init.editRow (kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:59) at init._editModel (kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:60) at init.addRow (kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:60) at HTMLAnchorElement. (kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:60) at HTMLDivElement.dispatch (jquery-2.2.4-ver-F9EE266EF993962AD59E804AD9DEBE66.js:3) _validateOnInit @ kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:37 init @ kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:37 refresh @ kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:54 init @ kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:54 _createInlineEditor @ kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:59 editRow @ kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:59 _editModel @ kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:60 addRow @ kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:60 (anonymous) @ kendo.all.min-ver-3951272565EE98A0F16D741D018A70B8.js:60 dispatch @ jquery-2.2.4-ver-F9EE266EF993962AD59E804AD9DEBE66.js:3 r.handle @ jquery-2.2.4-ver-F9EE266EF993962AD59E804AD9DEBE66.js:3

sebfz1 commented 4 years ago

you mean in this link? https://docs.telerik.com/kendo-ui/intro/installation/cdn-service

Yes. Additionally you can download the .map file (just append .map). This way you can see the code in the browser dev tool.

Also, be sure the kendo ui version matches the version of wicket-kendo-ui, otherwise you might expect display issues if you are using a theme dependency (wicket-kendo-ui-theme-xxxx).

The latest version in the Wicket 8.x.x series is 8.8.0 and is aimed for kendo-ui 2020.2.513

Then, copy the files (kendo.all.min.js and kendo.all.min.js.map) to the resources folder, in the same "package" (ie sub-folder) than this class that you will create:

import org.apache.wicket.request.resource.ResourceReference;
import org.apache.wicket.resource.JQueryPluginResourceReference;

/**
 * Provides the {@link ResourceReference} for the Kendo UI (all) library.
 */
public class KendoAllResourceReference extends JQueryPluginResourceReference
{
    private static final long serialVersionUID = 1L;

    private static final KendoAllResourceReference INSTANCE = new KendoAllResourceReference();

    /**
     * Private constructor
     */
    private KendoAllResourceReference()
    {
        super(KendoAllResourceReference.class, "kendo.all.min.js"); // eg: http://kendo.cdn.telerik.com/2017.2.504/js/kendo.all.min.js
    }

    /**
     * Gets the instance of the resource reference
     *
     * @return the single instance of the resource reference
     */
    public static KendoAllResourceReference get()
    {
        return INSTANCE;
    }
}

When you have this class, use it at the resource reference for kendo ui, in YourApplication#init

        KendoUILibrarySettings settings = KendoUILibrarySettings.get();
        settings.setJavaScriptReference(KendoAllResourceReference.get());

That's it. You should not have any references in your html file/template because you cannot control the loading priorities. That's also might explain why it does not work properly....

shilan commented 4 years ago

Thanks a lot. It actually solved the problem My versions were compatible with your suggestion but I was referring to the js in my base page not in my application#init which might have caused the problem.

But before closing this issue, do you think that including kendo.all.min.js maycause license problems? Because I am actually writing this code for a finance company in europe. I just need to know the odds if it is legal or not.

sebfz1 commented 4 years ago

Hi, you better have to read the license terms for kendo ui professional on their website. Downloading and use it is legal, but is aimed for evaluation purpose. If the application you are writing is a commercial product then you should acquire a license for sure. If it is an internal application, then you should ask the company and their legal team for their advise...

shilan commented 4 years ago

Once again thanks for your help Sebastian. I believe on this note I can close this ticket. :)