I'm trying to have some if statements in a javascript ajax call and I feel like it should be possible, just maybe my syntax is wrong. I'm trying to create the schedule part below:

$.ajax({
                type    :  'POST',
                name    :  'Submitting Request',
                url     :   '/breadcrumbs/crumb',
                dataType: 'json',
                data    : {
                    parameters  : paramsObj,
                    schedule: {       paramsObj.isfirst   ? firstSched
                                    : paramsObj.issecond  ? secondSched
                                    : paramsObj.isthird   ? thirdSched
                              }
                          },
            success  : function(){},
            error   : function(jqXHR, status, error) {}
       });

I keep getting "Uncaught SyntaxError: Unexpected token ." around this block, specifically on the schedule line:

             data   : {
                parameters  : paramsObj,
                schedule: {       paramsObj.isfirst    ? firstSched
                                : paramsObj.issecond ? secondSched
                                : paramsObj.isthird ? thirdSched
                          }
                      },

for schedule in particular, this is what i'm trying to do with the ternary operators:

if( paramsObj.isfirst === true) { schedule = firstSched}
if( paramsObj.issecond === true){ schedule = secondSched}
if( paramsObj.isthird === true) { schedule = thirdSched}

Does anyone know what I'm doing wrong?

I'm trying to have some if statements in a javascript ajax call and I feel like it should be possible, just maybe my syntax is wrong. I'm trying to create the schedule part below:

$.ajax({
                type    :  'POST',
                name    :  'Submitting Request',
                url     :   '/breadcrumbs/crumb',
                dataType: 'json',
                data    : {
                    parameters  : paramsObj,
                    schedule: {       paramsObj.isfirst   ? firstSched
                                    : paramsObj.issecond  ? secondSched
                                    : paramsObj.isthird   ? thirdSched
                              }
                          },
            success  : function(){},
            error   : function(jqXHR, status, error) {}
       });

I keep getting "Uncaught SyntaxError: Unexpected token ." around this block, specifically on the schedule line:

             data   : {
                parameters  : paramsObj,
                schedule: {       paramsObj.isfirst    ? firstSched
                                : paramsObj.issecond ? secondSched
                                : paramsObj.isthird ? thirdSched
                          }
                      },

for schedule in particular, this is what i'm trying to do with the ternary operators:

if( paramsObj.isfirst === true) { schedule = firstSched}
if( paramsObj.issecond === true){ schedule = secondSched}
if( paramsObj.isthird === true) { schedule = thirdSched}

Does anyone know what I'm doing wrong?

• javascript
• jquery
• ajax
• ternary-operator

Share Improve this question Follow edited Jan 7, 2015 at 16:10 Todd 31.7k1111 gold badges9090 silver badges9292 bronze badges asked Jan 7, 2015 at 16:07 user2847749user2847749 36922 gold badges99 silver badges2828 bronze badges 6

• 1 the { } around the expression are not needed – Pointy Commented Jan 7, 2015 at 16:11
• 4 For the sake of your future self and your colleagues, don't do that! It's very difficult to read. – joews Commented Jan 7, 2015 at 16:11
• 2 Nested ternary operators are evil. Move the code out into a separate block, or even a function and use if/else or switch. – Quentin Commented Jan 7, 2015 at 16:12
• Remended reading: thedailywtf./articles/… – Álvaro González Commented Jan 7, 2015 at 16:12
• 1 I think the more readable route is to use an immediately-invoked function expression. See my answer for details. – Dave Commented Jan 7, 2015 at 16:20

 |  Show 1 more ment

2 Answers 2

Sorted by: Reset to default 6

Just the relevant field:

schedule: paramsObj.isfirst ? firstSched : 
    paramsObj.issecond ? secondSched :
    paramsObj.isthird ? thirdSched : undefined

Full call:

$.ajax({
    type: 'POST',
    name: 'Submitting Request',
    url: '/breadcrumbs/crumb',
    dataType: 'json',
    data: {
        parameters: paramsObj,
        schedule: paramsObj.isfirst ? firstSched : 
            paramsObj.issecond ? secondSched :
            paramsObj.isthird ? thirdSched : undefined,
        success: function(){},
        error: function(jqXHR, status, error) {}
   });

Note

As others have pointed out, chaining ternaries can be hard to read, which can lead to bugs and maintenance problems. I personally don't mind chaining them, as long as they are broken out per line, as shown, so that they are easy to follow...

Nested ternaries can be difficult to read. I'd suggest rewriting this as an Immediately-executed function expression (IIFE) to make it much more readable:

schedule: (function() {
    if (paramsObj.isfirst)
        return firstSched;
    else if (paramsObj.issecond)
        return secondSched;
    else if (paramsObj.isthird)
        return thirdSched;
    else
        return undefined;
})();