Why is window.kendo undefined in jsfiddle - kendo-ui

H there,
I have created a JSFiddle.
I have linked up the following external resources:
http://getfirebug.com/firebug-lite-debug.js
http://cdn.kendostatic.com/2013.1.319/js/kendo.all.min.js
http://cdn.kendostatic.com/2013.1.319/styles/kendo.common.min.css
http://cdn.kendostatic.com/2013.1.319/styles/kendo.default.min.css
http://cdn.kendostatic.com/2013.1.319/js/jquery.min.js
And I have the following markup:
<div id="test">Test</div>
And I have the following JavaScript:
alert($("#test").html());
alert(window.kendo.guid());
The first alert returns 'Test' as expected.
The second alert fails.
I have tested the kendo js external resources in the address bar of the browser and they both load.
Why is window.kendo undefined?
Regards,
Scott

Apparently it is the order of the external resources. When I changed them to the following order, it worked fine:
http://cdn.kendostatic.com/2013.1.319/js/jquery.min.js
http://cdn.kendostatic.com/2013.1.319/js/kendo.all.min.js
http://cdn.kendostatic.com/2013.1.319/styles/kendo.default.min.css
http://cdn.kendostatic.com/2013.1.319/styles/kendo.common.min.css
http://getfirebug.com/firebug-lite-debug.js
Regards,
Scott

Related

Show gif animation while LinkedIn member profile is loading

I wanted to show an animated gif while the LinkedIn Member Profile Plugin is being loaded.
Here is the original code:
<script src="http://platform.linkedin.com/in.js" type="text/javascript"></script>
<script type="IN/MemberProfile" data-id="http://www.linkedin.com/in/reidhoffman"
data-format="inline"></script>
I found a similar question here but I'm not sure how I can apply that to the LinkedIn script.
Any solutions would be appreciated :)
I managed to figure something using related examples but the gif gets removed few seconds before the script is actually displayed.
I placed the linkedin plugin codes in linkedin.js and tried both below methods:
1:
$('#linkedin').html('<img src="ajax-loader.gif" />').load("linkedin.js");
2:
$('#linkedin').append('<img id="animation" src="ajax-loader.gif" />')
.load("linkedin.js")
.complete(function(data) { $('#animation').remove(); });
HTML
<div id="linkedin"></div>
I suppose the gif is removed once the script is loaded and yet to be executed? I also tried using getScript() couldn't get any results.

Insert HTML codes in CKEditor textarea

I would like to know if there is a plugin in order to insert HTML codes in a CKEditor textarea?
I tried to install the PBCKCode plugin but it doens't work because the HTML is executed in my textarea.
Anthony
EDIT1 ----- INSERTPRE Plugin -------
Query when I add the post :
INSERT INTO `Posts` (`slug`,`title`,`thumbnail`,`content`,`tags`,`state`,`click`,`createdAt`,`updatedAt`,`id`) VALUES ('dsq','dsq','http://4.bp.blogspot.com/-knCgLUMOkJc/TeMY2jkmACI/AAAAAAAAAV0/VByHmoMa2N8/s1600/first+blog+posting.jpg','<pre class="prettyprint">\r\n<div>toto</div></pre>\r\n\r\n<p>dqsdqs</p>\r\n','toto','0',0,'2013-04-30 12:15:46','2013-04-30 12:15:46',NULL);
The result in my textarea when I try to edit the post :
<pre class="prettyprint">
</pre>
<div>toto</div>
<p>dqsdqs</p>
As you can see the "div" have changed of place.
EDIT2 ----- Escape HTML -------
Screenshot : http://grab.by/m8bs
As you can see it works in a P tag (just above the slug) but it doesn't work in my textarea. I think CKEditor encode my content but I don't know when and why... In my database everything is ok, I have the codes into the PRE tag.
Check these two plugins:
http://ckeditor.com/addon/insertpre
http://ckeditor.com/addon/syntaxhighlight
We use the first one on http://ckeditor.com/forum and it works very well.
Update: That's because you're not encoding HTML before you pass it to textarea. Use htmlspecialchars (or other similar function if you're not using PHP) to do that.
Update2: You are doing something wrong, but I don't know on what stage. The output data (editor.getData()) from the editor with one <pre> element is:
<pre class="prettyprint"><div></pre>
See that <pre> is not encoded, but <div> inside it is. Your examples show me that you "flattened" that structure - you have encoded both things equally when it should be:
<pre class="prettyprint">&lt;div&gt;</pre>
Note: &lt; is an encoded <.
You can use source menu in ck editor header to add your html
Use this tutorial
demo link
Okay Try This
for added Post
addslashes($_POST['post_from_textarea']);
to Edit
stripslashes($yourvairablegetRowsQuery)

jQuery conflict while using jslider with prototype and noConflict

Trying to resolve $ conflict between prototype.js and jQuery.js because I need to use jSlider which requires the jQuery library.
I add jQuery.noConflict() at the end of the jquery.js file then in the jslider.js file I change $._roundNumber to jQuery._roundNumber. Yet I still get an error which says jQuery._roundNumber is not a function. Please help.
Here is the example of integrating prototype and jquery...May check you did the right thing or not.?
<script src="prototype.js"></script>
<script src="effects.js"></script>
<script src="jquery.js"></script>
jQuery.noConflict();
jQuery(document).ready(function($){
jQuery("a").click(function(){
Effect.Shake('shake_demo');
});
});
<div id="shake_demo" style="width:150px; height:40px; background:#ccc; text-align:center;">
Click me to shake!
</div>
And now for rounding the number you can use this code:
var txt=jQuery('#txtBox').val());
var amt = parseFloat(txt);
alert(amt.toFixed(2);
https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Number/toFixed
Fixed. Just realised that the reason jQuery.noConflict() was not working was because jQuery was already being used in the template page that I was including in my current page so the problem was two fold:
'$()' which is the default jQuery selector was clashing with prototype.js which Tapestry includes by default
when I added jQuery.noConflict() at the end of my jquery.new.js file then tried using 'jQuery()' as the selector it did not work either because a different version of jquery (let's call this jquery.old.js) was already included in the template page (which I was including in my current page). To get the jquery.old.js to work with prototype.js, the previous developer already used jQuery.noConflict() so the 'jQuery()' selector was already taken as well.
Fix: I added $j2 = jQuery.noConflict() at the end of jquery.new.js file then I used '$j2()' selector in my new library that uses the jSlider and I also modified the selector in the jSlider.js file. It all works well now.
I am leaving both jquery.new.js and jquery.old.js file in the project (rather than using just one) because the template page which uses the older jquery version is used all over the site (I don't want to test the entire site after changing this) while the new component I'm adding needs the new version of jquery (jquery.new.js) file. And yes I know it's better to add the no conflict commands at the top of my html page rather than at the end of the js library files - will change that after this update on stack overflow :)

jasmine-jquery toBeDisabled not working

I have got following html
<a disabled="disabled"><img alt="First" src="/Content/Images/Grid/disabledFirst.png"></a>
And I run following expect on this html
expect($(element)).toBeDisabled()
where element is the selector for above html. The expect fails. Further investigation lead to following code in jasmine-jquery-1.3.1.js
toBeDisabled: function(selector){
return this.actual.is(':disabled');
},
which for some reason is returning false. I'm sure I'm missing something very basic here but just not able to spot it.
This fiddle shows that jQuery only finds inputs not anchors when using :disabled. It's understandable because the anchor element doesn't have the disabled property

dojo.xhrGet(): how to execute inline javascript?

simple question: How do I execute inline javascript in a HTML page snippet loaded with dojo.xhrGet()?
Being new to dojo I'm a bit confused this doesn't just work like in JQuery ...
Can anyone help??
Thanks,
thomas
We need more details! If you don't provide enough info you'll never get the right answer.
Anyway, if the HTML snippet is loaded inside a ContentPane, use a dojox.layout.ContentPane (is an extension to dijit.layout.ContentPane providing script execution).Or you could use one of the script tags that dojo accept. E.g:
<div dojoType=...>
<script type="dojo/connect" event="functionToConnectTo">
//javascript here
</script>
</div>
More valuable information about script tags on dojo parser reference.

Resources