Loading jquery is must in angularjs?

Question

Am trying to manipulate dom by using jquery in angularjs; As per the documentation

"If jQuery is available, angular.element is an alias for the jQuery function. If jQuery is not available, angular.element delegates to Angular's built-in subset of jQuery, called "jQuery lite" or "jqLite."

I have two links one using jquery works and one without using jquery throws error. Needed some suggestion on how to get this working without declaring jquery externally?

If you're using JQuery functionality you need to load it. Not sure what exactly it is you're asking here? — ivarni
– ivarni, Commented Jun 29, 2014 at 9:54
@ivarni : I don't want to load jquery; Angular has built-in subset jqLite can't we make use of it and get it working? — Santosh
– Santosh, Commented Jun 29, 2014 at 9:57
Not if you're going to use selectors with id. Are you asking how to set focus on an element without using JQuery? — ivarni
– ivarni, Commented Jun 29, 2014 at 9:59
without using jquery throws error What error to be precise? — Satpal
– Satpal, Commented Jun 29, 2014 at 10:01
Have a look at stackoverflow.com/questions/14833326/… and see if some of the answers are useful. — ivarni
– ivarni, Commented Jun 29, 2014 at 10:02

Community · Accepted Answer · 2017-05-23 12:11:00Z

2

I don't think Angular's jQlite supports the .focus() shortcut - jQlite is only a subset of jQuery see https://docs.angularjs.org/api/ng/function/angular.element for a list of jQlite methods.

You need to call focus on element[0].focus as per this stackoverflow answer HTML5: How to set focus on a text input in a list with AngularJS

edited May 23, 2017 at 12:11

CommunityBot

11 silver badge

answered Jun 29, 2014 at 11:04

Hargrovm

1,1989 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Edminsson · Accepted Answer · 2014-06-29 11:10:19Z

-1

You can read here the methods that jqLite provide. In this particular case you could write something like this.

var app = angular.module("myapp", []);

app.controller('myappCtrl', function($scope,$timeout) {

  $timeout(function() {
    document.getElementById('number').focus()
  }, 1);

 angular.element(document.getElementById('focusguard-2')).on('focus', function() {
    document.getElementById('number').focus();
  });

  angular.element(document.getElementById('focusguard-1')).on('focus', function() {
    document.getElementById('cancel').focus()
  });

});

answered Jun 29, 2014 at 11:10

Edminsson

2,51422 silver badges25 bronze badges

1 Comment

Jon Over a year ago

I would try to avoid doing any UI logic in the controllers - I would try this into a directive

Collectives™ on Stack Overflow

Loading jquery is must in angularjs?

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related