Place focus on specific cell after ajax and trigger('update') with row defined

I have a dynamic table that reloads when the user(closed system) makes a change to the tableQtyUpd field. what i need to do is have the cursor focus set to next input tablePrice in that row. tableQID is a unique, and non-editable value.

$(document).on('change', '#tableQtyUpd', function(){
var isbn13 =  $('#isbn13').val();
var QIDFind= $(this).closest('tr').children('#tableQID').html();
    $.ajax({
    type: "POST",
        url: "QuoteUpdateQty.php",
        dataType: "json",
        data: ({QID:$(this).closest('tr').children('#tableQID').html(), QtyUpd:$(this).parent().parent().find('#tableQtyUpd').val(), }),
                            success: function(data){
            
$("#inv3 tbody tr").remove();   

 
    $.ajax({
        type: "POST",
        url: "QuoteRetriveShort.php",
        dataType: "json",
        async:false,
        data: ({isbn13: isbn13 }),
        success: function(data){
        
            for(var x=0;x<data.QID.length;x++)
               
                if (data.QISBN != null ) {
                    
                    
                            //code
                     $("#inv3").show();
                      $("#inv3").append('<tr><td id=tableQtyApp>'+data.QApQty[x]+
                                        '</td><td> <input type="text" class="qty"  id=tableDueDate value="'+data.QDateDue[x]+
                                        '"</td><td id=tableGuide>'+data.QGuide[x]+
                                         '</td><td> <input type="text4" class="qty" id="tableQtyUpd" onclick="this.select()" style="' + getStyle(data.quoteChange[x]) +
                                        '"value="'+data.QUpdateQty[x]+ 
                                         '"/></td><td id=tableQty>'+data.Qqty[x]+
                                         '</td><td id=tableQtyChange>'+data.quoteChange2[x]+
                                         '</td><td id=tableMonth>'+data.QMonth[x]+
                                         '</td><td> <input type="text4" class="qty onclick="this.select()" id="tablePrice" value="'+data.QPrice[x]+
                                         '"/></td><td> <input type="text" class="qty" onclick="this.select()" id=tableSource value="'+data.QSource[x]+
                                         '"</td><td id=tableDate>'+data.QDateQuote[x]+
                                          '</td><td> <input type="text" class="qty" onclick="this.select()" id="tableNotes" value="'+data.QNotes[x]+
                                         '"</td><td id=tableQID>'+data.QID[x]+
                                         '</td><td><img class="fill" src="add.jpg"/></td><td><img class="Delete" src="delete.gif"/></td></tr>');
                     }
                     else if (data.QISBN == null ) {
                           $("#inv3").hide();  
                     }
        }
    });
    
    $("#inv3").trigger("update");
   focus();
    
                },
                
});
      
 });

i know focus() does nothing but throw an error the way it is above i just left it there to show where i have been putting my focus call

Can you add it manually instead of jQuery?

ie:

<input type="text" name="some_field" autofocus>

Or perhaps because the table is rendered dynamically its executing too fast?

More likely though… I dont see any sleector?

ie:

$("#someTextBox").focus();

yes that would be easier, but this is a very complex page --this is just one section of code–i need the inputs to stay the same --i could create a seperate class for the price input field, but would not get me any further because i am at a loss on how to focus on that class for the specific row associated with the ID fond and stored in var QIDFind

Sponsor our Newsletter | Privacy Policy | Terms of Service