Can anyone suggest a simple quick and dirty method of providing autocomplete for a text field for example. I may also consider a drop down later on. I can think of a few strategies for doing this, but I'd like to stay away from non-standard Django packages.
Are there any JS libraries that would help? I am thinking for speed, I simply need to query the options - i.e. the text fields and let the JS/JQuery figure out which one works best and I'll expose the JS/JQuery library to that list of say keywords.
Any suggestions to save time?
There is pretty much one option I'd suggest:
django-autocomplete-light’s purpose is to enable autocompletes quickly and properly in a django project: it is the fruit of half a decade of R&D and thousands of contributions. It was designed for Django so that every part overridable or reusable independently. It is stable, tested, documented and fully supported: it tries to be a good neighbour in Django ecosystem.
Its easy to setup, has no dependencies and plays very well with django.
jQuery UI contains quite easy way to create autocomplete inputs.
https://jqueryui.com/autocomplete/#multiple-remote
You can check working sample from here:
https://michalcodes4life.wordpress.com/2014/03/11/ajax-autocomplete-search-with-jquery-django-and-tastypie/
Related
My background is from mobile development and I'm quite new to Javascript so I'm quite confused about the following.
I'm trying to build a JS module that handles a list of data and displays them, so I'm looking for something like JS ListView with the following features:
it accepts an array of objects
it accepts an HTML template (in any format) to render items
it renders only visible views so it can handle large datasets (virtual list)
it can handle item click to return index/underlying object
it supports data modification (item add/remove)
it's free
not under GPL (as long as I understand it correctly) so it can be used in a project without the obligation to submit the code to open source
it supports filtering/sorting (this one is optional)
As a mobile developer those requirements seem to be pretty default to me, but I'm not able to find any suitable solution for several days already.
The options I've checked are:
dhtmlxList - the closest solution I've found so far, but it's under GPL v2 that requires posting the code to opensource.
vue: lacks virtualization/filtering
lists.js - great one, but I can't get how to handle item click to get the underlying object/item index
vlist - a good one, but doesn't handle data modifications though
webix - looks great, but seems to be too "paid"
bunch of libraries that I even can't already find links to
I believe I'm just looking in the wrong direction or using the wrong search terms as it all seems to be pretty standard and any input is much appreciated.
And sorry for stupid question, but in general, how do you handle common UI elements in JS world?
Is there any comprehensive libraries of UI elements for JS which is free and not under the GPL license?
Just went across this Vue component:
https://github.com/Akryum/vue-virtual-scroller
It seems to be what I was looking for - data driven efficient list for javascript (though it's based on a Vue framework which might be not that straightforward to integrate if you don't know it)
Still solves my problem and maybe it would be useful for someone else.
Trying to wire in different components from different libraries / frameworks can be daunting,if you this you would have need for other components for example slider, spinner etc you could pick a framework like ionic that provides to components out of box.
I read on the FAQs of Angular that "Angular can use jQuery if it's present in your app when the application is being bootstrapped".
My question is, is it a good practice or would there be any conflict or performance issue if a site contains jquery and angularjs scripts?
I plan to build a site that would contain both jquery and angularjs.
The reason for this is that I plan to use jquery mostly for plugins like carousel, slideshow, lightbox, calendar, form validation, etc. and angularjs will be mostly used for data binding. (mostly ajax request then bind it a table using ng-repeat, etc)
Do you think this is a good approach or should I just stick with only one (jquery or angular) to do all the process?
This is because I'm not sure how much plugins like carousel, slideshow, lightbox, etc. are available in angular and if I would be able to find such plugins that may be present in jquery but not in angular.
Thanks a lot!
From a technical point of view it is no problem to use AngularJS along with jQuery. In fact Angular itself contains a light version of jQuery: jqLite. So you never really use it completely without jQuery. For example basic selectors are always available. However, this is not sufficient for running your jQuery plugins.
From an architectural point of view, mixing jQuery and Angular can be confusing. Certain things can be done the "jQuery way" or the "Angular way" -- such as attaching a click handler to an element. If you include jQuery, you should be consistent with regard to these issues. I suggest you do it the Angular way (e.g. use ng-click in your templates instead of $(selector).on('click',...) in your directive's link function -- or even worse in services or elsewhere).
In your case it is justified to use both together. There are tons of great jQuery plugins and there isn't an Angular version for all of them yet. I would include jQuery only for those plugins and discipline myself not to use jQuery features apart from that.
So obviously, you'll get a hit from initial loading of your site, because not only will you be getting Angular scripts you'll also be calling for jQuery scripts.
There is no problem with you doing this, it is something you'll have to weigh up, pros and cons.
As for this:
The reason for this is that I plan to use jquery mostly for plugins
like carousel, slideshow, lightbox, calendar, form validation, etc.
and angularjs will be mostly used for data binding. (mostly ajax
request then bind it a table using ng-repeat, etc)
So with a bit of searching (ui bootstrap) you'll find that stuff like carousel, slideshow, lightbox, calendar can all be done with Angular Directives (Angular's way of interacting with the DOM). I created a massive widget drag and drop screen all with Angular - no jQuery. So what you can achieve is limitless* and is a lot easier to do with straight Angular because you're less likely to run into digest cycle issues.
Form validation what an interesting point, I believe this to be a pain point for most web developers for years. What is nice about Angular is this comes supported straight out of the box. And it is good (and symmantic). Take email validation for example:
<input type="email" ng-model="person.email" ng-required />
Angular will automatically regex this email to check it is valid. And it will also make sure there is a value. The power doesn't stop there. Like I said it is extensively supported out of the box.
The advice I can give you is, search google for Angular components, test them out before making your decision. But I can assure you that, I have done everything you're talking about purely in Angular.
But the joy of programming that it is entirely up to you!
* you imaginations the limit, angular will find ways to limit you..... etc. etc.
This is not recommended. BTW, jQlite is already included in Angular...
It is not a good practice to use jquery with an angular js.Angular consist of almost all the functionalities that you can get from jquery.
Although if you have some specific scenarios where you need the strongly type model binding of angular js and you want to use jquery for your other work then you can use both in a single project.
I have been happily using JQuery for the last 2 years and have been quite sucessful creating some really cool functionality with it...so I am very comfortable with it. I also beleive the future of the web will continue on the current client-side path.
However...
The next challenge seems to be coming in the form of various controller frameworks: KnockoutJS, BackboneJS, SproutCore, JavaScriptMVC (the list goes on).
Additonally, there are some great AMD Loader tools for use like RequireJS or LabJS etc. However, jQuery now has define and then capabilities baked-in.
It's getting harder-and-harder to keep track of it all...
And now, my task seems to be to evaluate/decide-on a strategic-direction for using some form of either an MVC or MVVM framework client-side...but I have so many questions.
Where does JQuery fit-in with the various controller-frameworks mentioned above?
Is JQuery used alongside each or do some of them have their own 'JQuery-styled version' baked-in?
Are tools like RequireJS still needed if you implement one of the various controller-frameworks mentioned above?
Does the define and then capabilities baked-into JQuery now supercede the AMD Loader mentioned above?
Which one seems most modular? (see notes below)
NOTES:
One thing I don't want in any future-framework is the requirement of having to take-in vast amounts of functionality that I don't use. Meaning, I would rather use a framework that is truly modular. For example, to use jQuery UI you have to take-in a lot other core libraries that you might not actually use.
I will be experimenting with each one, but some REAL feedback would be great. I've seen some 'similar' questions, but none have really answered the above skew.
Thanks in advance!
This question is being answered in another forum. Please feel free to post all your answers there instead of this one.
If I am starting a new project how should I pick between using YUI 2, YUI 3 and jQuery?
I know there are a bunch of questions/answers already about can you use them together, but I am trying to figure out what criteria I should be thinking about to make my decision.
Are they overlapping?
Is one better at GUI and the other better at internals?
Do they play well together? My understanding from other questions is that they can live in different namespaces, so they can live together, but that doesn't necessarily mean that it is good to use both.
Thanks!
If you are familiar with neither, I personally have found jQuery's documentation and API easier to understand than YUI's, at least for simpler things. It also appears there is more jQuery related information than YUI on stackoverflow.
YUI does have its users and supporters though, so check it out in case you end up finding it suitable for you. It's got a huge library of additional modules you can use for complex web applications.
My usual advice would be to go with whatever you're familiar with, and I say this because I don't think it's worth dropping one to start learning the other from scratch. But if you are familiar with neither, then you should check out how easy the documentation for both is to understand.
PS I would not recommend YUI2 if you're starting anew as it has been superceded by YUI3, which is much better designed.
We need more information about the type and size of the project before a proper library can be suggested.
For example, if you're building a semi-complex/large-ish web app, I would suggest Dojo or ExtJs. Otherwise, for smaller projects, jQuery might be more appropriate. I cannot comment on YUI as I have not used it.
Impossible to say without knowing more details about the project. Use jQuery or Prototype for things like DOM manipulation and making autocomplete, etc. If you need a more powerful Javascript implementation take a look at ExtJS, which is basically a full stack framework for Javascript.
Both are JS frameworks and there to help you. YUI is known to be more natural in them and more closer to the original Javascript while jQuery is known as more easy and you find more jQuery users and support around then YUI. However, as said earlier, it depends on the project, if it is likely that you will be making your own custom widgets, I will suggest you to go with YUI but if it's like a simple e-commerce website in which you just need some fancy galleries and shopping cart, go with jQuery, you will learn and implement that quickly. I am not saying that you can not go more in depth with jQuery but my impression is that jQuery is more of a CakePHP for PHP like of framework which gets you off the grounds quickly.
In my opinion there is no need for you to use them side by side in a single project, that will just produce the over-head as both do whatever you want to do in them i.e creating dialog panels, autocomplete quick searches, event related utilities etc.
I am writing down a series of beginner and mid-level tutorials for YUI users, let me know if you find them useful or if there is anything else where I can help.
http://ciitronian.com/blog/tag/yui/
I want to create a draggable and resizable window in JavaScript for cross browser use, but I want to try and avoid using a framework if I can.
Has anyone got a link or some code that I can use?
JQuery is more focused on a lot of nice utility functions, and makes DOM manipulation a whole lot easier. Basically, I consider it to be Javascript as it should have been. It's a supremely helpful addition to the Javascript language itself.
ExtJS is a suite of GUI components with specific APIs... Use it if you want to easily create components that look like that, otherwise, go with a more flexible framework.
JQuery would be a good way to go. And with the Jquery UI plugins (such as draggable), it's a breeze.. (there's a demo here).
Not using a framework, to keep it 'pure', seems just a waste of time to me. There's good stuff, that will save you tremendous amounts of time, time better spent in making your application even better.
But you can always check out the source to get some 'inspiration', and adapt it without the overhead of the stuff you won't use. It's well done and easy to read, and you often discover some cross-browser hacks you didn't even think about..
edit: oh, if you REALLY don't wan't no framework EVER, just check out their source then.. sure you can use some of it for your application.
Sometimes you can't choose your environment or architecture, so you're stuck working within constraints like not being able to use frameworks...
Avoiding a framework altogether will leave you with lots of code and a bunch of tedious browser-testing.
If you would consider a framework I'd suggest jQuery with the jqDnR plugin. I think it will solve your problem or perhaps you could combine the functionality of the jQuery draggables with the jQuery resizables
Just trying to avoid large framework downloads to the client for one very small thing, perhaps I am being daft.
I had looked at jQuery but also ExtJS, the documentation and UI 'look' seem far superior and professional in ExtJS ... are there particular reasons for you guys recommending jQuery?