[ivanpeevskiParticipant]

Hello Kamp,

Unfortunately this functionality is not yet available for the xlsx file format, however it is something we may consider adding in the future.
In the meantime, you may also consider using exportdata('html') which also preserves the CSS rules of the Grid

If you have any other questions, please do not hesitate to contact us again.
Best Regards,
Ivan Peevski
jQWidgets team
https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hi qx5,

The filter works when the ‘keyup’ event is fired. So if you want to filter by setting a value, you need to fire the ‘keyup’ event:
element.dispatchEvent(new Event('keyup'))

Please have a look at the fiddle here: https://jsfiddle.net/tq041zuw/5/

If you have any other questions, please do not hesitate to contact us again.
Best Regards,
Ivan Peevski
jQWidgets team
https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hi Kamp,

Thank you for reporting the problem. We are aware of the issue and we are working on fixing it as soon as possible.

The problem comes from the jqxGrid not importing some of the required scripts.
Until the fix becomes available, you can use the exportview function by manually importing the missing scripts:
Inside the index.html file of the project, you need to import the following scripts:

<script
  type="text/javascript"
  src="https://www.jqwidgets.com/public/jqwidgets/jqxexport.js"
></script>
<!-- JSZip -->
<script
 type="text/javascript"
 src="https://www.jqwidgets.com/jquery-widgets-demo/scripts/jszip.min.js"
></script>
<!-- pdfmake -->
<script
 type="text/javascript"
 src="https://www.jqwidgets.com/jquery-widgets-demo/scripts/pdfmake.min.js"
></script>
<script
 type="text/javascript"
 src="https://www.jqwidgets.com/jquery-widgets-demo/scripts/vfs_fonts.js"
></script>

Then inside the app.module.ts, you need to import the following script:
import 'jqwidgets-scripts/jqwidgets/jqxexport';

Now you can use the exportview function in your application:
this.myGrid.exportview('xlsx', 'jqxGrid');

You can have a look at a working demo here: https://stackblitz.com/edit/github-a5f9we?file=src/app/app.component.ts

Apologies for the inconvenience. We will release a permanent fix as soon as possible!
If you have any other questions, please do not hesitate to contact us again.
Best Regards,
Ivan Peevski
jQWidgets team
https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hello Warren,

Yes, it does work! Although this functionality is not natively supported, it is possible to apply a work-around solution.
Please have a look at this fiddle: https://jsfiddle.net/mozhbqfe/1/

The function inside the event, triggered on ‘pointerdown’, replaces the default text field with a drop down list and then passes the selected value back to the text field.
Using a similar method, it is possible to use any other jqWidgets Component inside CardView.

If you have any other questions, please do not hesitate to contact us again.
Best Regards,
Ivan Peevski
jQWidgets team
https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hi Kamp,

The xlsx format is now supported either by using the exportdata method or exportview, which generates the exported file on the client-side, without requiring a server.
Please have a look at the demo here: https://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/dataexportview.htm?light

If you have any other questions, please do not hesitate to contact us again.
Best Regards,
Ivan Peevski
jQWidgets team
https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hi naveen145903,

For exporting large amount of data, I suggest using the exportview method(have a look at the demo here), which generates the exported file client-side and doesn’t require a server. For example:
$("#gridTasks").jqxGrid('exportview', 'xlsx', 'TaskList'); or
$("#gridTasks").jqxGrid('exportview', 'csv', 'TaskList');

Alternatively, exportData allows you to export only the rows you need using the rows property.

Please let me know if any of these solutions work for you!

If you have any other questions, please do not hesitate to contact us again.
Best regards,
Ivan Peevski
jQWidgets Team
https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hi loridale27,

If you don’t use github, you can also send us a zipped project, which reproduces the issue so that we can give you a proper solution.

In the meantime, if have already imported jqxGridModule and/or any other jqWdigets Module in AppModule and you want those modules to be available to other custom modules, then you can set jqxGridModule as one of the exported modules from AppModule and then import AppModule to the custom modules, where you want to use the jqxGridModule. I suggest having a look at the following guide regarding sharing modules in Angular.

I hope this will be of help!
If you face any other problems, please do not hesitate to contact us again.
Best regards,
Ivan Peevski
jQWidgets Team

https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hello Vince,

The numbers in the xlsx file represent 2 + the number of days since 1900-01-01 , which is Excel’s default way of handling Dates.

To customize this, you can set the cellsformat property of your date column.
For example the following column:

{
  text: "My date",
  datafield: 'myDate',
  cellsformat: 'dd.MM.yyyy HH:mm'
}

will correctly export the data to an xlsx file.

If you have any other questions, please do not hesitate to contact us again!
Best regards,
Ivan Peevski
jQWidgets Team
https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hello gruppenhaus,

Thank you for reporting the problem. This is not the expected behavior of the editMode and we will work on finding the issue as soon as possible.

In the meantime, I suggest using editMode: “default”, which also allows users to manually input dates by entering numbers.
To see how default editMode can work in your case, please have a look at this fiddle

If you have any other questions, please do not hesitate to contact us again!
Best regards,
Ivan Peevski
jQWidgets Team
https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hi jpeszleny,

Thank you for reporting the issue.

We will work on solving the problem, in the meantime, please have a look at the fix in this fiddle:
https://jsfiddle.net/5ok4t3L0/

If you have any other questions, please do not hesitate to contact us again.

Best Regards,
Ivan Peevski
jQWidgets team
https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hello iwagner,

The issue seems to come from the setup of the Angular Application, rather than the Knob element.

Another possible solution would be to navigate to the angular.json file of your project and set
projects.$projectName.architect.build.options.preserveSymlinks to true.

If the problem continues, please contact us again by sending us a code example of the application, so that we can reproduce the issue and help you fix it.

Best regards,
Ivan Peevski
jQWidgets Team
https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hi alnajar85,

You can easily resize the Knob by setting the widthand height properties as a percentage of the container element.
Please, have a look at the example here: https://stackblitz.com/edit/github-ylewon?file=src/app/app.component.html
I hope this will be of help!

If you have any other questions, please do not hesitate to contact us again.

Best regards,
Ivan Peevski
Smart UI Team
https://www.htmlelements.com/

[ivanpeevskiParticipant]

Hi bgl,

Filteritems accepts values of type array, so there is no need to use the jqx.dataAdapter for the filteritems property.
You can have a look at this angular demo to see an example of implemented filteritems.

Also, if you want to display all unique values from a column in the checkbox filter, jqxGrid will do it by default without the need for filteritems property.

If you have any other questions, please do not hesitate to contact us again.

Best regards,
Ivan Peevski
jQWidgets Team

https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hi mustafa,

Please have a look at the following fiddle to see how to use the setcolumnindex method:
https://jsfiddle.net/L1hgy4fq/3/
$('#grid').jqxGrid('setcolumnindex', 'id', 0);
The first parameter of the method should be the dataField name of the column you want to move to the front. In the example above, it is “id”.
The second parameter sets the new index of the column. In your case, the index of the sequence numbers column should be set to 0 so that they are on the far left.

I hope this will be of help!

If you have any other problems, please do not hesitate to contact us again.
Best Regards,
Ivan Peevski
jQWidgets team
https://www.jqwidgets.com

[ivanpeevskiParticipant]

Hello ajcs,

I apologize for the confusion.
You can use the following code to get the state of a tab. Here #jqxTabs represents the id of your jqxTabs element:
var state = !document.querySelectorAll("#jqxTabs .jqx-tabs-title")[index_of_tab].classList.contains('jqx-fill-state-disabled');

You can invoke the length method to get the count of the tabs. For example:
var tabsCount = $('#jqxTabs').jqxTabs('length');

Please have a look at the example here:
https://jsfiddle.net/q0gb9rvj/2/

I hope this will fix your issue.
Best Regards,
Ivan Peevski
jQWidgets team
https://www.jqwidgets.com

[Author]

Posts