Merhaba arkadaşlar;
Bir tablom var ve bu tablodaki <td> etiketlerine çift tıklandığında contenteditable="plaintext-only" attributesi ekliyorum. Ancak eleman contentedible olunca focuslanabilmek için 3. tıklamaya ihtiyaç duyuyor. Eleman contentedible olunca doğrudan focuslanabilmesini istiyorum.
const HandleEnterEditMode = (
e: MouseEvent & {
currentTarget:
EventTarget
& HTMLTableCellElement;
}) => {
isEditMode = true
// cift tıklanan elaman
const element = e.target as HTMLTableCellElement
// cursoru elemanin icindeki son elemana getirmek icin
const selection = window.getSelection()
const range = document.createRange()
range.setStart(element,element.childElementCount)
range.setEnd(element,element.childElementCount)
selection.removeAllRanges()
selection.addRange(range)
element.focus()
context.set({
identifier,
data
})
}
<td
on:keydown={HandleEdit}
on:dblclick={HandleEnterEditMode}
on:click={HandlerLeaveEditMode}
on:keyup={HandlerLeaveEditMode}
contenteditable={(isMutable && isEditMode) ? 'plaintext-only' : 'false'}
class="border px-2 py-2 hover:bg-blue-100 outline-1 outline-blue-100 transition-colors duration-100">
{
hasConversion && hasConversion.convert(data) || data
}
</td>
element 3 contentedible ama focuslu değil
