jqx tabs typeerror '[c] is not a function'

[tspeevackParticipant]

Just starting with jqwidgets and angular and added jqxTabs to a mostly empty project and am getting:

MainPanelComponent.html:2 ERROR TypeError: a(...)[c] is not a function
    at Object.createInstance (eval at webpackJsonp.../../../../script-loader/addScript.js.module.exports (addScript.js:9), <anonymous>:8:18094)
    at jqxTabsComponent.webpackJsonp.../../../../jqwidgets-framework/jqwidgets-ts/angular_jqxtabs.ts.jqxTabsComponent.createComponent (angular_jqxtabs.ts:120)
    at jqxTabsComponent.webpackJsonp.../../../../jqwidgets-framework/jqwidgets-ts/angular_jqxtabs.ts.jqxTabsComponent.ngOnInit (angular_jqxtabs.ts:57)

My app.modules.ts file contains:
import { jqxTabsComponent } from 'jqwidgets-framework/jqwidgets-ts/angular_jqxtabs';
(declarations contains jqxTabsComponent)

My component html contains:

<jqxTabs #tabsReference  [position]='"top"' >
  <ul>
    <li>TMS Object</li>
    <li>TMS Media Module</li>
    <li>DAM Assets</li>
  </ul>
  <div>TMS Object here</div>
  <div>TMS Media Module here</div>
  <div>DAM Assets here</div>
</jqxTabs>

The component .ts file contains nothing specific to the tabs (just trying to get the static data to work right now).

Any ideas on why that’s happening?

[Ivo ZhulevParticipant]

Hi tspeevack,

Have you included the needed jQWidgets core files? jqxcore.js jqxtabs.js?

Regards,
Ivo

[tspeevackParticipant]

I think I have… I’m running this through vs code & my environment was built using create-jqwidgets-angular-app. I have a jqxList on one component that is working properly. While trying to debug this I changed the js reference in my index.html to:
<script type=”text/javascript” src=”https://www.jqwidgets.com/public/jqwidgets/jqx-all.js”></script>
so I would assume that would cover any include requirements?

I swapped in jqxRatingComponent, just to see if it was specific to tabs, but got the same error. I’m sure it’s an environment/setup error, but am confused as to why the list box works, but other components don’t.

[Ivo ZhulevParticipant]

Hi tspeevack,

Can you share your project(without the node_modules folder)?

Regards,
Ivo

[tspeevackParticipant]

I created a new app from scratch using create-jqwidgets-angular-app, then added a component that included jqxRatingComponent, same error.
Code is available here: https://drive.google.com/drive/folders/0B861tx2cEDEBOVJZRnNZSklURkk?usp=sharing
Let me know if that link doesn’t work.
Tim

[Ivo ZhulevParticipant]

Hi tspeevack,

As I suspected you are not including the jQWidgets core files. In your example, you are using the jqxRating component, but you have not included the jqxrating.js file. It can be included in many ways but in create-jqwidgets-angular-app it is done in the .angular-cli.json file.
Open it and include the core files you need.

Regards,
Ivo

[tspeevackParticipant]

Yep, that solved my issue.
Thanks,
Tim

[Author]

Posts