Display a link in javascript if var is not empty. checking var endefined not working

Question

I need to display a link in sweetalert html only if the var is not empty. Here is the code:

$('.patient-details').click(function(e) {
e.preventDefault();
var $this = $(this)
var name = $this.data('name');
var gender = $this.data('gender');
var age = $this.data('age');
var country = $this.data('country');
var address = $this.data('address');
var report = $this.data('report');
swal({
title: name,
html:
    "Gender: " + gender +"<br>" +
   "Age: " + age +"<br>" +
   "Country: " + country +"<br>" +
   "Address: " + address +"<br>" +
   (report!=undefined?'<a href="' + report + '" target="_blank">View Report</a>':''),
});
});

I need the report link to be displayed only if var report is not empty. Here is the code pen: https://codepen.io/pamela123/pen/GOJZgo

I tried

if(report){
report = $this.data('report');
}

report is "undefined". report!=undefined is not working.

But how not to display the report link inside the html if report is empty ??

I know it is a simple javascript question, but being a newbie i could not get further.

Just put a check if it is blank, then do not include the anchor. — Mayank Pandeyz, Oct 31 '17 at 12:07
It seems like your variable has the content `"undefined"` according to your question. This indicates that it is a string. Which will lead the if statement to be true — kevinSpaceyIsKeyserSöze, Oct 31 '17 at 12:15
@ kevinSpaceyIsKeyserSöze Which is exactly my question. It is not working as can be seen in the codepen. https://codepen.io/pamela123/pen/GOJZgo — Pamela, Oct 31 '17 at 12:21
@Pamela can't see that the report value is undefined. Can you provide a codepen when it is undefined? — kevinSpaceyIsKeyserSöze, Oct 31 '17 at 12:25

Nitishkumar Singh · Answer 1 · 2017-10-31T12:24:38.953

1

You Can Update your Code as below

var htmlTemplate="Gender: " + gender +"<br>" +"Age: " + age +"<br>" + "Country: " + country +"<br>" + "Address: " + address +"<br>" ;
if(report){
   htmlTemplate+= '<a href="' + report + '" target="_blank">View Report</a>';
}
swal({
title: name,
html: htmlTemplate,
});

edited Oct 31 '17 at 12:24

answered Oct 31 '17 at 12:12

Nitishkumar Singh

1,781
1
15
33

Why is report !== undefined not working??? Your solution works. But my question was why undefined is not working ?? – Pamela Oct 31 '17 at 12:33
Since you are passing **data-report=""**, that is why it's not working for undefined – Nitishkumar Singh Oct 31 '17 at 12:45
if( report !== undefined && report != "" ) will work. As i am getting the value from a DB. In some cases it may be empty. Please See the accepted answer. – Pamela Oct 31 '17 at 12:56
If You remove report !="", that code will also not work. I would recommend you to read https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators, you will get more clarity on conditions – Nitishkumar Singh Oct 31 '17 at 13:03

GreyRoofPigeon · Accepted Answer · 2017-10-31T12:35:51.970

1

Put the data in a separate variable.

Then check if report is not undefined. If not, add it to the variable.

$('.patient-details').click(function(e) {
  e.preventDefault();
  var $this = $(this)
  var name = $this.data('name');
  var gender = $this.data('gender');
  var age = $this.data('age');
  var country = $this.data('country');
  var address = $this.data('address');
  var report = $this.data('report');

  var htmlData = "Gender: " + gender + "<br>" +
      "Age: " + age + "<br>" +
      "Country: " + country + "<br>" +
      "Address: " + address + "<br>";
  if( report !== undefined && report != "" ) {
    htmlData +=  '<a href="' + report + '" target="_blank">View Report</a>'
  }
  swal({
    title: name,
    html: htmlData
  });
});

edited Oct 31 '17 at 12:35

answered Oct 31 '17 at 12:24

GreyRoofPigeon

17,833
4
36
59

Sorry..Not working. – Pamela Oct 31 '17 at 12:29
After changing if( report)..it will work. But not if report !== undefined. which was my question. Wonder why report !== undefined is not working ?? – Pamela Oct 31 '17 at 12:31
Works for me: https://codepen.io/anon/pen/XzbpBK – GreyRoofPigeon Oct 31 '17 at 12:33
I have added `&& report`. With that addition it works when the `data-report` attribute is empty **and** if the attribute isn't set at all (https://codepen.io/anon/pen/VrLPVQ) – GreyRoofPigeon Oct 31 '17 at 12:35
Then try the code again, I've changed it in my answer – GreyRoofPigeon Oct 31 '17 at 12:38
You have added && report != "" and it will work fine. But not with report !== undefined. – Pamela Oct 31 '17 at 12:39
The code in my answer works... see these test cases: http://jsfiddle.net/6ygkvk42/ – GreyRoofPigeon Oct 31 '17 at 12:44
Somebody down voted my question. I don't know why ?? – Pamela Oct 31 '17 at 12:45
Thank you so much. I will accept your answer as the best. Please consider removing my down votes too, if you don't mind. – Pamela Oct 31 '17 at 12:46
I didn't downvote... – GreyRoofPigeon Oct 31 '17 at 14:47

Sandeep · Answer 3 · 2017-10-31T12:55:06.090

0

$('.patient-details').click(function(e) {
e.preventDefault();
var $this = $(this)
var name = $this.data('name');
var gender = $this.data('gender');
var age = $this.data('age');
var country = $this.data('country');
var address = $this.data('address');
var report = $this.data('report');
swal({
title: name,
html:
    "Gender: " + gender +"<br>" +
   "Age: " + age +"<br>" +
   "Country: " + country +"<br>" +
   "Address: " + address +"<br>" +(typeof report !== "undefined" && report != ""?'<a href="' + report + '" target="_blank">View Report</a>':'')
    ,
});
});

edited Oct 31 '17 at 12:55

answered Oct 31 '17 at 12:06

Sandeep

413
4
13

report!=null? is not working. – Pamela Oct 31 '17 at 12:12
use typeof report != "undefined" instead of that – Sandeep Oct 31 '17 at 12:16
Sorry..That is not working either. – Pamela Oct 31 '17 at 12:23
Check the above code that will work (typeof report !== "undefined"?'View Report':'') – Sandeep Oct 31 '17 at 12:25

Display a link in javascript if var is not empty. checking var endefined not working

3 Answers3