Select and focus text in tag

Question

I have a div which gets edited on click and edited data is saved back.

Now i was to able get it focused, but somehow not able to select all text and also get the focus at end of text instead at start.

<div class="edit-section"> 
    <a>Name</a>
</div>

 <a href='#' class="edit">Edit</a>

jQuery

 $('.edit').click(function () {
        $(this).siblings('.edit-section').focus();
        $(this).siblings('.edit-section').attr('contenteditable', 'true');
        $(this).siblings('.edit-section').attr('style', 'border:2px solid;');

    });

I tried following but does not seem to work.

 $(this).siblings('.edit-section').focus(function () { $(this).select() });

Edit: New to jQuery

Have you wrapped your jQuery script with $(document).ready(function() { /* code here */ }); ? — Silviu Burcea, Aug 05 '14 at 07:54
See http://stackoverflow.com/questions/480735/select-all-contents-of-textbox-when-it-receives-focus-javascript-or-jquery and make sure to read the comments. — Jonathan Lerner, Aug 05 '14 at 07:55
Why use div along with ``contenteditable`` attribute? Cant the same can be achieved using ````? — Sarbbottam, Aug 05 '14 at 07:57
@adeneo This works and text is selected,but for some reason the edited data is not saved when i do this :( — Richa, Aug 05 '14 at 08:08
How do you focus "at the end of the text" and at the same time select all? — David Hellsing, Aug 19 '14 at 14:23
@David Select all is not done np,but it should atleast be focused at end of text — Richa, Aug 20 '14 at 04:59

score 2 · Accepted Answer · answered Aug 05 '14 at 07:55

2

I don’t think you can call .select() on contenteditables, but try using execCommand instead when the element is focused:

document.execCommand('selectAll', false, null);

Demo: http://jsfiddle.net/F65D3/

answered Aug 05 '14 at 07:55

David Hellsing

106,495
44
176
212

Mind if you explain a little why it works? This is new to me and I wanna learn about it. – Silviu Burcea Aug 05 '14 at 07:59
This works and text is selected,but for some reason the edited data is not saved when i do this :( – Richa Aug 05 '14 at 08:05
This code has nothing to do with data transfers, it just selects the text. Maybe you need to create another question for that problem. – David Hellsing Aug 05 '14 at 08:20
OK thanks.But how do i set focus at end of text instead of start – Richa Aug 05 '14 at 09:18
@Richa Avoid asking follow-ups in the comments. It’s better if you just create a new question instead. – David Hellsing Aug 05 '14 at 09:23

Select and focus text in tag

1 Answers1