React values multiply in a table - reactjs

I want to multiply {value.item.itemPrice} and {value.itemCount} and assigned to next<td></td>..I tried using {value.item.itemPrice}*{value.itemCount} but not working.please help me to solve this.I get this values from axios get API call.
<tbody>
{itemList.map((value, key) => (
<tr key={key}>
<td>{value.itemId}</td>
<td>{value.item.itemPrice}</td>
<td>{value.itemCount}</td>
<td>{value.item.itemPrice}*{value.itemCount}</td> //not woring this
</tr>
))}
<tr>
<td></td>
<td></td>
<td>Total</td>
<td>total here</td>
</tr>
</tbody>

When you use {my_var} everything that is inside is executed as javascript code and you can do mathematical operations or whatever you need.
This is how your code would be so that it works as you need.
<td>{value.item.itemPrice * value.itemCount}</td> // this code is ready

Bracket {} will tell JSX parser that the syntax should be interpreted as javascript and return value to be shown. Did you try ?
{value.item.itemPrice * value.itemCount}

Try That:
<td>{value.item.itemPrice * value.itemCount}</td>
you were displaying * as a text because it was outside of the brackets, then it wouldn't multiply

Related

How to subsititute a property name in an angularjs expression with a string

Given a set of columns specified by a user. Which will be contained within displayColumns i.e. ['value1', 'value2', 'value3'] i want to iterate over this set of values to provide me with the correct reference to each value in the model.
I don't know what the syntax is for substituting the column name into an expression so that when angular compiles it, it would look like -> {{device.name.value1.value.value}} ... I've tried [] but that obviously didn't work!
<tbody md-body>
<tr md-row ng-repeat="device in $ctrl.devices track by device.mRID">
<td md-cell ng-click="$ctrl.detailedView($event, device)">{{device.aliasName}}</td>
<td md-cell>{{device.mRID}}</td>
<td md-cell ng-repeat="column in $ctrl.displayColumns">{{device.name.[column].value.value}} {{device.name.[column].unit.symbol}}<td>
</tr>
</tbody>
This is called bracket notation:
{{device.name[column].value.value}} {{device.name[column].unit.sybmol}}
Not this:
{{device.name.[column].value.value}} {{device.name.[column].unit.sybmol}}

ng-repeat not coloring elements properly?

I am stumped on why the fields in my data aren't coloring correctly. I used a simple greater than logic to assign an ng-class of either green, or red. I added debug lines to check that inside the function the values are correct, and the bool is correct, but on the main page items are 'randomly' colored incorrectly. Help?
I tried several different things on the values, like parseInt() etc with the same results. As Is, no matter what I put inside the function it displays different colors than expected
<table>
<th><input class="search" type="text" ng-model="searchKey" placeholder="Character" ng-change="setClickedRow(-1)"></th>
<th ng-click="setSort('pval1')">
<div ng-app="KIdash" ng-controller="controller">
Total Matches: {{TotalMatchesFunc()}}
</div>
</th>
<th ng-click="setSort('pval2')">Wins</th>
<th ng-click="setSort('pval3')">Losses</th>
<tbody ng-repeat="ps in PlayerStats | orderBy: sortKey | filter:searchKey">
<tr ng-class="{'main-row-selected': $index == selectedRow,'main-row': $index != selectedRow}" ng-click="setClickedRow($index)">
<td>{{ps.name}}</td>
<td>{{ps.pval1}}</td>
<!-- *** THIS IS THE PART THAT ISNT WORKING CORRECTLY *** -->
<td ng-class="{'green': GreaterWins({{$index}}),'red': !GreaterWins({{$index}})}">{{ps.pval2}}</td>
<td>{{ps.pval3}}</td>
</tr>
<!-- *** COULD THIS SECOND FUNCTION CALL BE POLLUTING MY RESULTS? *** -->
<tr ng-class="{'extra-row-green': GreaterWins({{$index}}),'extra-row-red': !GreaterWins({{$index}})}" ng-show="selectedRow == $index">
<td>Detail: {{ps.detail_p1}}</td>
<td>Detail: {{ps.detail_p2}}</td>
<td>Detail: {{ps.detail_p3}}</td>
<td>Detail: {{ps.detail_p4}}</td>
</tr>
</tbody>
</table>
$scope.GreaterWins = function(z) {
console.log( "bool "
+ Boolean($scope.PlayerStats[z].pval2 > $scope.PlayerStats[z].pval3)
+ " "
+ $scope.PlayerStats[z].pval2 + "vs" + $scope.PlayerStats[z].pval3);
return Boolean($scope.PlayerStats[z].pval2 > $scope.PlayerStats[z].pval3));
};
Two things which i feel is creating issue.
Instead of passing index in function you should pass variable ps as ngRepeat create isolated scope. so some time there is issue.
variable selectedRow should be object as primitive variables has issue in inheritance and two data binding.
try both things your code should work.
I can't really repeat the issue using JSbin, here is the example I made in JSbin.
https://jsbin.com/jadiputoha/edit?html,js,console,output

Unable to get Text from a Span tag in WebDriver

<tr>
<tr>
<td class="style1" valign="top"> URL : </td>
<td class="style3">
<span id="lblPresenter" class="bord">https://testurl.net</span>
</td>
</tr>
</tr>
enter code here
we1 = driver.findElement(By.xpath("//*[#id='lblPresenter']"));
System.out.println(we1.getAttribute("InnerHTML"));
//I am getting Null as result
or
System.out.println(we1.getText());
//I am not getting any result
strong text
I need to get URL from the above source code .
If any body have a solution please let me know .
In general, XPath should be avoided because it's slower and more error prone. This is a simple scenario that doesn't require an XPath. You can do the same thing using By.id()
WebElement ele = driver.findElement(By.id("lblPresenter"));
System.out.println(ele.getAttribute("innerHTML"));
System.out.println(ele.getText());
One issue with your we1.getAttribute("InnerHTML") is that the i in innerHTML should not be capitalized. Please try the above code and see if that works. If not, please post the results/errors.

CakePHP, number of views

Suppose, this is a db table in my project :
<table>
<tr>
<th>id</th>
<th>title</th>
<th>description</th>
<th>created</th>
<th>modified</th>
<th>........</th>
</tr>
<tr>
<td>1</td>
<td>Some Title</td>
<td>Some Description</td>
<td>7/8/2013 8:50</td>
<td>7/8/2013 8:50</td>
<td>........</td>
</tr>
</table>
Now, I want to get the number how many times record 1 (id=1) has been seen. And that is in CakePHP. Is there any easy way to get this information ? I know created and modified are 2 fields whose values are automatically generated by CakePHP. So, is there any field or something that can be used here ? I marked this as ......... . Or, is there any other way to do this ? Thanks.
There's nothing built-in, but it's not hard to make yourself. (The hard part is to not increment the counter when search engine bots access the page if it's reachable to them.)
In the database create a field viewcount INT DEFAULT 0 for example. In the controller, assuming the model is called Model and action is view (replace with actual names), add the code that increments the counter when the page is viewed:
function view( $id ) {
// ....
$this->Model->updateAll(
array( 'Model.viewcount', 'Model.viewcount + 1' ),
array( 'Model.id', $id )
);
}
CakePHP doesn't have an "automatic" viewed field. If you'd like this functionality you have to implement it yourself with the updateAll method:
$this->Model->updateAll(
array('Model.views', 'Model.views + 1'),
array('Model.id', $id)
);

xquery to order with header values in the way

Can you partially order xml data types using an xquery when the logical columns aren't consistent (such as when there are headers in the first row(s))?
Edit Had a bad example, mislead answers away from original question. How could I order the typ column values, leaving the th headers at top? Or vice versa, ordering by the integer column rts instead?
Say I have this XML stored in an mssql XML field (select thexml from xmldata returns one row containing the following):
<table cellpadding="2" cellspacing="3" border="1">
<tr>
<th>typ</th>
<th>rts</th>
</tr>
<tr>
<td>ABC</td>
<td>26</td>
</tr>
<tr>
<td>DCC</td>
<td>21</td>
</tr>
<tr>
<td>DBB</td>
<td>4</td>
</tr>
<tr>
<td>XBQ</td>
<td>152</td>
</tr>
<tr>
<td>AHI</td>
<td>349</td>
</tr>
</table>
Now say I want to sort this by the HTML column typ. I'm looking for the following result:
<table cellpadding="2" cellspacing="3" border="1">
<tr>
<th>typ</th>
<th>rts</th>
</tr>
<tr>
<td>ABC</td>
<td>26</td>
</tr>
<tr>
<td>AHI</td>
<td>349</td>
</tr>
<tr>
<td>DBB</td>
<td>4</td>
</tr>
<tr>
<td>DCC</td>
<td>21</td>
</tr>
<tr>
<td>XBQ</td>
<td>152</td>
</tr>
</table>
Any XQuery experts who can break this down for me?
To sort on a particular column, reconstruct the table and then sort on non header rows:
SELECT thexml.query('
element table {
/table/#*,
/table/tr[th], (: copy header :)
for $r in /table/tr[not(th)] (: exclude header :)
order by $r/td[1] (: $r/td[2] to sort on rts col :)
return $r
}')
FROM xmldata

Resources