Selecting text on focus using jQuery not working in firefox

Question

I have the following jQuery code that works in Chrome, but fails (no errors, just doesn't work) in firefox. When i try to select the text inside the textbox using double click on mouse its not selecting the text the cursor goes to the start of the text.Any ideas how to fix this?

my jqueryandajax

$(document).ready(function () {

    $('td.edit').click(function () {
        $('.ajax').html($('.ajax input').val());
        $('.ajax').removeClass('ajax');
        $(this).addClass('ajax');
        $(this).html('<input id="editbox"  size="' + $(this).text().length + '" type="text" value="' + $(this).text() + '">');
        $('#editbox').focus();
    });

    $('td.edit').keydown(function (event) {
        arr = $(this).attr('class').split(" ");
        if (event.which == 13) {
            $.ajax({
                type: "POST",
                url: "supplierprice/config.php",
                data: "value=" + $('.ajax input').val() + "&rowid=" + arr[2] + "&field=" + arr[1],
                success: function (data) {
                    $('.ajax').html($('.ajax input').val());
                    $('.ajax').removeClass('ajax');
                }
            });
        }
    });

    $('#editbox').live('blur', function () {
        $('.ajax').html($('.ajax input').val());
        $('.ajax').removeClass('ajax');
    });
});

My html

<html>

    <table id="sorting" class="tablesorter" style="width: 100px; table-layout: fixed;" >

    <thead>
    <tr>
    <th>6xxA <span>  <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 17px"></span>
    <th>6xxB <span>  <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 21px"></span>
    </th>
    <th  >10xx <span> <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 32px"></span>
    </th>
    <th >11xx <span> <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 32px"></span>
    </th>
    <th >12xx <span> <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 32px"></span>
    </th>
    <th >11xx <span> <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 32px"></span>
    </th>
    </tr>


    </thead>


    <tbody >
    <?php
    $dbHost = 'localhost'; // usually localhost
    $dbUsername = 'fms';
    $dbPassword = 'xxxxxxxx';
    $dbDatabase = 'fms';
    $db = mysql_connect($dbHost, $dbUsername, $dbPassword) or die ("Unable to connect to Database Server.");
    mysql_select_db ($dbDatabase, $db) or die ("Could not select database.");



    $sql = mysql_query("SELECT * FROM supplierprice");


    while($rows=mysql_fetch_array($sql))
    {

    if($alt == 1)
            {
               echo '<tr class="alt">';
               $alt = 0;
            }
            else
            {
               echo '<tr>';
               $alt = 1;
            }

    echo '  <td class="edit region '.$rows["supp_price_id"].'">'.$rows["region"].'</td>
            <td class="edit country '.$rows["supp_price_id"].'">'.$rows["country"].'</td>
            <td class="edit networkname '.$rows["supp_price_id"].'">'.$rows["networkname"].'</td>
                <td class="edit mcc '.$rows["supp_price_id"].'">'.$rows["mcc"].'</td>    
                <td class="edit mnc '.$rows["supp_price_id"].'">'.$rows["mnc"].'</td>
                <td class="edit mnp '.$rows["supp_price_id"].'">'.$rows["mnp"].'</td>

                   </tr>';


    }

    ?>


    </tbody>


    </table>

    </body>
    </html>

[see here](http://stackoverflow.com/questions/7046798/jquery-focus-fails-on-firefox) — Jamie Taylor, Oct 04 '13 at 08:05
@jamie i tried but its not working i taken this code from http://www.iwebux.com/demos/ajax/ please open this in firefox and try to open the last column then you understand what the issue is thanks — Xavi, Oct 04 '13 at 08:10

score 0 · Accepted Answer · answered Oct 07 '13 at 07:50

Please try this may be this will help

      $('td.edit').click(function(e){
var $target = $(e.target);
            if($target.is('#editbox')){
                return;
            }
                                        $('.ajax').html($('.ajax input').val());
                                        $('.ajax').removeClass('ajax');

                                        $(this).addClass('ajax');
                                        $(this).html('<input id="editbox"  size="'+$(this).text().length+'" type="text" value="' + $(this).text() + '">');

                                        $('#editbox ').focus();



                                  }




                         );

Selecting text on focus using jQuery not working in firefox

1 Answers1