jQueryUI Combobox to avoid external .JS? - javascript

I don't know if it's even possible, but here we go.
Im in a .NET project and we have this .js file that serves the purposes of a flyout menu (link)
and, on the same page we'd like to have one of these comboboxes
Thing is, when we add the combobox the button at the right, the one you click in order to get all the possible selections, is just not there. After trying several things we got to know that if we just commentante that flyout .js file the combobox works just great. It seems like those javascript codes are messing with each other.
So, can I tell the combobox to not pay attention to that .js file? Is there any workaround to solve this matter?
EDIT
I created this jsfiddle. As you can see, the combobox is not complete, its button is somehow truncated. (the menu wont get you to anyplace since its tree is gotten from a .html file which is not present in the fiddle.
This other fiddle shows that if we remove the menu.js code, the combobox works propertly

To make your fiddle work, change this line
$.fn.menu = function(options){
to
$.fn.menuFlyout = function(options){
Working fiddle.
Explanation: the function menu() is defined twice - once in both libraries you use, flyout and jqueryui.
Rename that function and make sure you use .menuFlyout() when you build your menu.

Related

Full-Calendar-Plugin Change Table

I have a small question. In my Cakephp 3.6 project I used the CakePHP-Full-Calendar-Plugin plugin from curtisblack2004.
https://github.com/curtisblack2004/CakePHP-Full-Calendar-Plugin
I installed the plugin and everything works fine. I want to change the name of the table from "events" (used in the plugin) to "lessons" and completely change the structure. Where can I do that? Can someone help me ? Maybe it's a trivial thing to do, but I'm stuck and I do not know how to continue.
As I see in the repository of plugin, you may follow these quick steps:
1- change the tables names in the sql found here
2- change your models/controllers names based on that.
example, if your your events tables becomes >lessons>, then in controller folder, EventsController.php should become LessonsController.php. You need to rename Everything related to Events into Lessons, in differents folders.

Typo3 - t3jquery integration is not working

so first i have to say that i'm realy new to Typo3, so i dont rly know much about the cms.
Actually i have a Problem with my Page.
I want to integrade a Image Slider in my Page with the Nivo Slider Plugin.
The Problem is, that the Slider is not shown.
The page gives the error
TypeError: jQuery(...).nivoSlider is not a function
so i think, there is some problem with the jQuery.
For that i installed t3jquery but its still not working.
i nearly tried every configuration for t3jquery and also analysed the other extensions on my Page with the plugin, but nothing works.
Some of you have advice what i can do?
The page is hxxp://www.eventbringer.de/skireisen/opening-slider/ (so you can see the error in the JS Console)
TYPO3 has a very versatile way of getting content of code to the front-end.
One way is to use typoscript.
read : https://docs.typo3.org/typo3cms/TyposcriptReference/
You can see typoscript as a huge configuration 'array' that can declare all sorts of settings.
One of the settings is about how the 'page' itself needs to have.
If you need, for example, some javascript in your page, you could use
page.includeJs
https://docs.typo3.org/typo3cms/TyposcriptReference/Setup/Page/Index.html#setup-page-includejs-array
if you need yous JS at the footer, and its an external lib, you could use
includeJSLibs.twitter = http://twitter.com/javascripts/blogger.js
includeJSLibs.twitter.external = 1

Find plugin on a page

On a website, I see some charts with animation. I am sure they have used a plugin to design those charts but which one, I DONT KNOW...
Is there any way to find which plugin or .js file is used ?
I right-clicked on the chart and clicked "Inspect Element" too but no success. Can't seem to find the correct chart or the code that invoked the animations (hover, mouseOver etc)
The theme I am looking at is here
If you look at the chart underneath VISITORS, and hover over any line, it shows some values. I want to know what is triggering the show of these values.
EDIT
Muhammad answered helped me a lot. Here is what I did for someone looking for the answer.
I right-click on the plugin that I wanted to know more about, and looked at the ID and the class of the same.
By the look of it, i could see that some plugin called 'HighCharts' is used. Then I pressed
ctrl+Shift+F
After that the search option was shown to me, which I couldn't notice since it was right in the bottom of the screen.
I entered "High" in the search bar and it showed me the script and the javascript file that was used to call it.
Hope this helps
For checking which plugin they are using for this. Right click and go to inspect Element and then check the parent div class which contain the particular chart of something and after that go to sources next to the network and for the main.js OR custom.js OR app.js You can quickly search by press ctrl+shift+f or simple look into js folder and search for the class that you got from the inspect Element and you will find which function they are using for this class and u will have idea from the function name and you can search for that partical file.
Ex:
This is a simple example I hope you have got the better idea.
Step 1
Step 2
Step 3

Restyling fine uploader?

I am attempting to use fine uploader to handle some file uploading in a web application I have. I would like to do some restyling but I am stuck on something. In the documentation on restyling they have the following line:
The default drop area, button, and file list elements are also, by
default, contained in this option.
referring to a parent div with the class qq-uploader.
My question is if I can move certain pieces out of this div (in this case the file list elements). The fact that they say "by default" seems to suggest it can be done, but I haven't seen any documentation on how to do it. Has anyone done this before? Can someone point me in the right direction.
I have done this before..but it was little styling..
i have to do is change little bit qq.FileUploader in these properties:
template which define the template for the whole uploader.
fileTemplate which define the template for one item in file list.
I was using older version(i think 2.1)..
my advice to you is to open the js file and look into it..it's good commented and 'll teach how this uploader is working.
You can define a new container to hold the file list, and place it wherever you want. See the listElement option. Probably no need to modify a template in this case.

Anyone know how to use the jQuery Gallery View Plugin?

I found the jQuery Gallery View plugin because I was looking for a good way to cycle through pictures including text and one that was well designed. This plugin does not seem to be updated anymore and does not have much documentation so I am having difficulties implementing it. Does anyone have an idea as to how it works?
Thanks in advance for any help you can give.
Heres the code I have now (of course with the pictures at the right locations just not possible to attach in jsfiddle): http://jsfiddle.net/chromedude/GgusY/
Here's a start.
I'm taking a total guess at what your markup is supposed to be, because you were missing a bunch of </div> (close div) tags.
Things I had to change to get it this far:
Download galleryview-2.1.1.zip, and from that file...
Paste in contents of galleryview.css and jquery.galleryview-2.1.1js into the fiddle (normally you'd do this with proper external scripts and stylesheets)
Fix the markup so that all those <div class="panel"> tags are properly closed
Get a copy of jquery.timers-1.1.2.js onto the page
Step 2: got the loader image working by hosting the loader.gif file on imgur and editing the CSS accordingly.
Themes are tougher, because apparently, this genius™ plugin tries to figure out where your themes are hosted based on the location of the <script> tag which was used to load the galleryview plugin code. Absolute genius... </sarcasm>
Check it out →
no more image 404s. Loaded next.gif, prev.gif, panel-nav-next.gif, and panel-nav-prev.gif onto imgur so that jsfiddle can actually get the images.
I had to actually edit the plugin source for this one; if your server has the directory structure that galleryview expects, this should not be necessary.
Now here's the thing
You could keep wrestling with this plugin.
Or, you could use a different one, like Galleria. As far as I can tell from the example you've been trying to assemble, Galleria does all the same stuff. Since Galleria is actively maintained, you should actually be able to use it with a reasonably recent version of jQuery, as well as actually get support for it from the developer.
Get the latest version of jquery gallery view here:
http://plugins.jquery.com/node/7317/release
Then following on from that:
http://jsfiddle.net/chromedude/GgusY/
$('#photos .filmstrip').galleryView({
panel_width: 800,
panel_height: 300,
frame_width: 100,
frame_height: 100
});

Categories