editable href

by J. Jones

HTML

<table>
    <tbody>
        <tr>
            <td >
                <label>*URL</label>
            </td>
            <td >
                <div >
                    <div class="editableHRef" > <a href="dsad.cas">dsad.cas</a>
                    </div>
                    <input type="text" value="dsad.cas"  id="url0" style="display:none"/>
                <br/>
                </div>
            </td>
        </tr>
        <tr>
            <td >
                <label>Phone</label>
            </td>
            <td >
                <input type="text" value="432423" readonly="readonly" id="phone_number0"/>
                <br/>
            </td>
        </tr>
    </tbody>
</table>
<table>
    <tbody>
        <tr>
            <td >
                <label>*URL</label>
            </td>
            <td >
                <div >
                    <div class="editableHRef" > <a href="dasda.cas">dasda.cas</a>

                    </div>
                    <input type="text" value="dasda.cas" onchange="immediateEditItemInCart(this.value,'url',1,'cla','10')" class="mandatory1" id="url1" style="display:none"/>
                </div>
                <br/>
            </td>
        </tr>
    </tbody>
</table>

JavaScript

$('.editableHRef a').click(function () {
    var href = $(this).attr('href');

    // Redirect only after 500 milliseconds
    if (!$(this).data('timer')) {
        $(this).data('timer', setTimeout(function () {
            window.location = href;
        }, 500));
    }
    return false; // Prevent default action (redirecting)
});

$('.editableHRef').dblclick(function () {
    clearTimeout($(this).find('a').data('timer'));
    $(this).find('a').data('timer', null);

    $(this).parent().find('input').val($(this).find('a').text()).show().focus();
    $(this).hide();
});

$('#url0, #url1').each(
    function(index, element){
        $(element).blur(function(){
            if ($(this).val().length == 0)
                $(this).show();
            else
                $(this).hide().prev().show().find('a').html(this.value);
        });
    }    
);