change row background color Jquery

Question

I have called a webapi and I got json data

{
    "orderId": 26,
    "userId": "53cf1e15",
    "user": {
    "editablePropertyNames": [],
        "email": "rajesh@tech.com",
        "firstName": "Rajesh",
        "id": "53cf1e15",
        "identities": [],
        "lastName": "kumar",
        "missingProperties": [],
        "phoneNumber": "45877298"
},
    "locationId": 4024,
    "pickupType": 1,
    "pickupTimeUtc": "2015-11-27T17:33:00.417"
},
{
    "orderId": 601,
    "userId": "06bf5983",
    "user": {
    "editablePropertyNames": [],
        "email": "rtest@wa.com",
        "firstName": "Rakesh",
        "id": "06bf5983",
        "identities": [],
        "lastName": "Pkumar",
        "missingProperties": [],
},
    "locationId": 424,
    "pickupType": 1,
    "pickupTimeUtc": "2016-11-16T21:30:00",
    "total": 4.32,
    "tax": 0.83
}

var PickupMethodEnum = _enum({
    DineIn: 1, DriveThru: 2, TakeOut: 3
})

index.html

I have 5 columns

#imageIndicator        Name      PickupName   Total          scheduledTime
car.png               Kumar          1          4.32    2015-11-27T17:33:00.417

my problem is

1. I want to display value instead of "1" in pickupName column. ( DineIn: 1, DriveThru: 2, TakeOut: 3).

2. show image in #imageindicaor column if pickupName ="DriveThru" otherwise hide the image.

3. show scheduledTime in custom format

   1. if scheduledTime is current date then display as 12:15 pm.
   2. if scheduled time is tomorrow date the display as 8/10 - 7:00am.

4. if pickupName ="TakeOut" then change that` row background color to gray and then remove that row after 2 minutes.

Answer 1

I want to display value instead of "1" in pickupName column. ( DineIn: 1, DriveThru: 2, TakeOut: 3 ).

Object.keys( objectName )[ propertyIndex ]

will return the desired property's name

The rest of your issues can be resolved with conditional statements once you've obtained the JSON data. You haven't provided your attempt so there isn't much to work with.

Answer 2

Hi for first point you need to write your enum properly numbers:"String" because you are getting numbers from JSON .

//Global Object
var pickupNameEnum = {
    0: "DineIn",
    1: "DriveThru",
    2: "TakeOut"
};

Write a function as showRow(singleRowObject) in which while traversing your JSON

function showRow(singleRowObject){
var imageString="";
var hideImage=false;
var showString='';
var retutnObject={};
if(pickupNameEnum[singleRowObject.pickupType]!=undefiend){
showString='DineIn';
//DineIn
}else if(singleRowObject.pickupType==){
//DriveThru
showString='DriveThru';
imageString="<img src='abc.png' alt='img'></img>";
}else if(singleRowObject.pickupType==){
//TakeOut and change Color on basis of this flag
hideImage=true;
showString='TakeOut ';

}
retutnObject.hideImage=hideImage;
retutnObject.imageString=imageString;
retutnObject.showString=showString;
}

For date split dateString and refer to this question

For Removing Row change refer this