I am trying to create a filter/search possibility for a QIntersection in Quasar.
Preferably in the same style as a QTable, where it searches through an entire JSON.
My goal is to use a v-for loop over a JSON to create all intersection items, with a QSelect that gives the possibility for searching and filtering.
Anyone suggestions on how to approach this the best?
#Matthias S thanks your suggestion works perfectly.
Related
So I am trying to create a form using Vue Formulation. I have a few input fields that are required. Is it even possible to highlight them somehow? I have read Vue Formulation doc, but could not find the answer.
You could simply give the required fields a different styling/CSS class.
If you are really fancy, you could try to read the attributes of the DOM elements (with attr() or refs), but haven't tried that and it is probably not worthwhile.
I'm looking for a way to create nested lists with draggable elements in VueJs3 & Ionic
This is the result I'd like to have: https://ej2.syncfusion.com/vue/documentation/treeview/drag-and-drop/
Moreover, I'd like each item of the list to be part of "ion-sliding" tag for them to have some options when they're sliding like this: https://ionicframework.com/docs/v3/api/components/item/ItemSliding/
I tried to use "ion-reorder-group" but it doesn't allow me to create nested lists like I would like to. I also tried a bunch of librairies but I'm not able to make any of them work with my Ionic-Vue3 project.
I'm stuck on this issue and I would be very glad to have any recommendations or help !
Thank you very much
I resolved the question, I'm posting the solution I used in case it could be useful for someone.
I used this library: https://github.com/SortableJS/vue.draggable.next that supports Vuejs 3.0
There's a very useful link to look at live demos and each of them has the code attached to it available. I combined some of them and added my "ion-sliding" tags to obtain the result expected.
It works perfectly !
I'm learning Vue and Vuetify right now. And I want to develop a Calendar tool combining Vuetify with Laravel.
With v-calendar it is possible to render multiple 'event-indicators'
See example
With Vuetify 'one' event indicator is possible (example), but I don't know how to manage to make it two or even three. Is there any solution for this?
Yes we can, just pass an array for all the colors you want to assign on a particular date, using the allowed-dates prop. It has been included in the vuetify examples as well.
Refer: https://vuetifyjs.com/en/components/date-pickers/#date-pickers-events
Yeah had a play around with it but doesn't seem you can get it to display multiple events as it is :( You can submit it as a feature though here and they're usually quite quick to respond if it's possible or not. Sorry I can't help any other way.
I am trying to access data from a single-file component in Vue, but can't find any way of doing it. I have tried using $emit, but can't get thath to work either. The data string has to be blank as it gets modified by an input field.
I have seen others' solutions here on SO, but either the don't fit with my problem or I can't get them to work. I want to try to keep it as simple and understandable as possible.
You can use the special attribute ref:
<child-comp ref="child"></child-comp>
In JS:
vm.$refs.child.YOUR_DATA
Hope this helps!
I'm trying to create a dynamic input element that is draggable. Now the problem is I create an element but when I use something like
$("#in"+index.toString()).draggable({cancel:true});
after I append it to the container div, it's not working. Basically it's not working for the dynamically created input element of a certain id. Here's the code and please feel free to point out problems. I could really use some help on this one. Thanks!
http://jsfiddle.net/ithril/hRCun/5/
The problem is that you are creating a new element that is not bound to the UI functions. I would suggest using clone(true,true) and then changing the parameters of the cloned element as need be. You can learn more about clone here. http://api.jquery.com/clone/