How can I show these thumbnails by default?
Live code example here
I am using Fancybox api for open lightbox by click.
$.fancybox.defaults.buttons = ["zoom", "thumbs", "close" ];
$('.fancybox-btn').click(function () {
$.fancybox.open([
{
src : 'http://placehold.it/300x200?text=1',
opts : {
thumb : 'http://placehold.it/300x200?text=1'
}
},
{
src : 'http://placehold.it/300x200?text=2',
opts : {
thumb : 'http://placehold.it/300x200?text=2'
}
}
]);
});
Add thumbs : { autoStart : true, }, option to second argument of $.fancybox.open:
{
loop : false,
thumbs : {
autoStart : true,
},
}
I am using jsTree latest version in one of my application.
I want certain checkboxes to be disabled by default.
For that i am referring this.
I have following jstree code:
$("#"+"div_"+aspectid).jstree({
'core' : {
"themes" : { "icons" : false },
'data' : {
'url' : 'include/ajax.php?option=constructtree',
'data' : function (node) {
return { aspectcode : aspectcode, geographylevel : geographylevel };
}
}
},
"types" :
{
"types" : {
"disabled" : {
"check_node" : false,
"uncheck_node" : false
}
}
},
"plugins" : ["themes","html_data","ui","crrm","types", "checkbox"],
"checkbox" : { "two_state" : true }
});
I have added rel=disabled in the li tags
<li id=$childvalue[code] rel='disabled'>
I am not getting any errors and i am able to check and uncheck the node.
What could be the issue?
provide filddler for same.
Inorder to disable check box and make it not to check and uncheck use "onclick= return false"
This functionality has been changed in more recent versions of jstree.
With 3.2, to disable a checkbox set the data-jstree attribute on the LI tag.
<li data-jstree={ "checkbox_disabled": true }>
I have a simpledialog2 box, its fully functional but im trying to work out a way to call a function when its been loaded.
For example i have
$('<div>').simpledialog2({
mode : 'blank',
animate : false,
transition : 'none',
// dialogAllow : true,
// dialogForce : true,
headerText : 'Statement Metadata',
blankContent : "HTML HERE"
});
After HTML HERE has been loaded what event is fired? Or how can i call javascript once the simpledialog2 is fuly ready?
Similar to pageshow event handler...
Try the following:
$('<div>').simpledialog2({
mode : 'blank',
animate : false,
transition : 'none',
// dialogAllow : true,
// dialogForce : true,
headerText : 'Statement Metadata',
blankContent : "HTML HERE",
callbackOpen: function() {
var me = this;
alert('opened');
setTimeout(function() {me.close();},2000);
}
});
Fiddle:
http://jsfiddle.net/ykHTa/62/
I am using swfupload and wanted to notify the user that they need flash installed for this to work.
I found this: http://swfupload.org/forum/generaldiscussion/2140 although have no idea where I need to implement this.
This is my code:
<script type="text/javascript">
var upload0, upload1, upload2, upload3, upload4, upload5;
window.onload = function () {
upload{$smarty.section.r.index} = new SWFUpload({
// Backend settings
upload_url: "{$REQUEST_URL}{if $swfcallbackid}/id/{$swfcallbackid}{/if}?swfcb={$row.formname}&{php}echo session_name();{/php}={php}echo session_id();{/php}",
file_post_name: "{$row.formname}",
post_params: {"{php}echo session_name();{/php}" : "{php}echo session_id();{/php}"},
// Flash file settings
file_size_limit : "500MB",
file_types : "{$row.mask|default:"*"}", // valid file type mask
file_types_description : "{$row.mask_desc|default:"All Files"}",
file_upload_limit : "0",
file_queue_limit : "1",
// Event handler settings
//swfupload_loaded_handler : swfUploadLoaded,
file_dialog_start_handler: fileDialogStart,
file_queued_handler : fileQueued,
file_queue_error_handler : fileQueueError,
file_dialog_complete_handler : fileDialogComplete,
//upload_start_handler : uploadStart, // I could do some client/JavaScript validation here, but I don't need to.
upload_progress_handler : uploadProgress,
upload_error_handler : uploadError,
upload_success_handler : uploadSuccess,
upload_complete_handler : uploadComplete,
// Button Settings
button_image_url : "{$HOME}/webapp/shared/swfupload/XPButtonUploadText_61x22.jpg",
button_placeholder_id : "{$row.formname}_button",
button_width: 63,
button_height: 23,
button_window_mode: "TRANSPARENT",
// Flash Settings
flash_url : "/webapp/shared/swfupload/Flash/swfupload.swf",
custom_settings : {
progressTarget : "{$row.formname}_progress",
cancelButtonId : "{$row.formname}_cancel",
filenameDisplayId : "{$row.formname}"
},
// Debug settings
debug: false
});
}
</script>
I have a javascript code like this.
after_add_content_for_popup = "<div><div><textarea name='notes' rows='10' cols='17' class='rich' id='parent_note_content'>"+notecontent+"</textarea></div><div style='float:right;margin-left:20px;padding-left:10px;'><input id='submitbutton' class='flat_btn' style='margin-top:5px;' type='button' title='Edit category note' value='Save' name='submitbutton' onclick=\"update_category_note('P','"+categoryid+"','"+noteidnew+"');\"></div></div>";
document.getElementById('parent_insert_div').innerHTML='';
document.getElementById('parent_insert_div').innerHTML = after_add_content_for_popup;
but it shows only the textarea not the tinymce editor.
You don't appear to be adding TinyMCE in the first place. Please look at the sample code on this page:
http://fiddle.tinymce.com/
Note the code used to add TinyMCE with various options:
tinyMCE.init
({
// General options
mode : "textareas",
theme : "advanced",
plugins : "autolink,lists,spellchecker,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,imagemanager,filemanager",
// Theme options
theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,fontselect,fontsizeselect",
theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,spellchecker,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,blockquote,pagebreak,|,insertfile,insertimage",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,
width: "100%",
height: "400"
});
So, after including the TinyMCE JS files, you have to also initialize TinyMCE using the code above or something like it.