How do you programatically remove (not disable) a button from TinyMCE? - tinymce

I can disable the table button using this:
tinyMCE.activeEditor.controlManager.get('divId_table').setDisabled(true)
but what I'm interested in is actually hiding it. Any idea on how to accomplish that?
Thank you!

First, you have to use the advanced theme.
Then, add this option in the TinyMCE init code.
tinyMCE.init({
...
theme_advanced_disable : "bold, justifyleft, justifyright"
});
I hope this might help someone.
source
list of elements' name here

I'm not familiar with TinyMCE myself, but since you appear to have javascript access to the element itself, all you need to do is set it's display property to "none".
document.getElementById("theButton").style.display = "none";

incase ur trying to hide a specific button, use the following code.
$('.mce_cut').hide() //hides cut button
lookup other button titles using firebug in case u wish to hide something specific.
Incase you are looking to hide specific editor's button, modifiy the jquery selector to select correct sibling/descendent.
alternately, try this ..
tinyMCE.activeEditor.controlManager.controls.ctl00_SPWebPartManager1_g_5005db96_e035_4197_a958_75f008b35061_ctl00_tbKeywords_cut.remove()
Note that ctl00_SPWebPartManager1_g_5005db96_e035_4197_a958_75f008b35061_ctl00_tbKeywords is my asp.net control's id. Don't bother about this if ur not using Asp.net serverside textbox control. In case you are.. <% theTextBoxID.ClientID %> gets u that.

Use the following (using jQuery; a non-jQuery approch is easily built):
var elem = $(ed.id+'_'+'divId_table')
elem.addClass('mceButtonDisabled');
elem.removeClass('mceButtonEnabled');

Related

Can I change "OK" button style in Select Dialog to emphasized?

anyone know if sapui5 provide solution/function to change button style in select dialog? I've checked the SAPUI5 sdk but there is none for this solution.
If you are OK with using "private" properties then you can use _oOkButton property of SelectDialog or else you can use _getOkButton function which also is kind of "private" and returns ok button instance.
Just use the instance of the Select Dialog and get all buttons using the following methods. Select Dialog is a dialog only, you can use the methods of sap.m.Dialog
Let say you have the instance of the dialog as oSlectDialog then
oSlectDialog.getButtons() - will return all the Buttons in the footer. You can use loop them and give custom class accordingly.
var oBtns = oSlectDialog.getButtons()
for(var b in oBtns) {
var oBtn = oBtns[b];//You can check for button instance, if you want to add custom class differently.
oBtn.addStyleClass("YourCustomClass");
}
You can also use the sap.m.Dialog methods like oSlectDialog.getBeginButton(), oSlectDialog.getEndButton().
Since UI5 1.62.0, the primary action OK (later renamed to Select) is automatically emphasized if the theme is sap_fiori_3.
https://openui5.hana.ondemand.com/#/entity/sap.m.SelectDialog/sample/sap.m.sample.SelectDialog
If it's not urgent, I'd suggest to avoid relying on private methods/ properties, but update to the latest UI5 version and themes.
Update: and since 1.70 (commit:1f421b0), the button is automatically emphasized in other supported themes too, such as sap_belize, sap_belize_plus
Related Github issue: https://github.com/SAP/openui5/issues/2254

TinyMCE get form content without using submit button

I'm trying to put TinyMCE on my website. I figured out how to get it to show up, but I'm lost on how to process the content. In their example, they just have a link that references the top of the page and clicking on it somehow magically causes their dump.php script to execute. I don't understand what's going on here. Here is the link:
http://www.tinymce.com/tryit/basic.php
The "Submit" button at the bottom is really a link in a span element with href="#". The form action is dump.php. I want to know how they configured this to run without an actual submit button. Any help in understanding this is greatly appreciated!
To Get Content From Tinymce You Can Use GetContent Method of Currently ActiveEditor Instance
tinyMCE.activeEditor.getContent();
method is used to getting Content .. to Set The Content
tinyMCE.activeEditor.setContent("I Want Text To Be in Tinymce");
to find a perticular element in tinymce get body and find element
var body = tinyMCE.activeEditor.getBody();
$(body).find("#elem_id")
to get a full html
tinyMCE.activeEditor.getDoc().documentElement.innerHTML
hope that helps ..
Since I use PHP, I found this which is also useful:
http://www.tinymce.com/wiki.php/TinyMCE3x:How-to_implement_TinyMCE_in_PHP

DropDownList with dirtyforms jQuery plugin

I'd like to use the jQuery plugin dirtyForms to check if my forms are dirty or not.
But it looks like the DropDownList is not based on the standard select HTML tag.
It seems instead that it's using HTML tag.
Why this choice ? Because of that the jquery plugin dirtyForms don't set my forms dirty when I just change a DropDownList value...
I know nothing about kendo-ui or dirtyForms so I will do my best to answer this by looking at the API. The kendo-ui DropDownList has a change event that looks to only get fired whenever the input in a DropDownList is changed. Additionally dirtyForms has a way of you manually setting the form to dirty. Putting the two together I would guess the following should work.
$("#dropdownlist").kendoDropDownList({
change: function(e) {
$('form').dirtyForms('setDirty');
}
});
Edit: Since you seem to want this to effect all DropDownList's, you might be able to do the following.
kendo.ui.DropDownList.fn._change = function(e) {
if(this.element && this.element.form)
$(this.element.form).dirtyForms('setDirty');
}
This seems kind of hackish and I am not sure if I would recommend doing it though. It might break other things.
This sounds like this is a bug that was fixed in pull request 27, which allowed for cross-browser compatibility with select elements.
Or, it could be that you have not properly ignored all of the 3rd party widgets on the page that have anchor elements in their markup.

Possible to click on link to change class on a different page?

Here is my goal: I want to click a specific link on one page, and on the page that loads, I want to change a specific class. I am aware of the onClick function, but not sure it can be used here. Is there a way to do this?
Thank you very much.
This jquery would do what you want:
$(document).ready(function(){
var anchor = '#myanchor';
if (window.location.href.indexOf(anchor) > 0) {
//do what you want here, change classes, etc
}
});
you should place this javascript on the second page, change #myanchor for your anchor used.
Make sure to include the jquery library in the second page for this to work.

Setting values to a form which is not rendered yet

I have a form within a tab. It is second tab so it doesn't render until you open it.
I have tried to submit data to the form with Ext.getCmp('DetailsForm').getForm().setValues(selections[0]); but it says that it is not a function. Probably because it is not rendered yet. What I have to do?
Set the deferredRender config property of your Ext.tab.Panel to deferredRender: false
That will force the rendering of all tabs instead of just active ones. Now the form will be there. As mentioned before I recommend you also to use myTabPanelRef.down('from').getForm().setValues(selections[0]); to access the form.
subscribe to the second tabs show event OR painted event
then look for the form preferably by using .down() method as this wont look with in the entire DOM.
set the values
Use render event of form panel.
Your code will be something like this -
Ext.getCmp('DetailsForm').on('render', function(){
this.getForm().load(selections[0]);
});