I was just wondering If I could get some thoughts and feedback on my todo app to see where I could improve. Also, one current issue I'm having the is with the checkbox.
I'm using the materialize framework to help create the UI but I can't get the materialized styled checkbox to function properly. My way around that was to place the standard checkbox over the materialized styled one with the help of positioning and Z-index, with the opacity at 0.
So the checkbox can still function while the materialized checkbox displays. The issue with that is that If I input to many characters for the task the standard checkbox moves.
Link to todo-app()
Related
I am new to NativeScript and Javascript development in general. My background is Android.
Background:
As a test I try to replicate one of my old apps with NativeScript and have encountered a problem:
I use a RadListView with multiple templates. The correct template is chosen at runtime. The templateSelector uses a boolean variable to determine the correct one. (Imagine tapping a ListView item. When you do it expands and shows 2 buttons. You tap it again -> the buttons disappear.)
Now that works just fine.
Problem
My problem is that I cannot figure out how to animate the template switch. The new content just appears/disappear instantanously.
What I managed so far
I managed to animate the buttons when their template has just been chosen. I set their opacity to 0 and animated it to 1. Problem is: The necessery height for the buttons is reserved as soon as the template is chosen.
Question
Is this at all possible? If so how?
Sources
Expandable ListView items by manojdcoder:
https://discourse.nativescript.org/t/expand-element-radlistview/4268/3
There are few built-in animations you could find in the docs and working examples in Github.
I just start using bootstrap and I have used https://github.com/designmodo/Flat-UI as flat UI design.
Currently I just added https://github.com/Eonasdan/bootstrap-datetimepicker as my datetimepicker. But it seem both css have been fighting with each other.
I able to click on the button of datatimepicker. It straight display the time at the textbox without letting me choose from the dropdown menu (that it should appear). I believe flat UI from designmodo have override the dropdown menu for specific class but too bad I have no idea which part to fix this problem.
Anyone have met the same problem like me? Please guide me from here.
You probably got your answer. But I faced similar issue. I am using https://bootstrap-datepicker.readthedocs.io/en/latest/ and https://github.com/Eonasdan/bootstrap-datetimepicker. Components aren't the same, but I faced same issue. After some analysis, there is a css conflict. Both of them create class .input-group-date. So there's no fight as you mention, but based on css rules(Two css files defining same class), order of css files will define which class will stylize the component and you will have one of components not working properly.
I used a SmartSortable snippet by Pete Hunt from React.js Google Group that intergates jQuery UI sortable with React.
Unfortunately, after using it, editing input fields makes the text cursor to just to the end of the currently edited input field.
http://jsfiddle.net/NV/jfkn5/
Removing <SmartSortable> from the example fixes the problem.
Why is it happening? I believe, the <input>’s value get’s updated despite being exactly the same; I don’t understand why.
I currently have an app that has five components. On the left I have a radio button field and a grid below it, on the right I have a display field, chart, and another grid [top to bottom]. The radio buttons filter every other component by a certain date, and the left grid [when selected] will filter the right components by the selected object.
Currently the app does what is needed, but when I select a few radio buttons in a row OR select a few objects in the grid, the app will eventually totally disappear. I tried running the app externally and internally with a custom HTML app, but the problem does not go away.
Here is a picture of the app before anything crashes:
Interestingly, when I look through the chrome debugger and look at the Elements tab, I see there are lots of masks that have been created and not destroyed. Here is a picture of a slight piece of the HTML that looks fishy and occurs after I select a few objects from the left grid:
Every time I select a new object, one more mask will be added to the DOM. I don't know if this is what breaks my app, but it seems odd so it may be related?
I didn't include any code because I thought it should be some easy fix - plus, the code does exactly what it should [before it disappears]. Any help on how to fix an app that disappears would be great!
In itself a mask sticking around to be reused after data loaded successfully is not an indication of a problem. I see mask being created and not destroyed in a simpler app:
Perhaps what you experience is an issue of timing when elements load asynchronously.
I am developing a search form which displays a number of categories and sub-categories. The client has requested that I do not use cascading dropdowns but to display radiobuttons instead so that the user can see the top level categories at a glance.
I had a bit of a look around for any javascript plugins that might give me a head start and save me from having to write all of the code from scratch but didnt come up with too much.
Can anyone suggest a good plugin that will allow me to display a radio button list in a hierarchical collapsible tree structure?
Cheers,
Tristan
Solution
I ended up using this plugin and adapting it to my own needs -> http://code.google.com/p/checkboxtree/
There is a great jQuery plugin called jsTree.
http://www.jstree.com/
I personalize it for my needs as well.