How to download this working jsfiddle? - jsfiddle

The example given in jsfiddle.net/jjx86sqb/ is excellent and would like to download all the files.
Pls let me know how to download it.
I want to run the sample html file example locally

Simply copy and paste the HTML and jQuery sections of the fiddle to your own document.
Don't forget to include the four relevant external files:
https://cdn.datatables.net/v/dt/dt-1.10.15/datatables.min.css
https://cdn.datatables.net/v/dt/dt-1.10.15/datatables.min.js
https://gyrocode.github.io/jquery-datatables-alphabetSearch/1.2.2/css/dataTables.alphabetSearch.css
https://gyrocode.github.io/jquery-datatables-alphabetSearch/1.2.2/js/dataTables.alphabetSearch.min.js
You'll also need to reference jQuery itself (version 1.11.0 in the fiddle).
Version 1.11.0 can be found at:
https://code.jquery.com/jquery-1.11.0.min.js
Note that jQuery must be referenced before the four DataTables scripts.
Your <head> should look like this:
<head>
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.15/datatables.min.css">
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.15/datatables.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://gyrocode.github.io/jquery-datatables-alphabetSearch/1.2.2/css/dataTables.alphabetSearch.css">
<script type="text/javascript" src="https://gyrocode.github.io/jquery-datatables-alphabetSearch/1.2.2/js/dataTables.alphabetSearch.min.js"></script>
</head>
The jQuery code itself must be placed between <script> tags after the five external files have been included.
Hope this helps! :)

it is possible. and easy.
add /embedded/ to the URL of the jsfiddle you want to download.
click on the result tab
right click on the screen and select view frame source (and not! view page source)
save the complete html you see to html file.

It is impossible and unnecessary feature to download the code. There are max 3 codes for you to copy viz. HTML, CSS and the script.
Just click on any of the code > Ctrl+A > and copy and paste it wherever you want.
Repeat the same steps for each code.

Related

Apache add Content of a Link to response

I want to know if it is possible to let apache substitue a link in the html I return to the client with the html of the site behind the link.
So instead of
<html>
<head>
</head>
<body>
Link
</body>
</html>
I want something like this:
<html>
<head>
</head>
<body>
// the html of the page behind the link
</body>
</html>
I can´t use javascript or php or anything, let´s assume I only have html.IFrames are as well no solution for my problem.
Just for everyone that comes to a similar situation, Ulrich Schwarz gave a good hint with SSIs, which is in this scenario the only way that could work. However, due to cancelling the project, I was not able to validate the usage of SSI for this scenario.
This can be little painful to do and might not be suitable for all cases but you can maintain a plaintext file for every html page you want to show source of and add a link to that file instead.
For eg: Instead of <a href='somefile.html'>Click</> do <a href='somefile.source'>Click</>
where somefile.source is the copy of the somefile.html. Add triple qoutes """ in the first and the last line of the file. I didn't try a lot of combinations but this works for fairly decent html codes.

Grails Resources Plugin resource scope

I am struggling to understand the scope of resources defined with the Grails resources plugin.
I have created a small project (Grails 2.0.4) with a single domain item of Book and generated the associated Controller and Views.
I have then modified the main layout as follows:
<html>
<head>
<g:layoutTitle/>
<r:layoutResources/>
</head>
<body>
<g:layoutBody/>
<r:layoutResources/>
</body>
</html>
When I run the app I get no styling as expected.
I now add the following to the head list.gsp
<head>
<meta name="layout" content="main"/>
<r:require modules="jquery-mobile"/>
</head>
When I go to the list page now I correctly get the jquery-mobile styling as expected but when I go to the create page I also get jquery-mobile styling but was expecting no styling, as this page does not contain the tag.
It seems that the resources selected for one page are being used for all other pages. Is this expected behaviour?
Thanks,
Kim
Use Resources 1.2, it sounds like this might be an old bug.

web agent can redirect to the top target?

I'm calling from an iframe an agent that should redirect the user to a given page on the whole page.
It's a lotus script agent that do his stuff and then redirect using a common:
Print "[http://www.server.com/db.nsf/simpleForm?OpenForm]"
How could I mention the TARGET (_top in my case) ?
thanks,
Since no better response had been given, I share my Javascript solution (comment welcome):
Print |<html>
<head>
<script language="JavaScript" type="text/javascript">
<!--
window.top.location.href = "/myDB.nsf/MyFullRedirectedPage?OpenForm&L=|+lang+....+ |";
// -->
</script>
</head>
<body "style=\"margin:0 ; background:transparent\"">
processing... please wait! N.B. this text will appear very short time.
</body>
</html>|
I put a background:transparent since I'm in a iframe.
I don't love this code almost flashing before the whole page is being refreshed.

How to set up DOJO

I am a beginer to DOJO , finding difficulty to set up DOJO
This is my Program :
<html>
<head>
<script>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js" type="text/javascript"></script>
</script>
<title>button</title>
<script type="text/javascript">
dojo.require("dojo.event.*");
dojo.require("dojo.widget.*");
dojo.require("dojo.widget.Button");
function init()
{
alert('Click on the Hello World Button');
}
dojo.addOnLoad(init);
</script>
</head>
<body bgcolor="#FFFFCC">
</body>
</html>
I have used the dojo.js file from the external site itself that is by
**<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js" type="text/javascript"></script>**
But still i am getting errors .
Please see the screen shot related to errors
http://imageshack.us/f/545/dojoh.jpg/
Also i have downloaded , the DOJO Latest relaese , and kept this in C:\dojo-release-1.6.1
Could anybody kindly please tell me , as what should be the source path to dojo js , i tried the below way , but doesn't know why this js file hasn't been recognized
Thank you for your time .
You are on the right track, there's just a small issue with your HTML. The following snippet is not valid:
<script>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js" type="text/javascript"></script>
</script>
You can't have a <script> tag within another <script> tag. Remove the outer tags, so you're left with just this:
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js" type="text/javascript"></script>
This is what caused the "unexpected end of XML source" error. Also, since the error prevents dojo from being loaded, you get the "dojo is not defined" right afterwards.
Secondly, you cannot require dojo modules with wildcards ('*'). You have to explicitly require the ones you want to use. So the following is not valid:
dojo.require("dojo.event.*");
dojo.require("dojo.widget.*");
Lastly, you probably want to run your Dojo application through a web server, not just as a local file. It may work for now, but you're bound to run into some weird issues after a while.
Hope this helps.
In the HTML code you have here Dojo won't load, as script tag loading dojo is inside another script tag. Get rid off the outside script tag.
You should only require modules that you need. Here you do not seem to need any of the extra dojo modules.
Here is an example of having dijit.form.Button http://dojotoolkit.org/reference-guide/dijit/form/Button.html It will give you better idea of how you can load modules.
To load dojo.js file from your computer, if your HTML file is in projects dir then you may add your dojo-release-1.6.1 dir inside projects dir and may want to rename it as libs. Then in your HTML file you should load dojo.js file as
<script type="text/javascript" src="libs/dojo/dojo.js"></script>
In addition to the other answers, please note that your sample code reflects Dojo 0.4 APIs from about 5 years ago. The code has been refactored significantly since then. Most widgets live in the dijit package

Conflicting Scripts

I've read the Jquery docs page on conflicting scripts. But i'm not really understanding it. As well, it's multiple .js files that are conflicting, and they have the same names to boot. (but they aren't the same within.)
I have a set of .js for a fisheye effect. Then i have another set of .js for draggable. Draggable won't work with the fisheye scripts, and vice versa.
These links are for the fisheye effect.
<script type="text/javascript" src="HandFan/jquery-1.js"></script>
<script type="text/javascript" src="HandFan/ui_003.js"></script>
<script type="text/javascript" src="HandFan/ui.js"></script>
<script type="text/javascript" src="HandFan/effects.js"></script>
<script type="text/javascript" src="HandFan/ui_002.js"></script>
These files are for draggable.
<script type="text/javascript" src="Draggable/jquery-1.js"></script>
<script type="text/javascript" src="Draggable/ui.js"></script>
<script type="text/javascript" src="Draggable/ui_002.js"></script>
From what i understand of what the doc said,
File1.noConflict();
// Use script File1 via File1(...)
File1(document).ready(function(){
File1("div").hide();
});
// Use script File2 with $(...), etc.
$('someid').hide();
I'm not sure what to do with regards to the multiple files, I'm sure that speaks to how new i am to this.
EDIT
After looking online, i thought it would do me good to use a single jquery.1.3.2.js file, hosted by google. However, that didn't work. So it would seem my problem is that i need each of the scripts above for my effects to work, and this just seems wasteful to me. Is there a more efficient way to do this?
I don't fully understand why you need to include jQuery more than once. For example, the draggable plugin will work fine if you've already included jQuery further up on the page. The same goes for any UI scripts you're including.
Your script declarations will likely work better like this:
<script type="text/javascript" src="scripts/jquery-1.js"></script>
<script type="text/javascript" src="scripts/ui.js"></script>
<script type="text/javascript" src="scripts/ui_002.js"></script>
<script type="text/javascript" src="HandFan/effects.js"></script>
<script type="text/javascript" src="HandFan/ui_003.js"></script>
The draggable stuff should work fine without needing to have its own set of the same base libraries defined.
Given this might not be working for you, let's see if it's the jQuery files that are the problem at all.
The jQuery noConflict() method allows you to assign different variables to call jQuery instead of the very common $ symbol. See if the following works:
var j = jQuery.noConflict();
You can then use the letter j where you would ordinarily use $. For example:
j('#myElement').draggable();