I'm terribly stuck trying to add a dropdown time picker to an angular app im making.
<div class="col-xs-3">
//I just want to stick it right in here
</div>
I've tried this http://jsfiddle.net/9Ymvt/905/ and this https://github.com/Geta/angular-timepicker and some other alternatives, I really just need an input field where you can entire a time so I can pass a time (not a date) to my model, but I need it to fit in a small div header i have, so I can't use the standard timepicker element. I'm a complete angular noob so maybe these other methods should be working and I just don't know how to implement them. I tried including the files as scripts and what not but it really isn't working.
Related
I'm pretty new to React Js, I have a requirement for building AutoComplete Multiselect dropdown.
Despite looking around for lot of examples,
I was suggested not use any third party libraries. And pretty
clueless how to start and proceed further.
My requirements are
Have an input text box for typing names.
Display sugggested name with checkbox.
Upon checking the names, they must be display in an with an 'X' symbol(remove item)
If I uncheck the name from the multiselect dropdown, it must be removed from the li.
If I Click the 'X' it should be removed from the li and uncheck the item from dropdown list.
And lastly , I need to display the selected items in the input fields like
I've been trying to implement this functionality but figure out how.
Can anyone please provide some reference and any guidance in implementing this functionality or any examples. It would be a great help.
Thanks
I'm not sure why the recommendation against third party libraries. These component can get complicated fast.
I recommend you use a third party. Don't reinvent the wheel!
Something like https://github.com/JedWatson/react-select will do what you want. It has been around for years and has over 300 contributors and 2 million weekly downloads.
Am using angular in this simple search results page and instead of adding jquery masonry for layout and deal with timing issues I decided to give this directive a try since it plays nicely with the ng-repeat.
Unfortunately when I have a large dataset and the ng-repeat takes a second or two, the page gets all screw up and all items render on top of each other. Someone claimed that it has something to do with the last element in the ng-repeat not being loaded by the time the layout is created through the plugin.
Someone else recommended a timeout to create a delay, this option works but the user can see the layout being built, which is not the best solution.
Anyone out there that has use this directive to create a masonry layout with a large dataset?
I can't seem to get the inlined calendar button associated with the DatePicker to work using ng-repeat on two DatePickers. They both work when I instantiate the DatePickers separately, but I wanted to try and use ng-repeat. I want to be able to associate the two DatePicker fields so when you fill out "Date From" it will set the min date of "Date To". I put an example together of the buttons not working or calling open() properly, not sure how to do the rest yet, still very new to AngularJS.
http://plnkr.co/edit/EPg0fmZN7YdVsvhiRgBa
Thanks
I know there are lots of great rich text editors out there that can easily be ported to angular and plenty of discussion on how to do this, but I'd like to create my own.
I have the basic idea down:
create a text area and watch the input and perform a function as the input changes. I am familiar with the ngBindhtml directive, only to the extent that I can apply it to an element.
Any idea how I might be able to create a function that would render plain text into html?
I've tried it before but ended up using textAngular.
Basically i replaced the textarea with a iframe, similar to the way tinyMCE does.
The contenteditable on a element allow you to replace the textarea and write directly on the div. You would insert all html elements like headers and text this way. You'll have to handle the cursor position on text, apply styles based on buttons and text selection, etc.
Well, I also came across this and created my own editor as I was required to add features like Table addition etc. The repo is still under development but you can some idea by taking a look at this plunkr. Unlike old answers, I have tried to keep it as a component so that it can be reused at many other places as required.
You can star this git repo to stay updated or feel free to add your inputs
i have been playing around with the ext js library for showing multi month calendar
http://www.lubber.de/extjs/datepickerplus/
one issue is in all the examples are either coming off of another control(combo, textbox) or inside a window object
does anyone know if there are any examples of simply displaying the calendars on a regular page?
If you check the source of http://www.lubber.de/extjs/datepickerplus/ around line 635 where the dWin object is being instantiated you should get an idea on how to add it to a page.
Basically this script (be warned, it has loads of commented code and actually is quite a mess) creates an Ext Window, with several items of which one has a datepickerplus xtype.
It should be possible to also render the datepicker to another dom element directly but i think that this extension to Ext doesn't support this out of the box so you should probably extend the object and override the render method.
Hope that helps