I found this Jquery based Datepicker and like it, however my app is pretty entangled with Prototype and I'm getting errors
Error: TypeError: element.dispatchEvent is not a function
Rather than spend time getting Jquery to play nicely with Protptype, is there a good Prototype based datepicker similar to what Google Analytics uses (or the one linked above)?
Edit:
Following these directions, I added
<script type="text/javascript">
jQuery.noConflict()
</script>
After both Prototype and JQuery libraries loaded. I'm not getting any errors now, but the datepicker is nonfunctional.
I decided to migrate everything to jquery. Problem solved. :)
Related
None of the bind examples in the documentation work - https://fancyapps.com/docs/ui/fancybox/api
The standard constructor examples work great, but anything that requires binding does not work. There is no error, but the gallery lightbox doesn't work - clicking an image just opens the image as a link. Here is the exact example code with markup:
<div id="gallery">
<a href="https://lipsum.app/id/1/800x600">
<img src="https://lipsum.app/id/1/300x225" />
</a>
<a href="https://lipsum.app/id/2/800x600">
<img src="https://lipsum.app/id/2/300x225" />
</a>
</div>
<script>
Fancybox.bind("#gallery a", {
on : {
ready : (fancybox) => {
console.log(`fancybox #${fancybox.id} is ready!`);
}
}
});
</script>
That console log never fires.
I'm importing FancyBox like this:
import { Fancybox } from '#fancyapps/ui';
I've tried searching around, but very little info on FancyBox 4 other than official docs and it's frustrating as they don't work. I've tried some of the examples in showcase also, and the same deal. If it's binding, it won't work and no errors are shown. Anyone have any insight into this?
Thanks,
Tom
It works perfectly fine. Since you did not provide a live demo (or at least a full HTML code), then it just not possible to help you.
It is so frustrating to read comments like this, no demo, no useful info, nothing. Maybe you did not include JS file, I do not know ... I would love to help you and to improve documentation, but, sorry, your comment is not helpful at all.
Fancybox is designed to be as easy to use as possible, all you have to do is:
Include two files - CSS and JS file (to get Fancybox object).
Add data-fancybox attribute to your links (or to call Fancybox.bind("YOUR_SELECTOR");)
Thats it! It can not be any simpler.
Sorry, it should have been a much clearer question. I didn't include a demo because it's a big wordpress site in production. It was giving me no useful feedback or errors or anything like that. I build websites day in and day out, so assumed it wasn't just me making some incredibly stupid mistake like a typo or something. I genuinely spent a lot of time on this, it wasn't me being lazy and just posting on stack overflow straight away...
It was me being stupid though.
In the process of making a demo to show you, I found the problem and (as you already know!) it's my mistake. I was able to make fancybox work by instantiating it straight away in my js, but binding (and therefore galleries etc) was not working.
The reason was the javascript was included in the head of the html document before the markup instead of at the bottom of the html document before the closing body. There was nothing for the js to bind to when it was executed.
I wouldn't normally include javascript in the head either but it's a wordpress project and because of some plugin, it's required there. Fancybox 3 worked with js in the head, but I suspect it might be jquery being more forgiving than native js with it's binding to DOM elements?
So, yes, entirely my fault. I was following the steps of the installation and startup guide almost exactly, but that inclusion of the js file in a slightly unusual (or bad practice at least) place was what caused all the issues.
I've decided to ditch jQuery and go with Zepto for a mobile application that I am making with PhoneGap.
The problem is that most of the date pickers available rely on jQuery (Including the one I was using before). http://xdsoft.net/jqplugins/datetimepicker/
Does anybody know any good date pickers that work with zepto. The only requirement is that it looks OK.
I have successfully implemented http://trentrichardson.com/ but the UI is awful and I haven't found any documentation on how to change it from using dropdowns to a standard calendar view.
I have also used the following date picker but it seems limited in that it completely takes over the input you're using and I'm not sure how to get the input to display the date once it's been selected. https://gist.github.com/pamelafox/1765620
Any suggestions are appreciated! Thanks.
This one appears to be working with zepto only :)
(or at least the demo includes zepto only ;) ... (with the DateFormat library, but it's optional))
http://blog.pamelafox.org/2012/02/datepicker-for-twitter-bootstrap.html
I have seen coffescript tutorials that show how to use coffeescript with rails, nodejs, or even coffeescript REPL for learning it.
How can I create a web project where I can just write a cofeescript script inside an HTML page, I mean something like
<script type ="text/coffeescript">
//some coffeescript code
</script>
How to use coffeescript in developing web-sites? just tells to include output javascript and test it. But, I do not want to do that (I feel its just clumsy).
I also saw coffeescript web site, it has small amount of direction regarding this, it says-
I tried it, I included a those scripts along with jquery. But my page is remains blank. Has anyone does it before, can you provide a sample code?
Thanks.
Just include coffee-script.js in the usual manner and then add <script> elements like this:
<script type="text/coffeescript">
alert 'pancakes!'
</script>
or this
<script type="text/coffeescript">
eggs = 'gotta have some'
document.write "It really is CoffeeScript: #{eggs}"
</script>
Demo: http://jsfiddle.net/ambiguous/DmuHh/
I followed through this tutorial
http://zendgeek.blogspot.com/2009/07/zend-framework-and-jquery-jquery-date.html
when I done I found Only 2 text boxes are displayed. Datepicker is not loaded. so, not the problem with class library inclusion rather it may be something else that I can't figure out.
I skimmed that tutorial, it didn't seem very indepth. Don't give up. Just like most things, getting started is the hardest part. I would suggest you follow the tutorials on Zend Casts. Here is one about getting started with ZF and Jquery: http://www.zendcasts.com/working-with-zendx_jquery/2010/07/
JAPopup is a handy plugin for Joomla to render Youtube videos in a Modal Window so user cannot click on multiple Youtube videos at the same time. The website URL is www.multicorewareinc.com/29042 (hast not gone live yet!). If I use a standard Joomla template such as JA_Parity or rhuk_mllkyway, JAPopup plugin works fine. But instead if I use Template 29042 from template-help.com, JAPopup hangs up. I compared the index.php files of a working template (such as rhuk_milkyway) and Template 29042 and as far as I can tell, 29042 uses Javascript extensively and there appears to be an issue when it comes to launching JAPopup (which too is based on Javascript). I put print statements in all the JAPopup modules and verified that the code was getting executed in either templates. So I am at a loss as to why JAPopup won't execute. If anyone has a suggestion, I would be grateful. Once I fix this, I plan on publishing the problem and the fix on my web-site, www.sreeiyer.com.
What does Firebug say? It's obviously a jscript conflict so start narrowing down the options - does the template use jQuery or another library? Does JAPopup use a library? You can also remove the scripting from the template and start adding it back until the error comes back, then you know what needs to be rewritten.