Uploadify conflict with jQuery dialog - jquery-ui

I have trying to create file upload using jQuery-UI dialog and uploadify. I have seen that others also had similar problem, but it was always z-index in css or cross-browser issue, which is not case here because it just won't work in any browser. When I place uploadify div(div that is a placeholder for flash object) outside the jQuery dialog everything works fine, but when I try to put it inside, swf gets loaded but when dialog pops I get error: 'Object expected' in jquery.min.js on
var c=a.getAttributeNode("tabindex")
Is it possible that problem is caused by jquery version? Current version is 1.7.1 and I tried using also 1.9.0

Add the following CSS class to override the default z-index value 1
.swfupload {
z-index: 10000 !important;
}

this error in absence function getAttributeNode and getAttribute in Flash element.
change in "jquery-min.js"
elem.getAttributeNode(name) // OR a.getAttributeNode(b)
to
(elem.getAttributeNode?elem.getAttributeNode(name):null) // OR (a.getAttributeNode?a.getAttributeNode(b):null)
and
elem.getAttribute(name) // OR a.getAttribute(b)
to
(elem.getAttribute?elem.getAttribute(name):null) // OR (a.getAttribute?a.getAttribute(b):null)

Related

Rails - Trix - Add HR - insertAttachment not a function

I am trying to add a horizontal line option to the Trix editor in Rails 6.1.4. The example that I am finding for this (https://codepen.io/javan/pen/oQpevW) works perfectly, as long as it runs in CodePen. When I implement the example I am getting the option on the toolbar, but when I attempt to use it, I get the error message that "insertAttachment" is not a function.
addEventListener("trix-initialize", (event) ->
toolbarElement = event.target.previousSibling
blockTools = toolbarElement.querySelector("[data-trix-button-group=block-tools]")
if !!blockTools
blockTools.insertAdjacentHTML("afterbegin", '<button type="button" class="trix-button" data-trix-action="x-horizontal-rule" title="Horizontal Rule" tabindex="-1">-</button>')
)
addEventListener("trix-action-invoke", (event) ->
if (event.actionName == "x-horizontal-rule")
editor = event.target
attachment = new Trix.Attachment({ content: "<hr>", contentType: "application/vnd.trix.horizontal-rule.html" })
editor.insertAttachment(attachment)
)
As an interesting side-note, the initialize event was always triggered on the edit div, not the toolbar div, so I had to grab the previous sibling of the event target, otherwise the "block-tools" button group was never found. The "trix-action-invoke" event is triggering as it should and I have verified that the target is the correct div.
Because the example is using Trix 1.0.0, I tried with this version as well, but it generated the error message stating "Trix.Attachment is not a constructor".
I read a post for a different issue ("new Trix is not defined" when using Basecamp / Trix Editor) that implied that there could be a problem with Trix not being loaded yet by the time I want to use it, and it suggested to pull the JS from cloudflare directly, but this didn't solve my issue.
Any suggestions on what could be done to get this to work?

Error: multipleDefine from Dojo & jQuery-UI conflict

I am trying to create an editable SlickGrid (which uses jquery-ui) and also use Dojo.
When my page contains
<script src="../../bower_components/dojo/dojo.js"></script>
<script src="../../bower_components/SlickGrid/lib/jquery-ui-1.11.3.js"></script>
<script src="../../mlads/fillDemo/FillDemo.js"></script>
the console shows
Error: multipleDefine
return mix(new Error(error), {src:"dojoLoader", info:info}); dojo.js (line 106)
src: dojoLoader dojo.js (line 1896)
info: Object { pid="dijit", mid="dijit/_WidgetsInTemplateMixin", pack={...}, more...}
If I comment out the jquery-ui line, the error goes away.
FillDemo.js is my source code, which starts with
require(
[ "dojo/_base/declare",
"dijit/_WidgetBase",
"dijit/_TemplatedMixin",
"dijit/_WidgetsInTemplateMixin",
"dijit/registry",
"dijit/form/Button",
"dijit/form/DropDownButton",
It looks like this is an error with the order in which jQuery UI is loaded vs when the dojo loader is intialized.
See the discussion here for more context: https://geonet.esri.com/message/448542#comment-448449
The solution is to make sure dojo loader is called after jQuery UI and jQuery have loaded. For this, you can move the loading of dojo to the bottom of the HTML page, and leave jQuery and jQueryUI in the header.

Editor javascript dependency

i want to use kendo ui editor but i have a problem,
i added these script to view:
jquery.js
kendo.core.js
kendo.data.js
kendo.popup.js
kendo.list.js
kendo.combobox.js
kendo.dropdownlist.js
kendo.userevents.js
kendo.draganddrop.js
kendo.window.js
kendo.slider.js
kendo.colorpicker.js
kendo.listview.js (Image Browser feature)
kendo.upload.js (Image Browser feature)
kendo.imagebrowser.js (Image Browser feature)
kendo.editor.js
everything work great else Imagebrowser , when i click on [InsertImage] ,i get following message :undefined is not a function
but when i add Kendo.all.min.js instead of above scripts then Imagebrowser work fine.
Can you tell me that how can i sovle it?
you must added these references:
kendo.selectable.js
kendo.editable.js

Progress bar loading message doesn't show in JQuery mobile

The Loading message in JQuery Mobile 1.1.0 doesn't seem to be working. Here is the JSFiddle for the code.
When I use version 1.0b2, it works as expected. Is this a bug in 1.1.0?
It is not a bug. Latest Jquery supports more config options. You can define the laoding message theme etc.
Refer the documentation here
Sample code
$(document).bind("mobileinit", function(){
$.mobile.loadingMessageTheme = 'a';
$.mobile.loadingMessageTextVisible = true;
});
Save above mentioned code in a js file (e.g. config.js ) and import it before importing jquerymobile framwork.
Good luck.

error on firefox: $.widget is not a function

I have a few multiselect boxes from the Jquery UI on a page that work perfectly well in Chrome & Safari but not in Firefox for some reason... when I load the Error Console in Firefox I see:
Error: $.widget is not a function
Source File: http://localhost:3000/javascripts/jquery.multiselect.js?1302660373
Line: 563
Any ideas why?
edit: the line itself is within the open function right where it says "// react to option changes after initialization"
// open the menu
open: function(e){
var self = this,
button = this.button,
menu = this.menu,
speed = this.speed,
o = this.options;
widget: function(){
return this.menu;
},
// react to option changes after initialization
_setOption: function( key, value ){
var menu = this.menu;
switch(key){
case 'header':
menu.find('div.ui-multiselect-header')[ value ? 'show' : 'hide' ]();
I am assuming you are using the jQuery Multiselect plugin… which depends on jQuery UI.
Sounds like you have not included enough of the jQuery UI library or just none of it. You need to include the core parts of jQuery UI (including Widget) if you build a custom download. Or just download the whole jQuery UI and include it instead.
For anyone else who is getting this but has the requirements; make sure you are including the Javascript files in the correct order. This error was being caused by my jquery-ui.js being included after the multiselect js file.
This answer is probably unrelated to the situation of the questioner, but I put it here for the sake of others Googling the question.
I got this error using Rails 3.2 and fixed it by deleting (renaming) the public/assets folder. It seems there are a lot of problems with the assets pipeline still. I don't know the details but have had other Javascript failures that are fixed this way.
Actually if you are getting this error then it's either
a) per #andyb answer - you haven't included the correct jQuery UI components
OR
b) your DOM is not loaded yet with the correct $.widget and therefore your function is attempting to call before $.widget has loaded. to fix the problem, ensure $.widget is called BEFORE your function

Resources