I just learned about contenteditable
and I would like to use it in my project here.
So, I have mented out on("click", ..)
for <p>
and I have added that attribute to it in the HTML.
But, the content is not editable. I am not sure why it is not working. I also added the DOCTYPE
but it made no difference. There is not error in the console.
Can anyone please point me in the right direction?
jsFiddle
EDIT:
Recreating the problem: Try adding an item with the Add
button. Now, if you click on the newly added item, it should be editable, but it isnt.
I just learned about contenteditable
and I would like to use it in my project here.
So, I have mented out on("click", ..)
for <p>
and I have added that attribute to it in the HTML.
But, the content is not editable. I am not sure why it is not working. I also added the DOCTYPE
but it made no difference. There is not error in the console.
Can anyone please point me in the right direction?
jsFiddle
EDIT:
Recreating the problem: Try adding an item with the Add
button. Now, if you click on the newly added item, it should be editable, but it isnt.
- @Teemu Please see my edit above. – Rahul Desai Commented Jul 14, 2014 at 17:38
- But it is editable (FF30) ... Is this happening in a specific browser only? – Teemu Commented Jul 14, 2014 at 17:40
- 2 @Teemu I'm using FF30 and it isn't editable when I create a new item and try to edit the item I've created. – RevanProdigalKnight Commented Jul 14, 2014 at 17:42
-
@RahulDesai Looking at the developer console, it looks like when I'm clicking on the text after adding a new item, it's hitting the
<li>
and not the<p>
– RevanProdigalKnight Commented Jul 14, 2014 at 17:45 - Yea, your ui.sortable is blocking access. – StaticVoid Commented Jul 14, 2014 at 18:04
1 Answer
Reset to default 14I had to explicitly add focus
to the p
using the onclick
event.
Should be working: http://jsfiddle/csTS7/130/
See line 209:
"<p class='item_content' contenteditable='true' onclick='$(this).focus();'>"+$("#new_todo_item").val()+"</p>"
Update:
I just noticed you mentioning that you mented out the onclick event. If you unment that and change the contents to $(this).focus();
it will function as expected.
Either solution works, but the latter is cleaner.