if else in coffee script

Question

Folks,

I have two text boxes in my html. I wanted to compare their values using coffee script. Although I have googled about it, and I am kind of sure that I am doing what is expected to do but still I see a strange behavior.

Thing is :

Lets say, I have two text boxes with id as "title" and "author". Along with that, I have a button which onclick triggers the coffee script function.

My coffee script function looks as:

check_fields = ->
  elem_book_title  = $("#title").val()
  elem_book_author = $("#author").val()
  alert(elem_book_title)
  alert(elem_book_author)
  if not elem_book_title? 
    alert("title is null")
  else if not elem_book_author?
    alert("author is null")
  else
    alert("both are ok")

Situation is, If I enter something only in my "title" textbox, it should alert me that "author is null". Right? But surprisingly, it alerts me that "both are ok".. Expected? Or I missed something?

Solution

In jQuery, .val() won't return null for an empty field (except for a select element). Right now your coffee script evaluates to:

if (elem_book_title == null) {
  return alert("title is null");
} else if (elem_book_author == null) {
  return alert("author is null");
} else {
  return alert("both are ok");
}

So try removing the question marks

if not elem_book_title
  alert("title is null")
else if not elem_book_author
  alert("author is null")
else
  alert("both are ok")

This will produce the js I think you were expecting (which is testing for falsiness like an empty string, 0 or null):

if (!elem_book_title) {
  return alert("title is null");
} else if (!elem_book_author) {
  return alert("author is null");
} else {
  return alert("both are ok");
}

There is a question about the way coffeescript's existential operator (?) works here that you may find informative (thanks @raina77ow).

Comments

[Shomz]

Shouldn't you check for values and not the elements?

[Mox Shah]

what does it alert when you do alert(elem_book_title.val()) ?

[Rahul Bhargava]

@Shomz, Well. Yes, I tried that too.. Something like: elem_book_title = $("#title").val() elem_book_author = $("#author").val() alert(elem_book_title) alert(elem_book_author) Rest code is same. But of no use.

[Rahul Bhargava]

@MokshShah, It alerts the same.

[Rahul Bhargava]

Sorry for editing the post many times. I was not getting the code right.

[raina77ow]

jQuery constructor function always returns an object - that is a truthy value. You should rewrite your code so that the values of those inputs are checked.

[Rahul Bhargava]

@raina77ow.. Please see my above comment.. I have tried .val as well.

[raina77ow]

Ahem. It's not 'as well'. It's the only proper way to do it. It doesn't guarantee that the rest of your code doesn't have an error, yes. But if you don't fix 'using the objects in checks' error, it's meaningless to advance further.

[Rahul Bhargava]

@raina77ow.. Ahem. I fixed that and it still alerts the same "both are ok". What now?

[raina77ow]

Could you show how your code looks like after the fix, editing the question accordingly?

[Rahul Bhargava]

@raina77ow.. I have edited the code in question itself. Please have a look.

[raina77ow]

Now the answer given by @jcuenod fits your question precisely. And any other visitor of this page won't have to check the comments to understand what's wrong. That was my point actually.

[Shomz]

It doesn't need null to be falsy.

[Rahul Bhargava]

Am I really supposed to check the length explicitly? I thought there must be something to avoid that.. I thought.

[jcuenod]

But look at what your coffeescript evaluates to: if (elem_book_title == null). If you remove the question marks then it will test falsiness... I've updated my answer.

[raina77ow]

You can point the OP to this question which quotes the documentation on ?, explaining why it's not needed here.

[mu is too short]

But an empty string is still falsey (as are null and undefined) in CoffeeScript so !elem_book_title sufficient.