1

I have a function using jQuery

function enableField(fieldID) {
    $("#" + fieldID).removeAttr('disabled').focus().select();
}

that is called from the following code inside an HTML page

    <input id="phone_nr" name="phone"
           type="text" size="30" value="12345"/>

    <a href="javascript:void(0);" 
       onclick="enableField('phone_nr'); return false;">Change</a>

The input field is disabled initially. So the call to the JS method enables it again, then puts the focus on the field and selects the text inside for editing.

Internet explorer (9) doesn't do this properly (all the other browsers do). On clicking the "change" link, nothing seems to happen.

Johannes Charra
  • 29,455
  • 6
  • 42
  • 51

2 Answers2

1
<input id="phone_nr" name="phone" type="text" size="30" value="12345"/>
<a href="#" id="mylink">Change</a>

Removed your inline JavaScript and replaced it with this.

$(document).ready(function() {
    $('#myLink').click(function(e) {
        e.preventDefault();
        $('#phone_nr').removeAttr('disabled').focus().select();
    });
});

It's not clear whether you'd have a "Change" link for each field but if you do...

<input id="field0" name="phone" type="text" size="30" value="12345"/>
<a href="#" id="mylink-0">Change</a>

<input id="field1" name="name" type="text" size="30" value="name"/>
<a href="#" id="mylink-1">Change</a>

<input id="field2" name="fax" type="text" size="30" value="12345"/>
<a href="#" id="mylink-2">Change</a>

 

$(document).ready(function() {
    $('a[id|="mylink"]').each(function (i) {
        $(this).click(function(e) {
            e.preventDefault();
            $('#field' + i).removeAttr('disabled').focus().select();
        });
    });
});
Sparky
  • 98,165
  • 25
  • 199
  • 285
0

Try adding the link onclick handler in the document.ready event:

    $(document).ready(function () {
       $("#mylink").click(function(){
         $("#phone_nr").removeAttr('disabled').focus().select();    
       });
    })

...

    <a href="javascript:void(0);" id="mylink">Change</a>
sarghir
  • 134
  • 1
  • 4
  • @Sparky672, which part are you referring to? – hyperslug Nov 04 '11 at 15:21
  • @hyperslug, using jQuery, there is no good reason for this, `href="javascript:void(0);"` – Sparky Nov 04 '11 at 15:25
  • @Sparky672, this discussion http://stackoverflow.com/q/134845/ sounds like it could go either way. Does jQuery nullify Anthony's points? – hyperslug Nov 04 '11 at 15:37
  • @hyperslug, this section is not for side discussions about the content of other threads. Calling any JavaScript from within an `href` is what I'm talking about. – Sparky Nov 04 '11 at 16:13
  • @Sparky672, even if you are right (which I don't think you are), how is this related to my solution? – sarghir Nov 04 '11 at 20:23
  • @sarghir, You posted a sloppy answer, I down-voted it and explained why... end of story. (BTW: check the code in your answer for two missing/incomplete closing brackets.) – Sparky Nov 05 '11 at 14:53