Editor Events

There will be many events that you can leverage with the MarkdownX editor; however, currently there is only the main event, which let's you get the content from the editor.

If you were to use JavaScript, you can still get the content like you would from any normal textarea:

let content = document.getElementById('textarea_id').value;

In most cases you will be using this with another Livewire component. Let's use a Post component as an example. In this case you will want to leverage the markdown-x:update event that will be fired when the content is updated.

Here is an example of how you would use this event in a Livewire Post Model:

<?php

namespace App\Http\Livewire;

use App\Models\Post;
use Livewire\Component;

class Post extends Component
{
    public $body;

    protected $listeners = [
        'markdown-x:update' => 'updateBody',
    ];

    public function updateBody($value){
        $this->body = $value;
    }
}

In this 👆 example, the variable $body will contain the content from the MarkdownX component 👏.

Next, we will talk about some of the dropdown items you have available in the editor.