We have a mobile version of our Joomla site using mobile Joomla and everything was working fine until we introduced the jquery UI for the autocompletion functionality into the equation. We now get the following error "Uncaught TypeError: Object 0 has no method 'match'" which after googling seems to indicate it being a conflict between Mobile Joomla and jQuery UI.
We can prove this if we remove the UI it runs fine again.
Any help would really be appreciated.
Thanks
Richard
Use $.noConflict(); and inside (document).ready(function() put $ inside (function()
Example:
$.noConflict();
jQuery(document).ready(function($){
$("button").click(function(){
$("p").text("jQuery is still working!");
});
});
Related
When I've linked jQuery Mobile in my HTML Frontend in Google App Script, the following error will pop up in chrome debug tool.
Could not create the property 'jQuery110204039543210528791': USELESS is not extensible. 702029031-maestro_htmlapp_bin_maestro_htmlapp.js?lib=MT0FjXL5Y7sJYLE797XdNlumjcy0VxvZE:62
jquery.mobile-1.3.2.min.js:2: Could not create the property 'jQuery110204039543210528791': USELESS is not extensible.
More looks likely the Caja in Google App Script is not supporting jQuery Mobile?
Any idears?
Caja sanitation prevents jQuery mobile markup. This is an issue addressed in the Issue Tracker.
I'm not sure how long it would take to have jQuery added to Caja's list...
I am working on converting my existing MVC website to be Mobile friendly. I am having issues when clicked on links, it is showing empty page. If I remove following links in _Layout.Mobile.cshtml
#System.Web.Optimization.Scripts.Render("~/bundles/jquery")
#System.Web.Optimization.Scripts.Render("~/bundles/jquerymobile")
Then it works fine but I loose all the styling and the text on webpage displays very tiny.
I am using Opera Mobile emulator for testing.
The links are local and are like "localhost:62234/Articles/10".
Just to give some more background I am converting my Framework 4.5 MVC website to be Mobile friendly. I have added all the libraries needed and main page works fine. I am having issues when links are pressed on main page. Initially clicking on links was doing nothing, then I did some research and discovered that I have to add tag rel="external" to the links to make them work. Now links work but displays empty page. Any help is greatly appreciated.
Here is solution I found which solved my problem finally.
Here is how my code looks now..in _Layout.Mobile.cshtml
#System.Web.Optimization.Scripts.Render("~/bundles/jquery")
#System.Web.Optimization.Scripts.Render("~/bundles/jquerymobile")
<script type=”text/javascript” src=”#Url.Content("~/Scripts/jquery-2.0.2.min.js")"></script>
<script type=”text/javascript”>
$(document).bind("mobileinit", function () {
$.mobile.ajaxEnabled = false;
});
</script>
<script type=”text/javascript” src=”#Url.Content("~/Scripts/jquery.mobile-1.3.1.min.js")"></script>
I found some more information with this problem Here.
Hope this helps others
I am using jeditable and i needed to integrate with jeditable-datepicker and Autocomplete
everything works fine apart from this incompatibility between them.
I have noticed that the problem is caused by the script
<script src="jquery-ui-1.8.24.custom.min.js"></script>
which makes working my jQuery datepicker, if i remove it the autocomplete starts working again but obviously my Jquery date picker stops working.
How can i figure it out my issue? there is a way to make them working together?
Thanks
i found the solution, i explain it here, it might be useful for someone in the future.
i have downloaded again the custom jQuery , i have deselected all the options just keeping the Datepicker Widget and then pasted the new script in my page and the incompatibility was gone!
On the zepto project website i see no version of IE as being supported, not even 9.
I am considering using zepto in a webapp (not mobile) but i want to support IE 9+
Is that possible? What features / methods of zepto do not work on IE9?
Out of curiosity I just loaded up the following page and tested in current versions of Chrome, Firefox, Safari and IE9. In all but IE9 I was greeted with the alert() message. IE9 gave me no alert and contained two errors in the console. Here's the code I used, with the Zepto library in the same folder.
<!doctype html>
<h1>Zepto Browser Support Test</h1>
<script src="zepto.min.js"></script>
<script>
$(function () {
alert('Zepto Ready Successful!');
});
</script>
So, unfortunately for your web app, if you are trying to support IE9, it doesn't look like Zepto is going to work for you.
Although, what the good folks at Zepto encourage if you are trying to reach IE users is to fallback to jQuery. They even give you the code to do so.
If you need to support Internet Explorer, you can fall back on jQuery. Note that conditional comments are no longer supported starting on IE 10, so we recommend the following document.write approach:
<script>
document.write('<script src=' +
('__proto__' in {} ? 'zepto' : 'jquery') +
'.js><\/script>')
</script>
I found this in the Zepto docs near the top of the page.
Hope that helps and good luck!
Im building a search autocomplete using Jquery UI. Everything worked perfectly fine when I built the search in a minimal document with nothing but an input. eg:
<input id="autocomplete" />
and the Jquery
<script>
$( "input#autocomplete" ).autocomplete({
source: ['johannesburg z', 'johannesburg x', 'johannesburg v','johannesburg b','johannesburg a','johannesburg q', 'johannesburg u', 'johannesburg y', 'johannesburg o', 'johannesburg p']
});
</script>
However, once I place my code into a Sitefinity 3.7 page, I get an error, telling me that "$("input#autocomplete").autocomplete" is not a function.
This error only occurs once its in sitefinity
Things Iv tried
Im using the latest Jquery UI library with the autocomplete widget.
Iv checked that my file paths are correct. (they are).
Used alerts eg
alert("$('input#autocomplete').autocomplete")
they keep returning undefined.
Any help would be much appreciated!
Sitefinity itself employs jquery and is probably overriding many of the base classes/methods with the same shorthand classnames ($, Jquery).
The consequence is that you cannot have your javascript on your page BEFORE any sitefinity page elements/controls are being inserted. I was having this same issue. I moved all my javascript AFTER the sitefinity elemens, to the bottom of my pages and everything worked fine again.
Bear in mind, what is actually happening in this case is that
sitefinity injects their own jquery, then
your link to the jquery.min.js file overrode sitefinity's.
So it's possible that doing this may actually break some of sitefinity's jquery-based functionality, although I haven't had any issues in the last 2 months.
You can also try using the sitefinity built-in version of jQuery (which is what Telerik recommends at the forum link below, although I didn't have much luck with this technique):
<%# Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>
Here's the link to a recent Sitefinity forum post regarding this exact same issue:
http://www.sitefinity.com/devnet/forums/sitefinity-4-x/general-discussions/jquery-popup-not-working-in-telerik-webapplication.aspx
Good luck!