New-UDTinyMCE - Capture text

PowerShell Universal
1 
Product: PowerShell Universal
Version: 3.2

I know this is a component that Adam released separately recently, but really fits a need I have had for awhile. I am able to get it to display fine using this:

$TinyMCEOptions = @{
plugins = ‘advlist’, ‘autolink’, ‘link’, ‘image’, ‘lists’, ‘charmap’, ‘preview’, ‘anchor’, ‘pagebreak’,
‘searchreplace’, ‘wordcount’, ‘visualblocks’, ‘visualchars’, ‘code’, ‘fullscreen’, ‘insertdatetime’,
‘media’, ‘table’, ‘emoticons’, ‘template’, ‘help’
toolbar = ‘undo redo | styles | bold italic | alignleft aligncenter alignright alignjustify |
bullist numlist outdent indent | link | preview fullscreen |
forecolor backcolor emoticons | code | help’
menubar = ‘favs file edit view insert format tools table help’
icons = ‘material’
}
New-UDTinyMCE -Init $TinyMCEOptions

What I haven’t figured out yet is how to capture the text in it. There is the option of -OnEditorChange, but not sure how to get anything in this. Ideally, I see myself placing this in a form with other data I gather as they fill out information. In that case, I would just end up with a “save” button or something similar to get the text.

Any ideas?

2

Try using the $Body variable in OnEditorChange. It will return HTML. It’s kinda funny because if you use Show-UDToast it will actually format the toast content.

New-UDDashboard -Content {
    $TinyMCEOptions = @{
      plugins = ‘advlist’, ‘autolink’, ‘link’, ‘image’, ‘lists’, ‘charmap’, ‘preview’, ‘anchor’, ‘pagebreak’,
      ‘searchreplace’, ‘wordcount’, ‘visualblocks’, ‘visualchars’, ‘code’, ‘fullscreen’, ‘insertdatetime’,
      ‘media’, ‘table’, ‘emoticons’, ‘template’, ‘help’
      toolbar = ‘undo redo | styles | bold italic | alignleft aligncenter alignright alignjustify |
      bullist numlist outdent indent | link | preview fullscreen |
      forecolor backcolor emoticons | code | help’
      menubar = ‘favs file edit view insert format tools table help’
      icons = ‘material’
     }
    New-UDTinyMCE -Init $TinyMCEOptions -OnEditorChange {
        Show-UDToast $Body
    }
}

image

EDIT - I wrote a blog post about how to do this: Using TinyMCE with a Stepper Component in Universal Dashboard

3

So, that is looking a bit better. What I am hoping to do, though, is get the text in HTML format. Is there a way to get the output in html format?

4

It appears to be in HTML already. I think the only problem is that it has quotes around it.

New-UDDashboard -Content {
    $TinyMCEOptions = @{
      plugins = ‘advlist’, ‘autolink’, ‘link’, ‘image’, ‘lists’, ‘charmap’, ‘preview’, ‘anchor’, ‘pagebreak’,
      ‘searchreplace’, ‘wordcount’, ‘visualblocks’, ‘visualchars’, ‘code’, ‘fullscreen’, ‘insertdatetime’,
      ‘media’, ‘table’, ‘emoticons’, ‘template’, ‘help’
      toolbar = ‘undo redo | styles | bold italic | alignleft aligncenter alignright alignjustify |
      bullist numlist outdent indent | link | preview fullscreen |
      forecolor backcolor emoticons | code | help’
      menubar = ‘favs file edit view insert format tools table help’
      icons = ‘material’
     }
    New-UDTinyMCE -Init $TinyMCEOptions -OnEditorChange {
        $Body | Out-File C:\users\adamr\OneDrive\Desktop\test.txt
    }
}

image

image

5

I found that the $Body needs to be converted from Json.

$body | convertfrom-json | Out-file c:\temp\test.txt