I'm using fullCalendar to schedule events and I'm looking for a new function where the user can undo moves that been done in the calendar.
Do you guys know a smart way to do this?
The first thing that comes to my mind is to save previous states in in a new table and when the user wants to undo moves the system just reset the values in the events table with the ones in the "previous state" table.
I have implemented a solution for this. It may not be the most elegant but it works for me. I have a column in by events table called e_history; it's content is an array of JSON.stringified data that contains {date:"1/12/2012",startTime:"8:00",duration:4}. In my system the duration value corresponds with a value that is mapped out based on 30 minute time increments. In my event pop ups ($.dialog) I have a button the user can click to see old schedule dates - that are clickable if they want to set the event back to an old date. This only works for monitoring individual events. If you want to remember the entire state of the calendar, you could just save a stringified copy of the events object. This would allow the flexibility to parse it as needed and monitor differences from your db.
Related
At the moment, there is a calendar on my site where the user can select a time range and data filtering will be done. For this I use the react-advanced-datetimerange-picker library.
But there is one drawback. You cannot cancel the selected data without reloading the page.
Please tell me how to make a button (example near close button) that will allow you to reset the entered filters and get the entire list of data again.
I created a function called resetDate which when clicked return the Calendar to its initial value, please check.
https://codesandbox.io/s/proud-architecture-9v7e84
I'm currently using fullcalendar 4 on my website and I'm trying to add an indicator that the user is selecting in the calendar, there do is the background color changing but it's kind of hard to see.
My goal would be to recreate the selectable date part of the demo page, where if you go into the week vue, you can see the event appear during the select.
I'm stuck since full calendar only activates the select function when the select is over so I don't know how to start creating the event at the select start wether it's with an option in the calendar that I haven't found or if there's another way.
Since it's in the demo I though it would be feasible but right now I'm having a hard time with that
This is done by setting the selectMirror option to true.
Documentation: https://fullcalendar.io/docs/v4/selectMirror
Demo: https://codepen.io/ADyson82/pen/RwGBrQP
Need to some advice.
Currently I have a calendar that has one route "/events" (it is a monthly display). Within this route the user can click <<< or >>> to look at different months, in some cases the user will go back many months until they find the event they are looking for (yes there is also a search feature in place), in any given month a user can click into an event ("/events/:id") on a given day to see it's details.
Problem: since it's one route, when the user clicks back it goes to the current date which is initialized when the component is loaded and not to the last month they were on, which means the user would now need to click back <<< a whole bunch of times to get where they need.
Basically what I think I need is to persist the date of the month that's clicked into, but that leads me to other issues such as how do I get rid of this state when the user leaves the page altogether for another section of the site. Any suggestions? The other issue is that the user can actually get to this event from other areas of the site so I need to differentiate based on where the user came from.
I ended up using local storage, which is a good way to persist state without making calls to the db. This is only good if the data does need to be secured.
With Handsontable, I use autocomplete columns to let users choose from a list of pre defined names. But when the user selects a name I don't actually store that name on my data object, I store an id connected to the name. The id is also what is available on the data when the table is loaded initially.
This means that I need a function to go from id to name and vice versa which I have. I use the id to name function in my renderer and I use the name to id function in beforeChange, so that the output contains the id.
Here is my problem:
If I select a cell with a name rendered and I press enter, I now see the id instead of the name. Is there some way I can change the behavior of the editor so that the name is shown instead of the id?
Everything else seems to work. If I for instance select a cell and start typing, it now contains what I typed and the autocomplete works as expected. I would like to have the same behavior when pressing enter on a cell.
I ended up using a solution where I do the translation on all the data when it is loaded. When I then extract data from the sheet I translate it back.
I encountered a similar problem with the date editor where I wanted to go back and forth between the user date format and our normalized date format. Handsons editors are not that easy to work with and especially the date editor receives dates in different formats on setValue.
The solution feels a bit hacky but at the same time there will only be on these two occasions when data is transformed which makes it less plausible that there will be any errors compared to if I were to transform on render, data entry, validation etc. With this solution I know that as long as we are in the sheet, the data is what the user sees.
I need some direction on how to procede in this scenario. Using and Asp.Net page with JQuery, user generates dynamic elements representing data of his process' tasks:
-Basically, at the left, right and bottom of the page, there are several accordion with a sort of draggable items
-In the middle of the page, there is a 'PLUS' button
-Where user hits '+', a new 'CARD' is dynamically generated in the middle of the page. This card is a main div, with some droppable divs inside it
-This card represents the user task, and the inner divs are the properties of the current task
-The user drags the options from the lateral accordions and drops them on the droppable areas/div of the card/main div.
-Done! The 'task characterization' of the task is done.
-The process is repeated, adding more cards as required.
All this operation is client-side: until this moment, there is no needed to invoke server operations.
Until now, and this is where my question is laid: when the user is done, he hits a 'SAVE' button.
How can I go from a dynamic set of HTML controls on the client to, lets say, a IEnumerable of a custom class type containing the user data to proceed with data operations?
These are some of my ideas:
Idea #1:
1. On Page_Load, instantiate a list of 'TaskData'
2. When user hits Save, using Jquery, select all elements of the card class
3. Loop through all card
4. Select and loop all elements of the card, reading data of the droppable areas
5. Pass data to server (using webservice or page_methods)
Idea #2:
On Page_Load, instantiate a list of 'TaskData'
At each 'drop' event, call a specific page_method, eg: setPropertyX(string value), setPropertyY(string value), and so on, avoiding callbacks. This way, on the Save method, I would have the objects to be populated progressively.
Idea #3:
At each 'drop' event, store values on array variables
...
Idea #4:
Use browser' localstorage/sessionstorage, or browser DB (new area to me)
So, as you can see, I'm pretty stuck at this. Suggestions are welcome :-)