CODEWITHSUNDEEP
javascriptjqueryhtmlcssangularjs
phuwin
phuwin

Reputation: 3270

jQuery focus() does not focus

I have a problem with jQuery focus(). From the selector, I can target the element, and can change the css of the element (for example display:none). But making the item to be focused doesn't work.
A video demo. Switch on HD to see more clearly.
I used AngularJs for the display.

The thing I am doing is quite complicated to explain. Demo here
Code can be found here

How to use the app: click in the first text field of the form. There will be a new form generated. As you can see, when the new form is generated, the first input field will be focused. Next you choose in the new form the 2nd select field, choose dropdown or option. Then you click on the first inputfield, there will be a new form generated. The problem I have here is that it doesn't focus on the new one.

How I focus: 

$scope.addSubItem = function(index)
    {
        var newSubItem = [];
        var data = $scope.inputData;
        newSubItem.push("");
        newSubItem.push(0);
        newSubItem.push("hour");
        newSubItem.push("");
        $scope.items[index][6].push(newSubItem);
        var itemToBeFocus = "#subItem" + index +"form:last-child input:first-child";
        setTimeout(function(){
            $(itemToBeFocus).focus(); //here
        },0);
    }


Upvotes: 1

Views: 466

Answers (1)

Jai
Jai

Reputation: 74748

i guess you have missed a _ space here before "form: 

var itemToBeFocus = "#subItem" + index +" form:last-child input:first-child";
angular.element(itemToBeFocus).focus(); //here

and instead of setTimeout try with angular.element() jqLite object wrapper.

Upvotes: 1

Related Questions