Alexis Alexis - 10 months ago 67
jQuery Question

Converting span to input upon click

I have converting spans to input upon clicking and when click outside it becomes span again. But it just converts for once and then doesn't happen again

Here is the code.

$(function () {
$(document).on('click', 'span.loadNum', function () {
var input = $('<input />', {
'type': 'text',
'name': 'unique',
'value': $(this).html()

$(document).on('blur', 'input', function () {
$(this).parent().append($('<span />').html($(this).val()));

And spans

<span class="loadNum">Hasha</span>
<span class="loadNum">dbhfb</span>

Also can anyone tell how to achieve this that when I press enter on converted input tag it should submit an ajax call.

Answer Source

When you re-add the span, it doesn't have a class. So the span.loadNum selector won't identify it. Add the class:

$(this).parent().append($('<span />').addClass('loadNum').html($(this).val()));