Last active
February 8, 2023 22:18
-
-
Save tanthammar/20a70865415f9f84ec4cca054f3b8396 to your computer and use it in GitHub Desktop.
Livewire trix input
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@push('body-styles') | |
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/trix/1.2.0/trix.css"> | |
@endpush | |
<form x-data="form()"> | |
<input x-ref="description" id="description" name="description" value='{{ $description }}' type="hidden" /> | |
<div wire:ignore> | |
<trix-editor input="description"></trix-editor> | |
</div> | |
<input x-ref="info" id="info" name="info" value='{{ $info }}' type="hidden" /> | |
<div wire:ignore> | |
<trix-editor input="info"></trix-editor> | |
</div> | |
<button x-on:click.prevent="save">Save</button> | |
</form> | |
@push('scripts') | |
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/trix/1.2.0/trix.js"></script> | |
<script> | |
function form() { | |
return { | |
save() { | |
window.livewire.emit('alpineSave', { | |
info: this.$refs.info.value, | |
description: this.$refs.description.value, | |
}); | |
} | |
} | |
} | |
</script> | |
@endpush | |
//livewire component | |
protected $listeners = ['alpineSave']; | |
public function alpineSave($array) { | |
$this->fill([ | |
'info' => data_get($array, 'info'), | |
'description' => data_get($array, 'description'), | |
]); | |
// save the data ... | |
} |
Anyone had issues with not being able to pasting using this setup?
the upload is not adding up. Initial wire:model does not hold the uploaded image. Any assistant to handle the uploaded images and text together in the same livewire component? Thank you
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I init the array in the mount function and it worked :
the problem is solved with version v2.3.6 of livewire