edit the price textfield without clicking on textfield

Question

we are using following code to update the price.

Now we have to click on the Textfield to edit the price.

but what we need is without clicking on the textfield it should be editable.

Means once we click on the text field ,than only its allowing to edit.

but without clicking on the textfield it should be editable.

Php

    <span class="label pro_status">
        <?php //echo $products->getPrice(); ?>                              

        <span class = "ama1"  id="valueprice_<?php echo $products->getId(); ?>"
        onclick="showFieldPrice('<?php echo $products->getId(); ?>');"><?php echo $products->getPrice(); ?></span>


        <input class="ama1" type = "text" id = "price_<?php echo $products->getId(); ?>" onkeydown="validateNumbers(event)" "name = "price" value = "<?php echo $products->getPrice(); ?>" style = "display:none"/>
        <span class="label wk_action" id="edit_link_<?php echo $products->getId(); ?>">



        <p id="updatedprice_<?php echo $products->getId(); ?>" style = "display:none;color:red; position:relative; top:16px;">Updated</p>
        <br/>



 <button id="price_update_button_<?php echo $products->getId(); ?>" class="update" onclick="updateFieldPrice('<?php echo $products->getId(); ?>'); return false;" style="display:none" >
         <span><span style="font-size:12px;"><?php echo $helper->__('Update') ?></span></span>
         </button>
         <button id="price_reset_button_<?php echo $products->getId(); ?>" type="reset" class="cancel" onclick="hideResetPrice('<?php echo $products->getId(); ?>'); return false;" style="display:none" >
         <span><span><?php echo $helper->__('Cancel') ?></span></span>
         </button>                                                       
        </span> 

JS

function showFieldPrice(product_id)
        {

            var qtyId='#price_'+ product_id;

            var editLink="#price_edit_link_"+ product_id;
            var valueprice="#valueprice_"+ product_id;
            var updateButton="#price_update_button_"+ product_id;
            var resetButton="#price_reset_button_"+ product_id;

            $wk_jq(qtyId).show();
            $wk_jq(valueprice).hide();

            $wk_jq(editLink).hide();
            $wk_jq(updateButton).show();
            $wk_jq(updateButton).prop('disabled', false);//just in case
            $wk_jq(resetButton).show();

            return false;


        }

Answer 1

<td>
<span class="label pro_status">
<?php //echo $products->getPrice(); ?>




<input class="ama1" type = "text" id = "price_<?php echo $products->getId(); ?>" onkeydown="validateNumbers(event)" "name = "price" value = "<?php echo $products->getPrice(); ?>" onchange="updateFieldPrice1('<?php echo $products->getId(); ?>')" style = ""/>




<p id="updatedprice_<?php echo $products->getId(); ?>" style = "display:none;color:red; position:relative; top:16px;">Updated</p>
<br/>




</span> </td>


function updateFieldPrice1(product_id)
{
var priceId = '#price_'+ product_id;

var updatedqty = '#updatedprice_'+ product_id;



var url ='<?php echo Mage::getUrl('marketplace/marketplaceaccount/updateFieldPrice/')?>';





$price = $wk_jq(priceId).val();



new Ajax.Request(url, {
method: 'post',
parameters: {id: product_id, price: $price},
onComplete: function (transport) {
//alert(transport.responseText);



jQuery(updatedqty).show().delay(2000).fadeOut();








}
});
}