my blade file
<form class="new-chat-form border-gradient" wire:submit.prevent="sendMessage" enctype="multipart/form-data">
<textarea wire:model="inputMessage" id="message" rows="1" placeholder="Send a message..."
onkeydown="handleKeyDown(event)" id="search-form"></textarea>
<button type="submit" class="form-icon icon-send sendButton">
<i class="feather-send"></i>
</button>
</div>
</form>
<p class="b3 small-text">{{ config('app.name') }} can make mistakes. Consider checking important information.
</p>
</div>
</div>
@script
<script>
function handleKeyPress(event) {
const textarea = event.target;
// Check if Enter key is pressed without Shift
if (event.key === 'Enter' && event.shiftKey === false) {
event.preventDefault();
@this.call('sendMessage');
}
// Check if Enter key is pressed with Shift
else if (event.key === 'Enter' && event.shiftKey === true) {
event.preventDefault();
const cursorPosition = textarea.selectionStart;
textarea.value =
textarea.value.slice(0, cursorPosition) +
'\n' +
textarea.value.slice(cursorPosition);
textarea.selectionStart = textarea.selectionEnd = cursorPosition + 1;
@this.set('inputMessage', textarea.value);
}
}
</script>
@endscript
i have tried this method but it says in console undefined function
and then i found livewire key modifiers , i tried them also
<form class="new-chat-form border-gradient" wire:submit.prevent="sendMessage" enctype="multipart/form-data">
<textarea wire:model="inputMessage" id="message" rows="1" placeholder="Send a message..."
wire:keydown.enter="sendMessage" wire:keydown.shift.enter="addNewLine" id="search-form"></textarea>
<button type="submit" class="form-icon icon-send sendButton">
<i class="feather-send"></i>
</button>
</div>
</form>
but while pressing enter form submits but when i click shift+enter then both function runs, sendMessage and addNewLine
how i can do form submit and add new line please help im stucked with this for a day
