Can't make static position to angular-material inputs - javascript

I made a custom position for my select with md-container-class and it's working well.
This is my first chosen option: http://prntscr.com/c0oao4
I have a new problem, when I am choosing next md-option, it looks like this: http://prntscr.com/c0od78
Please help with finding solution, I have lost a lot of days for this and can't find the right way to do it.
Maybe its angular-material bug or feature?

Related

How to implement Scroll Navbar?

I'm not sure if the name "scroll bar" is true at all. I would like to install a scrollbar, in which you can simply select a city with the mouse wheel (on a smartphone with a wipe) and then select the possible cities of the respective country in the second window.
I mean something like this has already been seen but unfortunately I could not find a good example.
Does anyone know the exact name and has perhaps a sample code?
Updated the answer as per comment
I think you better use Select2 for this.
You can find all the details and support you need in its Basic Usage page.
And about your Question - only post question if you have tried solving it by your self (if you have tried, post the method you have tried with a sample code) or try Googling it, this may help more than you know.
Update2
As per your comment, i understand that what you need is a spinner in this case you can use Input Spinner Plugin for this. You will need some styling changes but this will work your way.
Hope this was helpful for you.

ReactJS Drag and Drop Between Multiple Lists

I've been searching all day and haven't found anything.. All the React libraries all seem to only sort between ONE standalone list.
The closest I found was this article: http://rafaelquintanilha.com/sortable-targets-with-react-dnd/
with this example: http://rafaelquintanilha.com/apps/sortabletargets/
The problem is that you have to drag the item to a different list BEFORE you can sort it. In otherwords you can't drag an item from one list to another list and also place the item exactly where you want in that list that your'e dragging it to.
Is there any sort of library that you guys know about or know just of any way I can accomplish this?
I desperately need this functionality for a work project. Thank you for any help
This library is what you are looking for:
https://github.com/atlassian/react-beautiful-dnd
But be aware that it doesn't support virtualization at this point in time. [UPDATE: Virtualization is now supported! July 2021]
Here is the example with source code:
https://codesandbox.io/s/ql08j35j3q

CKEditor - Make certain text read only

Calling CKEditor gurus to this question. I have a need to make only certain areas within my textbox readonly. These areas will be text and image URLS that will be enclosed by a span tag with a predefined class type. I have checked the documentation but cant seem to find anything that will help me accomplish this. They all make the entire textbox go read only.
I have heard that there are hacks that can make this work, but Im not sure which way to go about doing it. I am fairly new to this, so please bear with me if my question seems absurd.
Thanks for any help..
Use widgets.
Take a look on some samples first and then focus on Placeholder plugin (based on widgets), which does pretty much what you'd like to have. You can either customize it or create something new, referring to existing code and official guides.
Note: You need CKEditor 4.3+.

Modify FullCalendar Javascript Plugin Layout

As you can see the default layout of FullCalendar is like this
I want to change it to be like this
That Room Column is something that is custom or shall I say, it came from the database, that wouldn't be important for now since what I really wanted to know is how to achieve that kind of layout.
I honestly do not know where to start that's why I run here in SO. I've been looking some examples in the internet but can't find anything.
How would I start in doing that kind of layout? Your help will be greatly appreciated!
Thank you very much!
I think that FullCalendar does not offer this flexibility by customizing it. You will find better solutions by extending or modifying the lib, but a solution without modifications may be:
Your 'relative view' should be a 'week view', then you will have your week days displayed (as you need).
Set the 'select function' to always set 'allDay' to 'true'. At this point you will have what you need, but just for one room/row.
Turn each room (row) into a new FullCalendar.
Modify the CSS (overwrite) as you need.
Just a heads up. I managed to solved this one when doing some thorough research.
I found that someone already developed this kind of solution.
First I found this link here in SO: fullcalendar change columns to row
Then upon reading the comments, it lead me to here http://tux.fi/~jarnok/fullcalendar-resourceviews/
It just needs a little tweaking of course, but this would do.
I hope this helps someone.
Cheers!

Autocomplete/tagging jQuery plugin with ordering and cursor

I'm looking for a jQuery tagging/autocomplete plugin where I tags can be inserted mid-order - and control over this is possible with the mouse.
I've gone through everything I can find, but am yet to find a plugin with all the requirements I'm looking for. I'm looking for a Facebook-esque tagging plugin, yet I'll be working with pre-defined phrases, and building them up into a paragraph, so I need to be able to control the order, and potentially insert a new tag in the middle of an existing selection.
The closest I've found to having this functionality is TextBoxList and the 'Facebook Theme' of JQuery TokenInput. Both of these however only allow you to move the cursor between tags with the arrow keys - and I'm looking to be able to mouseclick to control the cursor aswell.
Anyone know anything that's got what I need? A few other key essentials are free-text input (when no tag matches), remote source of data, and form submission, but I'd hope they'll be easier to retro-fit to something else!
An update for Googlers - I went with jQuery-tokeninput, and have spent the day modifying the library to work with mouse input. When I get time to tidy the code, and check how it works with other themes, I may put a pull request on GitHub, it seems like fairly useful functionality to me.

Categories

Resources