I was trying to use a ref and selector approach for setting / showing/ hiding a field on one of the tabs in a 6 tab panel. It throws an error saying:
Uncaught TypeError: Object [object Object] has no method 'get method
for selector.'
Is ref selector only to be used in a controller? I dont want to use Ext.getCmp() or Ext.ComponentQuery.query(). They are not recommended to use approach by ExtJs guys. We can use ref and selector in controller with out any problem by specifying the view in the views[] part and ref and selector in refs[] part. ref : 'x' selector:'xyz #x' this.getX()...
I followed the same method for referring a field inside a view. It fails. Why so? What are the other possible ways to set, hide and show fileds in other tabs not by Ext.getCmp() or Ext.ComponentQuery.query()...
Thoughts and suggestions are always welcome! thank u!
I believe refs are only available from within a controller. The recommended practice is using the down method. It works just like the component query except it only finds children of the component it is called from. So something like this should work.
YourTab.down('#fieldItemId').hide();
It appears in sencha docs that adding a ref is adding the method to the controller. So it would not be available outside the controller. Additionally, the method is actually internally executing Ext.ComponentQuery. Please see here for the information in sencha docs regarding refs
Related
So I understand how basic property binding works in angular for elements like input, but I came across some code that was using node module ng-drag-drop which comes with a set of its own custom directives. In html of a component there is a div element that uses one of the directives called droppable and property binding [dragOverClass]="'drag-target-border-green'" but DIV elements have no property like dragOverClass. So where does it come from? The directive? I was checking angular docs for data binding and it says nothing about this, just basic property binding chapter with input value examples. Thanks for the help.
I didn't know how to properly ask this question, so first sorry about the bad title.
Basically, to explain the problem I use the context of a web application that I am building with vueJS.
In this application I have a simple table that is rendered with data that comes from the server, basically I get an array of objects, and each object has some properties, the scope of the properties is not important.
Now I want to display some data in a table, and if some of the properties don't come from the server, I want to hide the property on the table, but keep the structure of the table, the missing property should have a empty space on the table.
I did it this way:
<div :style="{'visibility': computedValue}"></div>
This compute value basically is a computed property that returns the 'hidden' or 'show' for the visibility property.
But this brings some issues; on the computed property I am returning data based on the property object, for example:
company.createdAt can be undefined and I still have a error if I use visibility with :style.
I come from an angular environment where v-if and v-show were a little different, I know that v-if takes the element out from the DOM and v-show keeps it, but in vue if I do the above example with v-show it still works as v-if in the way that the rendered data works like the data was removed from the DOM.
I just wanted the empty space like it still is there.
Any help or explanations on this?
You can add your own v-visible using a vue directive. Simple add this:
Vue.directive('visible', (el, bind) => {
el.style.visibility=(!!bind.value) ? 'visible' : 'hidden';});
Then use it like you would v-show
You're trying to hide the element but preserve the space, right? vue-visible is a simple npm package that I used recently to do that; the benefit is when you include it, you can very easily and semantically use it like this: v-visible="value", just like v-show or v-if, with value being true/false.
For our application , we have initial load with data. We use those data to generate dynamic id and classes.
There are another api call we make to reload missing data. now the problem is if reload function bring different information, elementId complains that changing id is not allowed
like this(without api call)
https://ember-twiddle.com/394755fd5b355dd93cd147d4610fbf5e?openFiles=controllers.application.js%2Ctemplates.components.my-component.hbs
now , is there a good work around for this issue keeping this logic?
You're looking for a workaround. so have you considered to not use embers own div?
if you specify tagName: '' on your component, the component itself wont produce a div.
Next you can do <div id={{myId}}>...</div>, which will update correctly.
I'm trying to add an on-click inside a Polymer dom-repeat section. Looking at the documentation here, Polymer seems to do this automatically and store the data in a 'model' property.
Using this, I've been able to get the data (username) I want by doing this:
let username = event.model.__data__.user.username;
However, although this works, it definitely doesn't look right... Does anyone have any pointers?
So, despite what is printed out if you do console.log(event.model), you can actually just bypass the data altogether and just do:
event.model.user.username;
I am using the view helper multiple times, in order to render the same template but with different parameters every time, mostly booleans acting as option flags.
However, I get the following error, whenever I render more than 1 of the same view:
Assertion failed: Attempted to register a view with an id already in use: null
My element tags do not have an "ember id", e.g. id="ember224".
I replicated the issue in a JSBin:
Please note that in JSBin you won't be able to see the error logged in the console, for
whatever reason. A simple copy and paste over to
http://www.embersandbox.com/ and you can open up the console and see
the error itself.
http://jsbin.com/UHOh/1/edit?html,js,output
Does anyone have any idea why this happens? If so, could it be a problem? Everything else is working as it should, for now, so I am inclined to ignore it.
Thanks!
You are overriding the init() method of Ember.View and not calling this._super(). This causes the view to not initialize properly resulting in your view elements missing id attributes (e.g. id="ember224").
Below is a link to your original JSBin with the addition of MyCustomView.init() calling this._super(). You will find the view elements now have id attributes.
http://jsbin.com/UHOh/11/edit?html,js,output