Have Geek Brain

Jquery add onclick line

** EDIT --- Trying an even more simplistic version ... Still doesn't work ... Returns $ (this) .closest is not an error function ... **

$("#fitable input[name^=f1]").focus(function() {
        var newRow = '<tr><td></td><td></td><td></td><td></td></tr>';
        $(this).closest("tbody").append(newRow);
    });

Original publication

Pretty new to jQuery, so I hope someone can help me ... There are a few things going on ... Help with any part of it is appreciated.

First, I am trying to add a row to the table when the user clicks on the first allowed input field for that row. Here is the code I'm trying to use:

    $("#fitable > tbody > tr > td > input").bind('focus', function() {
        if($(this).attr('disabled', false)) {
            $(this).click(function() {
                    var newRow = '<tr><td><input name="f1[]" value="" /><label>CustNew</label></td><td><input name="field_n1[]" value="" /><label>N1</label></td><td><input name="field_n2[]" value="" /><label>N2</label></td></tr>';
                    $(this).closest("tbody").append(newRow);
            });
        }
    });

If it's helpful, here's the html:

<table id="fitable">
    <tbody>
        <tr valign="top">
            <td><input disabled="disabled" name="cust" id="edit-cust" value="sample@sample.com" type="text"><label>Cust</label></td>
            <td><input name="field_n1[]" value="" type="text"><label>N1</label></td>
            <td><input name="field_n2[]" value="" type="text"><label>N2</label></td>
        </tr>
    </tbody>
</table>
+2


a source to share


3 answers


I think your selector is wrong. Try the following:

$("#fitable > tr td input:enabled:first").focus(function() {
    var newRow = '<tr><td><input name="f1[]" value="" /><label>CustNew</label></td><td><input name="field_n1[]" value="" /><label>N1</label></td><td><input name="field_n2[]" value="" /><label>N2</label></td></tr>';
    $(this).parents("tbody:first").append(newRow);
});


You don't need to check if it is disabled in the handler function, because that will only be associated with included elements.

0


a source


I think your if statement is setting the clicked attribute to false. Try the following:



if( $( this ).attr( 'disabled' ) == false ) {
    // do stuff
}
+1


a source


Try the following:

$("#fitable input").focus(function() {
        if($(this).attr('disabled', false)) {
            $(this).click(function() {
                    var newRow = '<tr><td><input name="f1[]" value="" /><label>CustNew</label></td><td><input name="field_n1[]" value="" /><label>N1</label></td><td><input name="field_n2[]" value="" /><label>N2</label></td></tr>';
                    $(this).closest("tbody").append(newRow);
            });
        }
    });
0


a source






More articles:


All Articles