I am using VMWare Clarity datagrid with single selection.
Behind the scene, I am receiving updated data and randomly, the selected row is no more selected.
I found those links where they seemed to have the same issue and looks like it is fixed in 0.12.2, but I don't see that from side:
https://github.com/vmware/clarity/issues/484
https://github.com/vmware/clarity/issues/2342
Here my code
html
<clr-datagrid [clDgRowSelection]="true" [(clrDgSingleSelected)]="selectedUnit">
...
<clr-dg-row *clrDgItems="let unit of units" [clrDgItem]="unit" (click)="backupSelectedUnit(unit)">
...
</clr-dg-row>
</clr-datagrid>
JS
myfunc() {
this.units = this.getUpdatedUnits();
}
Thanks in advance
You are missing the trackBy on *clrDgItems. Whenever you are dealing with objects you receive from the server, you really want to make sure you are using trackBy to help Angular (and thus Clarity) know how to compare your objects. Otherwise the only comparison Angular can perform is reference equality, which isn't preserved when you keep getting updated objects from the server. Here is the official documentation for it, and you can find a maybe more readable explanation in the template syntax docs.
*clrDgItems supports the same trackBy option as *ngFor, so you can just write:
<clr-dg-row *clrDgItems="let unit of units; trackBy: trackById" ...>
where trackById is a function you add to your component that looks like this:
trackById = (index, unit) => unit.id
I'm assuming here that the objects you receive from the server have an id, but you can use any other way to identify them depending on your specific use case.
Related
In my angularjs component.ts file I have code that looks like
this.inputmy_input_name[id] = 'input-txtgray';
what this does is that it adds input-txtgray class to form element my_input_name
but the problem is there are 2 or more form elements with the same name and I need to change only one (the one next to the element that triggered the call), I suppose thats what the id is supposed to do but doesn't.
I am new to Angular and I am not sure if this is something that is standard to Angular or is this something that is in the code somewhere?
Edit: The elements are autogenerated using other code and I can't change the elements without extensively editing the rest of the code and right now I do not wish to do so.
Any help highly appreciated.
Thanks
Rather than doing this way, you can use ngClass.
Read abt it here: angular.io/api/common/NgClass
<some-element [ngClass]="{'input-txtgray': true}">
</some-element>
In the place of true, you can put a boolean variable(initially false) and trigger it true on API call
I have a question about React Syntax.
I was conceptualising a rebuild of my website in React and was writing code to access the data-attribute value.
The method I used to get the data-attribute value was:
e.target.getAttribute('data-menuItem');
and that seemed to work just fine. Upon further investigation I read about the alternative notation for the same method looks like:
e.target.attributes.getNamedItem('data-menuItem').value
I would just like to know if the second method I mentioned is best practice or if it really matters at all.
Your help is much appreciated.
Thanks
Moe
Let suppose that you have <div data-pg="abc"></div> in your html then in react you can retrieve data attributes:
let val = e.target.dataset.pg
Now your val will have abc.
To retrieve value of data attribute, alternative way is:
let val = e.target.getAttribute('data-pg')
There is no real difference (DOM-wise) between getAttribute and attributes.getNamedItem - both exists in all modern browsers and you can use any of them.
The attributes property returns a live collection of all attribute nodes registered to the specified node, while the getAttribute function gives you direct access to the value of the attribute you wanted.
I would like to style a couple of elements using a filter to decipher if it should be yellow or red.
I understand filters should not carry logic operations in them as such so am guessing a service is the first port of call before i create any filter for it.
I am leveraging data from a backend (still a bit unsure of the Backend model here, but know I can leverage certain objects to obtain the data needed for working on) I mostly need to know if i`m on the right path by using a service to control the logical outcome and then a filter to provide 'filtration' of that outcome.
BTW: sorry, im waiting for my project to checkout from SVN at mo so cannot provide a skeleton attempt.
Will do in a bit though .....
Any advice before hand will be much appreciated
:) Gruffy - thanks for reading
You can directly set the class attribute if you want, so your filter can simply return the CSS class to apply:
<p class="{{'foo'|myFilter}}">Foo</p>
Here's a fiddle showing what I mean.
I am looking for something very simple. It can use the Selenium IDE recording tool, but it does not allow me to pick what kind of locators I get.
I want to use:
driver.findElement(By.className(str))
to locate things. All I need is something which watches which UI elements on a web page get clicked and writes out the class attributes of those tags.
If I use the Selenium IDE recording (and export to the right type of thing), I get:
#Test
public void testNav() throws Exception {
driver.get(baseUrl + "/");
driver.findElement(By.name("3.1.1.5.1.1")).clear();
driver.findElement(By.name("3.1.1.5.1.1")).sendKeys("dan");
driver.findElement(By.name("3.1.1.5.1.5")).click();
driver.findElement(By.linkText("Products")).click();
driver.findElement(By.linkText("Categories")).click();
driver.findElement(By.linkText("Create a Category")).click();
driver.findElement(By.linkText("Cancel")).click();
driver.findElement(By.linkText("Products")).click();
driver.findElement(By.cssSelector("a.DisplayAdminProductsLink")).click();
driver.findElement(By.linkText("Product1")).click();
There are problems with this. First, it is not give me any By.className() calls. Why? Those first 3 calls will not help me. The framework I am using puts arbitrary things into the name. How can I get it to see the class attribute?
There actually are unique words in the class attribute of all of the above tags. I design my apps so that this is so. Yet it will not use them.
Earlier I asked:
Why is it doing a "driver.findElement().click()"? This is fragile and does not
end up working.
What I need is:
elt = driver.waitFor(By.className("c")); elt.click();
This will work reproducibly.....
I am considering to be removed from the question, as the findElement() code does work. You need to set a general time-out on the driver. It is not very obvious that this can be done, but it can.
So, continuing on....
I can go to the "Options" and change the order of the "Locator Builders" in eclipse. I can put "css" at the top. Then I get:
driver.findElement(By.cssSelector("input[name=\"3.1.1.5.1.1\"]")).clear();
driver.findElement(By.cssSelector("input[name=\"3.1.1.5.1.1\"]")).sendKeys("dan");
driver.findElement(By.cssSelector("input[name=\"3.1.1.5.1.5\"]")).click();
The tags are like:
<input class="form-control LoginUsernameField" ... />
But it does not see the class attribute.... Or I can do this manually.
Selenium looks for a unique identifier to identify elements in a webpage. classNames are a very less desired option for this purpose as they are generally not unique. Ids and names on the other hand are generally unique. This might be the reason why Selenium IDE is not selecting classNames and going for other identifiers.
Selenium IDE records user actions. You would have clicked on the element for Selenium IDE to identify it and that is why you are getting driver.findElement().click().
If you want to wait for element to wait you can try implicit wait.
When you want to use driver.findElement(By.className(str)), are you sure that there is one and only one element in the webpage that is associated with a className? If that is the case you can modify the webdriver code manually to use className.
I have a requirement to perform an indexed search across content which must include a couple of tags in the result. The tags must be a random selection. The platform is Drupal 7.12
I have created a view that manages the results of a SOLR search through the search_api. The view returns the required content and seems to work as intended. I have included a couple of Global: custom text fields as placeholders for the tag entries.
I am now looking for a solution to manage the requirement to randomise the tag values. The randomisation is not the issue, the issue is how to include the random values into the view result.
My current approach is to write a views_pre_render hook to intercept the placeholders which appear as fields ([nothing] and [nothing_1]). The test code looks like the following
function MODULE_views_pre_render( &$view )
{
$view_display = $view->display['default'];
$display_option = $view_display->display_options;
$fields = $display_option['fields'];
foreach( $view->result as $result )
{
$fields['nothing']['alter']['text'] = sprintf("test %d", rand(1,9));
}
}
I am currently not seeing any change in the placeholder when the view is rendered.
Any pointers to approach, alternate solutions etc would be gratefully received as this is consuming a lot of scarce time at the moment. Calling print_r( $view ) from within the hook dumps over 46M into a log file for a result set of 2 items.
There are two possible solutions for your task.
First approach is do everything on the template level. Define a template for the view field you want to randomize. In advanced settings of your display go to Theme: Information. Make sure that the proper theme is selected and find the template suggestions for your field. They are listed starting from most general to the most specific and you can choose whatever suits you better.
I guess the most specific template suggestion for your field would be something like this: views-view-field--[YOR VIEW NAME]--[YOUR DISPLAY NAME]--nothing.tpl.php. Create the file with that name in the theme templates directory and in this template you can render what ever you want.
By default this template has only one line:
print $output;
you can change this to:
print sprintf("test %d", rand(1,9));
or to anything else, whatsoever :)
Second approach is to go with Views PHP module. WIth this module you can add a custom PHP field in which you can do whatever you want. Even though the module hasn't been released it seems to work quite well for the most of the tasks and most certainly for such a simple task as randomizing numbers it will work out for sure.
I stumbled upon this while searching for another issue and thought I would contribute.
Instead of adding another module or modifying a template, just add a views "sort criteria" of "Global: Random".