var user = {};
var row = $('<tr></tr>')
.append($('<td></td>').text(user ? user.call_id : ''))
.append($('<td></td>').text(user ? user.phone_number : ''))
.append($('<td></td>').text(user ? user.dialed_number : ''))
.append($('<td></td>').html(user && user.admin ? '<span class="textgreen">admin</span>' : 'guest'))
.append($('<td></td>').append(_talking(user ? user.mute : 0)))
.append($('<td></td>').append($('<span></span>').addClass('timer').text(user ? user.duration : '')))
.append($('<td></td>').addClass('nowrap').append(_userButtons(user)))
;
alert( row.find('td').size() ); // = does NOT always alert 7, but a smaller value
Why is that so?
At the moment, user.dialed_number is undefined, therefore the missing column is the third one. And it doesn't matter how much I repeat that column, the result is always 6 in my project.
** UPDATE **
Here is a simplified jsfiddle showing the problem; it should output 7, but it shows 4
AHA!
$('<td></td>').text(undefined)
is the same as
$('<td></td>').text()
Which as per the jquery document for .text (look at the top right of the doc) it returns the text inside the element. Then you append that text (which is an empty string) to the <tr>. And that is why the <td> is not appended
Simple fix:
$('<td></td>').text((true ? undefined : 'false') || '') // oops should be ||
will do an empty string when the first part can be coerced to null (like undefined, 0, null, '', and 0.0)
Proof of concept: JS Fiddle
If any one of the expressions passed to .text() evaluates to null or undefined, the call to .text() will return the text of the TD - which is nothing - instead of the jQuery collection representing the TD. So you'd append 6 TDs and a nothing.
You're checking that the user exists each time, but not checking if the property exists which is returning undefined and making your statement append the contents of the td (which is nothing) instead of the td itself.
If you change your tests to check for the property instead, it works:
Demo
In your jsfiddle, the reason it is only showing 4 is that the properties on user are not defined.
Look at this jsfiddle
Maybe your user properties are not defined?
I would strongly suggest you stop trying to be quite so clever and single-step each append and see what's happening, rather than trying to do it all in one line. For one thing, it probably isn't doing what you think it should be doing anyway the way you wrote it - each td is getting inserted INSIDE the previous one!
Try this way:
var row = $('<tr></tr>');
row.append($('<td></td>').text(user ? user.call_id : ''));
row.append($('<td></td>').text(user ? user.phone_number : ''));
row.append($('<td></td>').text(user ? user.dialed_number : ''));
row.append($('<td></td>').html(user && user.admin ? '<span class="textgreen">admin</span>' : 'guest'));
row.append($('<td></td>').append(_talking(user ? user.mute : 0)));
row.append($('<td></td>').append($('<span></span>').addClass('timer').text(user ? user.duration : '')));
row.append($('<td></td>').addClass('nowrap').append(_userButtons(user)));
alert( row.find('td').size() ); // = alerts 6 when it should be 7
Also, when I run your code even with your crazy syntax (after ensuring that all functions and variables are defined and exist) I get 7.
The script appends the cell to the previous cell, not the row. $.end() returns the selected object at the beginning of the chain, i.e.:
$('tr', this).append($('<td>').text(user ? user.call_id : ''))
.end().append($('<td>').text(user ? user.phone_number : ''))
.end().append($('<td>').text(user ? user.dialed_number : '')) //etc.
corrected version
function _talking() {
return $('<span>TalkingFn</span>');
}
function _userButtons() {
return $('<button>button1</button><button>button2</button>');
}
var user = {};
var row = $('<tr></tr>')
.append($('<td></td>').text(user.call_id ? user.call_id : '{calli_id}'))
.append($('<td></td>').text(user.phone_number ? user.phone_number : '{phone_number}'))
.append($('<td></td>').text(user.dialed_number ? user.dialed_number : '{dialed_number}'))
.append($('<td></td>').html(user && user.admin ? '<span class="textgreen">admin</span>' : 'guest'))
.append($('<td></td>').append(_talking(user.mute ? user.mute : 0)))
.append($('<td></td>').append($('<span></span>').addClass('timer').text(user.duration ? user.duration : '')))
.append($('<td></td>').addClass('nowrap').append(_userButtons(user)))
;
alert( row.find('td').size() ); // = alerts 6 when it should be 7
$('#foo > tbody').append(row);
Related
I want to use a ternary operator for the below jQuery statement like if employee_salary is empty or null, I want to assign as 0 (zero). Otherwise, just assign the actual value.
jQuery('#employee_form #employee_salary').val(parseInt(selected_table_data['employee_salary']))
var employee_salary = selected_table_data['employee_salary'];
var salary_form_value = employeeSalary ? parseInt(employee_salary) : '0';
jQuery('#employee_form #employee_salary').val(salary_form_value);
// If you want to inline it, you could do the following:
jQuery('#employee_form #employee_salary').val(
selected_table_data['employee_salary']
? parseInt(selected_table_data['employee_salary']
: 0
);
Here is an example
const s1 = null;
console.log(s1 ? s1 : 'There was a null value');
const s2 = ''
console.log(s2 ? s2 : 'There was an empty string');
const s3 = 'value';
console.log(s3 ? s3 : 'There was no value');
You can use ternary operator simply.
selected_table_data['employee_salary']
? parseInt(selected_table_data['employee_salary'])
: 0
console.log('' || 0);
console.log(null || 0);
console.log(undefined || 0);
I suspect that parseInt was your attempt to make this work yourself (fair enough). I'm going to suggest you remove it and try simply
jQuery('#employee_form #employee_salary').val(selected_table_data['employee_salary'] || 0);
A simple solution for you.
jQuery('#employee_form #employee_salary').val(selected_table_data['employee_salary'] * 1)
Using || operator or just a simple ternary operator would work if its null, undefined or ''. But it won't work for a blank space like this one ' ' (since Boolean (' ') evaluates as true) which it's not good if you want to replace any empty string or blank spaces for zero. So I would suggest you to do something like this,
jQuery('#employee_form #employee_salary').val(parseInt(selected_table_data['employee_salary']) ? parseInt(selected_table_data['employee_salary']) : 0);
This will allow you not only check if null, undefined, empty string and white spaces but also will prevent NaN to be a value on your form (instead zero will take place).
I am trying to compare value of TestScript with string "Investisseur" But this seems not working and I don't go into the if statement.
console.log(GM_getValue(TestScript));
if(GM_getValue(TestScript) == "Investisseur")
{
//Should be there
}
console.log(GM_getValue(TestScript)); returns :
So the if condition would return true and not false .. What Am I doing Wrong ?
EDIT
It seems like the check before reset my #GM_getValue:
if(GM_getValue(TestScript) == "Investisseur" || GM_getValue(TestScript) == null || GM_getValue(TestScript) == undefined ){
GM_setValue(TimeoutMain, 1000)
}else if(GM_getValue(TestScript) == "Emetteur"){
GM_setValue(TimeoutMain, 10000)
}
Any Idea why ? When I try to Console.log after this it display nothing .. Why is the value deleted ?
Maybe more understandable with a screen there :
TestScript might have extra spaces.
trim() removes leading and trailing whitespace.
Try replacing:
GM_getValue(TestScript)
with:
if (GM_getValue(TestScript).trim() == "Investisseur")
Is it possible to use ternary operator in ng-click directory and call more than one function? I mean something like that:
<div ng-click="a==1 ? func1() func2() : ''">
Yes, but see the ternary operator, as this link says:
You can also do more than one single operation per case, separating
them with a comma, and enclosing them in parenthesis:
var stop = false, age = 23;
age > 18 ? (
alert('OK, you can go.'),
location.assign('continue.html') ) : (
stop = true,
alert('Sorry, you are much too young!') );
You can also do more than one operation during the assignation of a
value. In this case, the last comma-separated value of the parenthesis
will be the value to be assigned.
But, it's not a problem for you.
You can call functions via ternary operator.
(a == 1) ? function1() : function2();
(a == 1) ? function1(param1) : function2(param1); //with input params
But calling the one, as you posted will return syntax error. Try below;
(a == 1) ? (function1(),function2()) : "'";
(a == 1) ? (function() { function1(); function2() })() : "'";
Though it's possible, it's not clean & easily readable. My suggestion would be to try as below;
(a == 1) ? combinedFunction() : "'"; //Put function1 & function2 within this combined function
You can call the functions in conditional operator
<div ng-click="a==1 ? func1(func2()) : angular.noop() ">
angular.noop() is an empty function or put "null"
plnkr like here
I have javascript function that will calculate the value for "TOTAL" row and "Balance" column in the table. But if there are no input, the javascript will return NaN which is not a number error.
How to set if there are no input in the text box, javascript will interpret it as 0 so that I will not get NaN error.
As you can see, the textbox for pay(notes 50) column are empty. Then value for balance and total become NaN.
just use logical 'or' operator (see short-circuit evaluation),
parseInt('10') || 0; // give 10
parseInt('') || 0; // give 0
You can check whether the value is a number by isNaN() function and then perform summation.
use isNaN(), put it in an if statement, if true, set the variable to 0
if(isNaN(yourVar)) {
yourVar = 0;
}
Ternary operator will work just fine
yourVar = (isNaN(yourVar)) ? 0 : yourVar
So if you want to check if your textbox value is empty or not, you can use:
val = your_textbox_value == '' ? 0 : your_textbox_value
assign that object to it this will work fine
you_object = you_object == null ? "0" : you_object;
I have searched around and don't think I am asking a duplicated question, if I am, I'll delete immediately.
I have this:
$('#dti').text(result3.toFixed(2));
The question is how do I append this with '%'
I am hardcoding a % sign in now but it shows even if there is no value...
$('#dti').text(result3.toFixed(2) + (result3?"%":""));
If result3 can never be emtpy or null but a value >= 0 and you don't want to show 0% then you can try this
$('#dti').text(result3 ? (result3.toFixed(2) + "%") : "");
How about:
$('#dti').text(num = result3.toFixed(2) ? num + '%' : '');