jquery.event.drag and jquery resizable incompatibility - jquery-ui

I've both slickgrid and jquery-ui libraries and is causing some problems. Without jquery.event.drag library (needed by slickgrid) it was working nicely.
I have a resizable and draggable div and I am using THREEDUBMEDIA's jquery.event.drag plugin.
When I try to resize the div it's doing drag&drop and resize too.
Did somebody had some trouble combining both libraries, can it be fixed?
fiddler example : fiddler

The solution I found is to use older version of the jquery.event.drag libray.
I am now using:
jquery.event.drag 1.5
jquery 1.7.2
jquery-ui 1.10.3
SlickGrid 2.1
and it's working fine.

The real solution is to get jquery.event.drag and jquery-ui to resolve their incompatibility.
SlickGrid uses/requires jquery.event.drag, and there's good reason for it. It's dependency on jQuery UI is purely optional. jquery.event.drag is small, efficient, and is a much better fit for the functionality that I needed for SlickGrid. Switching to jQuery UI's drag/drop is out of the question, and implementing it directly is a step backwards.

Since you are using jQuery UI, why are you using another plugin for drag and drop features?
You can use and mix jQuery UI:
drag & drop
resizable
Forked demo: http://jsfiddle.net/IrvinDominin/5kn5S/

I ran today into the same issue.
The answer must be to fix slickgrid.
I.e. making it configurable, which plugin to use:
jquery.event.drag OR jquery-UI -- not both.
I opened this issue: https://github.com/mleibman/SlickGrid/issues/811
-- Sebastian

Related

internet explorer compatibility with angular material

I am working on MEAN stack with angular material design. After testing on chrome & firefox, every functionality including flex & offset etc is working perfect. but in internet explorer, nothing is working as it is supposed to.
My question is, how to make angular material compatible with IE 10 & IE 11?
Angular Material is targeted for all browsers with versions n-1; where n is the current browser version. IE 10 is no longer supported.
Edge seems to work well with material, but IE 11 still has some discrepancies. I get around these layout issues by simply adding a few CSS rules to elements that aren't displaying correctly while making sure they don't affect my Chrome / FF layouts.
Also the way you nest your divs; layout rows, input containers, etc, can have an undesirable effect in IE 11. Trial and error worked best for me.
It is best to avoid angular-material if your main targets are internet explorer, but instead use Angular-Materialize library which is a add-on (directives) library for http://materializecss.com/ that works pretty much with every modern browser.
As for Angular 5 you can uncomment imports in polyfills.ts to deal with IE.
Using Angular 8, I got the Angular Material Datepicker to work in IE by doing the following:
Removed everything that had to do with moment.js and the material moment adapter. (Uninstalled it)
Imported MatNativeDateModule in app.module.ts
Set the appearance attribute to "legacy" in the html, like this:
<mat-form-field appearance="legacy">

Can I use unstable version of angular ui-grid for production?

I was customizing the CSS using the Customizer option provided in the ui-grid site.I was using the stable version (v3.0.0-RC.18) with this customized styles, extra scrolls are coming up in the grid.
But if I am using the unstable version with these customized styles, it is working as expected.
Sorry for the confusion; UI-Grid does not currently have a stable release. The stable drop-down there is a placeholder and points to some old code. If you go to the project page it says that UI-Grid is still "pre-beta": https://github.com/angular-ui/ng-grid but I know having something say "Stable" is confusing.
For now, the "Unstable" setting will be the most current option.

How do I know what's in my jQuery UI custom build?

I'd like to upgrade my jQuery UI version due to an annoying slider bug found in older versions.
My problem is that I'm using a custom jQuery UI build, with an inherited codebase. The current jquery-ui.min.js is about 260k, so I really don't want to download the whole thing at 2 megs zipped!! Is there any way to easily figure out exactly what I'm using so I can upgrade only the relevant bits?

JQM crashes Blackberry simulator

Prior to deploying JQuery Mobile js script to Blackberry application, simulator(Blackberry Bold 9700) crashes throwing an error "Class 'net.rim.device.api.crypto.MD5Digest' not found". I also renamed all dashes to dots, so this may not be the case of error, without a script application starts and works fine, but without JQM obviously, I also tried cleaning simulator. Does anyone comes with a solution?
If you are using jQuery Mobile pre 1.1 then make sure you are using jQuery Core 1.6.4.
I got white-screens when I used jQuery Core 1.7 with jQuery Mobile 1.0 Final, no problems on iOS or Android devices, just with BlackBerry.
If you are using jQuery Mobile 1.1.0 RC-1 then you should be able to use jQuery Core 1.7.1 but I have not tested this.
doing a quick search I found this BlackBerry Support Forum thread:
Application Entry Point Runtime Exceptions
the solution post is:
Lesson learned: if it doesn't work and you have no idea why, wipe/clean the device/simulator and/or make a new project and re-add all your source/resource files.

Requirements for cherry picking a single function out of jQuery Mobile?

I'm interested in incorporating the jQuery Mobile Datetime text input capabilities into a hobby Rails app that I'm building. I do not need any of the other jQuery Mobile features.
What is the best way to go about this? Will it work if I include nothing but the jquery.mobile.forms.textinput.js file from github or are there other required jQuery Mobile files?
I know in the Release Notes for RC1 they had decoupled jQM and were working on a Download Builder
http://jquerymobile.com/blog/2011/09/29/jquery-mobile-1-0rc1-released/
Download builder: In the works
Now that we’ve decoupled most of the UI widgets, we’ve set the stage
for there to be a download builder. This will let you build a custom
version of jQuery Mobile to only include the parts you need. For
example, you could just use the core files to add Ajax-based
navigation with pushState and leverage some of the touch events and
other utilities with a very lightweight build (roughly 10k). Or, you
could add in specific UI widgets like form elements, listviews, etc.
to create an optimized build. We’re aiming to have a download builder
tool launch as part of 1.0 final in some form. We’re working on a
dependency map now for all the plugins to support this tool.
Not sure if this is release as of yet
As far as I know there is no widget for a date/time picker packaged with jQuery Mobile at the moment.
There are however several options out there (and I'm sure you can find more with some Google-time):
http://mobiscroll.com/ - I use this one on mobile websites
http://dev.jtsage.com/jQM-DateBox/ - Updated to work well with jQuery Mobile 1.0RC3, but note that it requires jQuery Mobile (see J.T.Sage's comment below).

Resources