Develop Reference

Angular JS - Using ng-show to show something based on complex requirements

I just started learning Angular JS, and I need a way to use ng-show to show a line of text by considering the following:
1.) If both number fields have been filled in, display the line of text.
2.) If both number fields have been filled in but both are 0, display the line of text.
3.) If both number fields have been filled in and one is 0 but the other is a different number, display the text.
This is my code so far:
<p ng-show="(firstNumber && secondNumber) || (firstNumber == 0 && secondNumber == 0)">
The product is {{firstNumber * secondNumber}}
</p>
Right now, this line of code fulfills requirements 1 and 2, but when 0 is entered and another number is entered which is not zero, the line of text doesn't show.
Any ideas on how to get this done? I feel like the conditional operation statement will be pretty complex.
I think I should include more of my code since many seem to assume that I have "text" as the input type when I have "number". This is probably why Charlie's solution isn't working:
<p>Enter first number: <input type="number" ng-model="firstNumber"></p>
<p>Enter second number: <input type="number" ng-model="secondNumber" /></p>

The collective logic of all your requirements is to see if both fields are numbers.
<p ng-show="isNumber(firstNumber) && isNumber(secondNumber))">
The product is {{firstNumber * secondNumber}}
</p>
In your controller
$scope.isNumber = function(value) {
return !isNaN(value)
}

It's a good idea to encapsulate every piece of complex logic into a function method of your controller or better yet a model i.e.:
.controller('MyCtrl', function($scope){
$scope.isResultVisible = function(){
return $scope.firstNumber >= 0 && $scope.secondNumber >= 0;
};
$scope.result = function(){
return $scope.firstNumber * $scope.secondNumber;
};
});
And then use it inside of markup:
<p ng-show="isResultVisible()">
The product is {{result()}}
</p>

display 125 words from the description field of the database mysql

Hello fellow Overflows,
So im in the middle of creating a toplist script, ready to launch to the public,
I'm stuck on one perticualr subject.
Displaying X amount of content from A database field.
<?php echo $server_data['description']; ?>
As you can see in this image below, That wouldn't be a good idea to display the full amount.
http://i.imgur.com/IhLs7L7.png
What do i need?
Instead of it displaying all of the database field, i just want it to display 150 characters of the field.

It is best to limit characters while you are selecting from database because it will improve performance a bit. You can limit characters on select with mysql LEFT() function.
Here is how to do it:
SELECT LEFT(description, 150), another_col FROM ......

Try this:
$string = substr($server_data['description'], 0, 150);

substr() will only return a certain amount of characters. If you want a certain amount of words then you could use the following:
<?php
function excerpt($content = '',$number_words = 125){
$content = strip_tags($content);
$contentWords = substr_count($content," ") + 1;
$words = explode(" ",$content,($number_words+1));
$excerpt = join(" ",$words);
return $excerpt;
}
echo excerpt($server_data['description'], 125);

Calculating multiple items

I am trying to find the markup of items based on the price we purchase the item minus the price we charge and divide that by the price sell it for times 100 Anyways I'm trying to this for multiple items onblur but for some reason i it comes up with NaN. I am bad at explaining things here's the example of what I want to do.
<script language="javascript">
function calculatemarkup(){
Example of the entry
if(isNaN(document.TOTALS.CostFOBfact4.value) || document.TOTALS.CostFOBfact4.value==""){ 
var text8 = 0; 
}else{ 
var text8 = parseFloat(document.TOTALS.CostFOBfact4.value); 
} 
Calculations
document.TOTALS.markup.value = ((((text16-text2)/text16)+((text17-text4)/text17)+ ((text18-text6)/text18)+((text19-text8)/text19)+((text20-text10)/text20)+((text21- text12)/text21)+((text22-text14)/text22)+((text23-text15)/text23))*100).toFixed(1); 
}
</script>

How to efficiently use jQuery to multiply columns of dynamically rendered table

I'm working on a pretty big table/form that is dynamically created depending on stock availability. The table has 5 fields: Code, Prod.Name, Amount, Price and SubTotal. The user is supposed to set a number in the Amount field and then there's a jQuery script that multiplies that amount for the price to display the SubTotal. In the table, a product looks like this:
<tr>
<td>Princess 01</td>
<td>Conjunto corpiño y cola less <strong>Talle 85</strong></td>
<td><input type="text" id="princess-lingerie-id-963" name="[princess-lingerie][id_963]" value=""></td>
<td>$<input type="text" id="price_princess-lingerie-id-963" value="99" readonly="readonly"/></td>
<td id="subTotal_princess-lingerie-id-963" name="subTotal"></td>
</tr>
My problem is that I have many different products that belong to different product categories, so while this belongs to the "princess-lingerie" (don't laugh) category, a product from the "cosmetica" category looks like this:
<tr>
<td>D02/3</td>
<td>Magic Dual aroma Frutos Rojos</td>
<td><input type="text" id="cosmetica-stock-id-1008" name="[cosmetica-stock][id_1008]" value=""></td>
<td>$<input type="text" id="price_cosmetica-stock-id-1008" value="26" readonly="readonly"/></td>
I have actually already created the little bit of logic which would work for only one field, but I don't know how to extend it to the whole table. Could anyone give me a hand with it? ...I'm a little bit overwhelmed and don't know where to start right now.
$(document).ready(function(){
$("#princess-lingerie-id-963").keyup(function() {
var howMany = parseInt($("#princess-lingerie-id-963").val());
var subTotal = parseInt($("#price_princess-lingerie-id-963").val()) * howMany;
//assign subTotal to the td
$("#subTotal_princess-lingerie-id-963").html(subTotal);
});
});

Shad is right to suggest adding useful classes. To handle the calculations in a sustainable way across a multi-row table, you'll also need a way to generically identify which row you're calculating on. I'm sure this could be greatly improved, but here's a basic example:
The jsfiddle demo is here.
// there are two cells where the 'id' has this pattern, but only one is selectable (the other is read-only)
// still, it would be better to give it a class if at all possible to avoid confusion
// and possible tampering by users
$("input[id*=-id-]").keyup(function() {
var howMany = parseInt($(this).parent().next().find('input').val(), 10);
var subTotal = parseInt($(this).val(), 10) * howMany;
//assign subTotal to the td
$(this).parent().next().next().html(subTotal);
});
EDIT:
Updated to include radix and condition for blank value:
http://jsfiddle.net/RzBeM/2/
$("input[id*=-id-]").keyup(function() {
var howMany = parseInt($(this).parent().next().find('input').val(), 10);
var subTotal = parseInt($(this).val(), 10) * howMany;
if (isNaN(subTotal)) subTotal = 0;
//assign subTotal to the td
$(this).parent().next().next().html(subTotal);
});

First, I would start giving your inputs useful classes, like 'qty' and 'price', and then the final cell can have a class of 'subtotal'. That makes the next step possible:
jQuery('#TABLEID tr').each(function(i,E){
var subT=parseInt(jQuery(E).find('.qty').val(),10) * parseFloat(jQuery(E).find('.price').val());
jQuery(E).find('.subtotal').text('$' + subT.toFixed(2));
});
I use jQuery to iterate over each tr in the table, and run the necessary calculations.
The final solution could use a further tweaked version:
jQuery(function(){
jQuery('.qty').keyup(function(){
var E=jQuery(this).parents('tr').filter(':first');
var subT=parseInt(E.find('.qty').val(),10) * parseFloat(E.find('.price').val());
E.find('.subtotal').text('$' + subT.toFixed(2));
});
});

Count characters in paragraph using jQuery (*not* for input/textarea)

How do I work out in jQuery a character counter of a p/div tag?
Basically i want to show a different css value IF the character value >=50.
Been struggling for hours with it :)

Use
$("#myDiv").text().length;

var $div = $('#mydiv');
if($div.text().length >= 50) {
$div.addClass('class');
}

Put a "long" class on all div and p elements with more than 50 characters:
$("p, div").filter(function(){
return $(this).text().length >=50;
}).addClass('long');
If you don't know how much content you have, though, then presumably this content is generated dynamically by the server, right? And if this is the case, wouldn't it make more sense to have the server—which knows how much content it's plopping into these containers—add the class dynamically while generating the page to send? Why rely on jQuery?

Try this snippet it works even if the text's length was greater than 50 characters.
You can also calculate the character digits of the paragraph. (Excluding new lines and space bars)
window.setInterval(function() {
var txt = $("#txt").val();
var parLength = $("#data").text().length;
var charLength = txt.replace(/ /g, '').replace(/\n/g, '').length;
$("#data").text(txt);
$("#calcLength").text("The paragrapgh's length is: " + parLength);
$("#calcChar").text("The amount of characters is: " + charLength);
}, 10);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea id="txt" placeholder="Enter text here..." style="height:100px;width:250px"></textarea>
<p id="data"></p>
<p id="calcLength"></p>
<b>Note: even a space character is calculated through the length function</b>
<p id="calcChar"></p>
<b>Note: a space bar,and every empty line is trimmed in the second calculated value</b>
I have provided this example to make it simple for use and compatability.