i've tried to insert element in ckinlne editor's current cursor position.
Is there any methods to insert Element in ckinline div's current cursor position?
It's quite simple actually. Replace editor1 with your editor id in the example below:
CKEDITOR.instances.editor1.insertHtml( '<p>This is a new paragraph.</p>' );
That example is from the official documentation at http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-insertHtml
Related
i got stuck 4 hours ago and i cant figure this out, how can i make the balance to go from 0.13 to $50.13?
Here is the code:
<li class="notranslate" id="Mata" translate="no">
Balance: $0.13</li>
Im trying to do this using the console in google chrome
If you set an id on the link like this:
<a id="link" href="/wallet">Balance: $0.13</a>
Then you can use:
document.getElementById("link").innerHTML = "Balance: $50.13";
If you are not able to set an id then you can do:
document.querySelector("link[href='/wallet']").innerHTML = "Balance: $50.13";
The chrome inspect tool also has a feature where if you click the icon in the top-left of the tool, it will let you select an element from the page. After selecting an element, you can refer to it in the console as $0. So you after selecting the link you could do:
$0.innerHTML = "Balance: $50.13";
Since you do not have an id assigned to your a tag, you can use document.querySelectorAll, which will return a list of elements that match the specified selector.
Then, you can access each element using its index number, which in your case is 0, since you have only one element.
To change the text, simply use the text property:
document.querySelectorAll("a[href='/wallet']")[0].text = "Balance: $50.13";
How to remove anchor tag '' in java script?
When I inspected the page, below is the screenshot of what I got
Here is my code:
<div class="dropdownm1-content">
<b>SHOP ALL</b>
<b>SHOP BY CATEGORY</b>
<p class="mn_category">
Just get the Element by using the ID of it and then remove it with the remove() function. Like so:
var removeanchor = getElementById('YOURANCHORTAGID');
removeanchor.remove();
or without creating a variable:
getElementById('YOURANCHORTAGID').remove();
(replace YOURANCHORTAGID with the id of your anchortag). If you want to trigger this after an action just create a function and trigger it with the action you want :).
for further information check the mdn docs:
https://developer.mozilla.org/de/docs/Web/API/ChildNode/remove
You may should add some more information to your question for a more precise answer. However, for the time being this may helps you out.
If you try to use it, pay attention to the fact, that I only adressed the first Element with the class 'text_main' and only the first of its children with 'a' Tag. You may need to change this, according to your code.
// Removing a specified element without having to specify its parent node
container = document.getElementByClass("text_main")[0];
var node = document.getElementsByTagName("a")[0];
if (node.parentNode) {
node.parentNode.removeChild(node);
}
Further information:
https://developer.mozilla.org/en-US/docs/Web/API/Node/removeChild
For that specific link you showed:
document.querySelector('.dropdownm1-content .text-main a:first-child').remove()
Though I'd highly recommend curing the sickness, not the symptom.
I want to track clicks on the following button/link with Google Tag Manager. I created a trigger in Google Tag Manager that triggers when the element_id = 100. This works fine, except that when I click exactly on the text, it doesn't do anything, the link looks like a button, with the text in the middle of it. I can't change anything to the html or css, otherwise I can think of multiple things, so I need to find a solution without changing the html. Also, the 'myclass' class and the 'label' class get used in other elements.
<a class="myclass" id="100" href="http://www.url.com">
<span class="label">Text</span>
</a>
Anyone an idea?
Thanks a lot,
The following workaround worked:
Create trigger when element text contains "Text". This will trigger events on the button and the label on the button, of all buttons with "Text" as label.
Create tag for that trigger that checks with simple javascript if either the id of the current element = 100, which will happen when you click the button but not the label, or that the id of the parent = 100, which happens when you click the label. You can get the element that triggered the tag using the built-in variable "Click Element". Which you need to access the parent element.
Technically, you shouldn't have a CSS ID that starts with (or is) a number, so not sure if your code example is accurate or not. Whatever the case, you're probably better off using "matches CSS selector" so that you don't need to use any custom JS.
If indeed your HTML uses id="100", then the above will work. If it's anything else that doesn't start with a number, then you can use
#whatever > span
I have dynamically created a table using JSON inside a function . I could not find a way to apply the the qtip.js and its style to this dynamically created html table. Can anyone tell me a way to apply styles and qtip.js inside a jQuery function?
Could you add some sample code on jsfiddle.net ?
Did you consider about naming the html table in anyway and set the css rules anyways, so the come in place as soon as the table is rendered ? otherwise you could apply the styles after the table has been created by $('table').css("width","200px");
Just obtain a reference to the element you dynamically created and apply qTip accordingly:
var table = $('<table></table>')
.appendTo('body')
.qtip({
content: 'This is an empty table.',
show: 'mouseover',
hide: 'mouseout'
})
Please note the remark mentioned WORKAROUND at the end of this question.
Based on a Dictionary based specification, one of my classes creates a Form programmatically.
Adding TextInput or DatePicker to FormItemss works as expected.
Unfortunately, the following code just creates a colored rectangle, not the actual picker:
ti = new ColorPicker();
ColorPicker( ti ).selectedColor = TAColor( _spec[ key ].value ).color;
and later on
formItem.addElement( ti );
The Form is embedded in a TitleWindow component presented using
PopUpManager.addPopUp(...);
When added to TitleWindow, it shows up correctly, within Form->FormItem not:
I can't image, why the picker doesn't appear. Do you?
WORKAROUND:
If I wrap the ColorPicker inside a Group things work:
ti = new Group();
Group( ti ).addElement( new ColorPicker() );
In this case, the ColorPicker appears as editable.
Still, I'd be too happy to learn what the problem with my initial solution. Bug?
A DateField (which extends ComboBase like ColorPicker) behaves properly in a spark Form. But in the ColorPicker, the mouse down handler of the button never gets called. I think that maybe the skin part that handles the mouse clicks (it must be a button) is not properly dimensionned, and the result is it is not shown. I've come to this conclusion because within an mx Form, the ColorPicker doesn't display as it does when it is added to the regular displaylist...
Hope this helps...
In the code you've provided, you never add the colorPicker as a child to any parent container; as such it will never show up anywhere.
You probably need to do something like:
formItem.addChild(ti );
[or for a Spark formItem]:
formItem.addElement(ti );
I'm confused as to why you're seeing a rectangle.