We Keep Coding

JS Summernote Filling Two Elements

I have a piece of code that grabs the value from a summernote input area and places it into another element (#intro_one) within an iframe on my page.
var intro1 = $('#intro-summernote').code();
previewContent.find('#intro_one').html(intro1);
This works fine, however i am also trying to insert the same value within another element.
previewContent.find('#intro_one_mobile').html(intro1);
This one does not work. I have tested populating the "#intro_one_mobile" with dummy data and it inserts correctly, when trying to reuse (insert) the summercode value into more than 1 element, it doesn't work.
Any input here would be great, thanks

Issues with tinyMCE and 'mceAddEditor'

So I have a page that uses JavaScript to dynamicaly add <textarea>s. I need these text areas to use tinyMCE. I am using tinyMCE v4.
I have an init function for tinyMCE
function TinyMceEditConfig() {
tinymce.init({
selector: '.editor'
});
}
then i call the function
TinyMceEditConfig();
then i create dynamic text areas. Basically, someone selects they want to enter text from a drop down list. once they select it the text area is generated. when a user clicks the dropdown it calls a function that contains this code (my brackets may be messed up here...dont pay attention to that, lol, they are fine in my code, just look at the meat)
return $('<div>', {
'css': {'display': 'none'},
'html': [
$('<textarea>', {
'value': this.text_value,
'placeholder': this.placeholder_text,
'class': "editor"] });
};
so at this point, i can click the dropdown to generate the text area (plain text). if i refresh the page tinyMCE kicks in and everything is fine. looking around online the following code is supposed to fix my problem so that tinyMCE will show as soon as the field is added. this is in my code immidiatly after i call the last code snipit.
tinymce.EditorManager.execCommand('mceAddEditor', false, ".editor");
however, it does not.....any advice?

You can't call init() on a textarea until it exists on the page. If I understand your comments above you are first invoking your TinyMCE init() function and then later adding textarea elements to the page. This won't work as the init() will only handle things that already exist on the page.
When you dynamically add the new textarea to the page you then need to call tinymce.init() after the textarea is part of the DOM in order to have TinyMCE appear in place of the textarea.
It might help to create a TinyMCE Fiddle (or CodePen etc) to show what you are actually doing as that might help people see where things are failing.

Lose selection after inserting in word using office.js

Im builing an office app that will run inside Microsoft Word. I'm using office.js create it.
So far I have been able to insert text into the document using the API, but the text it inserts, appears selected, making the app UX suffer since the user has to make one extra click to lose focus to insert another text without replacing the inserted one.
Here is how the code looks like:
function insertEquation()
{
Office.context.document.setSelectedDataAsync("`x = (-b +-sqrt(b^2-4ac))/(2a)`", { coercionType: 'text' });
}
I just want the text not to appear selected.
Thanks in advance.

To insert some text in the document I would insert a Paragraph like so:
function insertText(text) {
Word.run(function (context) {
context.document.body.insertParagraph(text, Word.InsertLocation.start);
});
}

how to display text in 2 columns

I'm using TinyMCE in ModX CMS.
Do you have any idea how can I display text written in wysiwyg in 2 columns, and if possible coulms should be similar height, width must be the same.
There is no option (button) to insert table using TinyMCE.
1 option is to click on html icon and create table with 2 columns, but person who will manage the content won't be able to do it.
I thought it could be JavaScript, jQuery maybe. But how will I count text and split it in the right place. Any ideas?

You can place an external button with the following:
<button onclick="tinyMCE.activeEditor.execCommand('mceInsertContent',false,'<table><tr><td>TEXT</td><td>TEXT</td></tr></table>');return false;">Insert table</button>
This will insert the code on the cursor position. You can take a look here too for more info:
TinyMCE Command Identifiers

How can I put masked date input in a dynamically created text field?

I am using jquery date input plugin from here
I call the function inside the html page like this
jQuery(function($){
$("#date").mask("99/99/9999");
});
It works fine in every fields where we just have to specify the id of the element.
I have a table which creates table rows of html elements dynamically, I want the date input plugin to apply date mask in the text box having mfd date.
Since the id keeps changing dynamically as the row length is being added one by one to the id to make the id unique.
How can i use the masked date input inside the dom table ?

You could do the work inside your insSpec function, where you have both the ID and the markup at your disposal.
Without using the ID:
$(f).find('input[name^="mfd_date"]').mask('99/99/9999');
Using the ID:
$(f).find('#mfd_date'+rl).mask('99/99/9999');
And since that cell really only has one input, you only need to look for the input
$(f).find('input').mask('99/99/9999');
Or you could emit an event after the new row has been created and attach the mask to the last row in the table always, or even pass the last row as data to the event listeners.

It is a good idea to use a permanent class. If you use ajax, maybe you need to use callback function to wait for a code loaded before you apply the mask. You can also use a bordering div or span tag around your input tag with the permanent id. If you have constant amount of input in form you can use
$('table input[type=text]').eq(n)
,where n in eq(n) is item number in the sequence of inputs