Goal: Get selected element into another element and remove selected text from existing element then place the new element where the text previously existed but as a new element.
Get the selected text:
selectedText = tinymce.activeEditor.selection.getContent()
Create new element with selected text:
newTextNode = tinymce.activeEditor.dom.create('span', {class: value}, selectedText);
Now i need to remove the selected text from the element and place it as the new element exactly where it was before.
How do i do that?
Related
I've header menu configuration added in my nat table as follows,where I've included "Select Columns" menu as well:
// Popup menu
this.natTable.addConfiguration(new HeaderMenuConfiguration(this.natTable) {
#Override
protected PopupMenuBuilder createColumnHeaderMenu(NatTable natTable) {
return super.createColumnHeaderMenu(natTable) .withColumnChooserMenuItem(); }
});
// Column chooser
DisplayColumnChooserCommandHandler columnChooserCommandHandler = new DisplayColumnChooserCommandHandler( bodyLayer.getSelectionLayer(), bodyLayer.getColumnHideShowLayer(), columnHeaderLayer.getColumnHeaderLayer(), columnHeaderLayer.getColumnHeaderDataLayer(), columnHeaderLayer.getColumnGroupHeaderLayer(), columnGroupModel);
//If header name consists of multiple words then I've used ("\n") as a separator between words in
//the header column name ,so that some space could be saved
// In that case on opening "Select Columns" context menu dialog only first word of column is visible
Can it be fixed by replacing all "\n" and white space character by single white space(" ") character in
In org.eclipse.nebula.widgets.nattable.columnChooser.gui.ColumnChooserDialog
//code to replace extra white spaces or new line character from column label with single space so that //header name is completely visible in populate tree method
treeItem.setText(columnEntry.getLabel());
In that case can fix be provided to replace extra space with single space in column header name or is there any other alternative to fix it?
Image with header names having multiple words For eg:"Issue Date",if header name is dispalyed as "Issue\nDate",only Issue is visible in "Select Columns" context menu dialog
IIRC you add the line breaks to save some space. They are not needed for any semantical reason. I would suggest to configure the TextPainter that renders the column header cell content to wrap automatically if not enough space is available. This could look like this for example:
configRegistry.registerConfigAttribute(
CellConfigAttributes.CELL_PAINTER,
new BeveledBorderDecorator(new TextPainter(true, false, false, true)),
DisplayMode.NORMAL,
GridRegion.COLUMN_HEADER);
Hi I just created the ionic accordion dropdowns by following a tutorial blog link which used widgets for creating an accordion dropdowns, Below is the link of that blog.
http://masteringionic.com/blog/2019-01-27-creating-a-simple-accordion-widget-in-ionic-4/
updated: here is the my project demo link https://stackblitz.com/github/dSaif/search-accordion
Everything is working perfect, but i want to add Ion-searchbar at the top of the accordions sothat the dropdowns gets filter by inputing text.
please assist me how can i do that. Thank you.
You are going to have to create a variable in your homepage to store your filtered results. Then you need to have a filter function that will take the input from the search bar and filter your master list. Keep in mind you should not set the new variable to the master list, this could cause issues due to object referencing.
So you should have something like
in your html
<ion-searchbar placeholder="Search a name." [(ngModel)]="searchValue" (ionChange)="filterList()"></ion-searchbar>
In your ts file
searchValue: string = '';
filteredList: Array<{ name: string, description: string, image: string }> = this.technologies;
// function called in the html whenever you change the ion searchbar value
private filterList(){
//Make a variable so as to avoid any flashing on the screen if you set it to an empty array
const localFilteredList = []
this.technologies.forEach(currentItem => {
//here goes your search criteria, in the if statement
if(currentItem.name && currentItem.name.toLowerCase().includes(this.searchValue.toLowerCase())) {
localFilteredList.push(currentItem);
}
});
//finally set the global filter list to your newly filtered list
this.filteredList = localFilteredList;
}
You also need to make sure to reference the filterList variable instead of the current one you are referencing.
How to prevent select change event fires when the select biding is initiated? an add button on the page that will add select dynamically to the DOM. when each select box is adding to the DOM, the change event is firing rather than I select the item from the select?
The thing is that KnockoutJS attempts to find which element of your listbox matches the requiredItem observable. There is none in the beginning, which is why it then attempts to set it to the "caption" of the listbox. You did not provide one, so it sets requiredItem to the first element of the listbox.
What you could do is add a caption item to your array:
self.requireditems = ko.observableArray([
{ desc: "Select an option from the list...", key: 0, editable: false } // ... and then all other items]);
and if you really don't want requiredItem to be updated:
self.selectedItem = ko.observable(self.requiredItems()[0]);
Then if you want to know if a valid element has been selected from the list, you could add the following property:
self.isValidSelectedItem = ko.computed(function() {
return self.selectedItem().id;
});
I have a SelectItem object which has a few items. I set a value MAP with:
organizations[0] = "A";
organizations[0] = "B";
selectItem.setValueMap(organizations);
When displayed, the combo box is showing "A" as selected item. Then, I need to programatically select value "B" and select this on the current SelectItem object. I've been looking all over the place with no avail.
Anyone?
If you want any option of selectItem to be manually selected, then you should try following:
selectItem.setValue("B");
After doing this when you open the picklist of the selectItem, value "B" will be highlighted.
I am trying to insert id and name for image inside tinymce.
var content=tinyMCE.get('faq_answer').getContent()+"--img tag is given here--";
I can add image inside tinymce by giving alt, title but i cant add id and name.
If you want to add an element at the end of your editors content i would do something like this (this way you do not have to get all the editors content and set it again):
var doc = ed.getDoc();
// create a new img element
var img = doc.createElement('img');
img.title = 'title';
img.src = '/images/my_image.gif';
img.id = 'my_id';
img.name = 'imagename';
// add the new img element to the dom
ed.getBody().appendChild(img);
Some attributes may vanish (be cleaned up) depending on the configuration of valid elements. If this configuration is not set a standard rule set will apply. You may extend this rule set using the extended valid elements option. There is a nice example concerning img elements :)