Can I change var in jQuery(JavaScript)?

Question

After an AJAX call, I get the JSON data like this:

{
  "detailPrice": {
    "server": {
      "amount": "8",
      "usedPrice": "10",
      "discountPrice": "-1",
      "totalPrice": "9"
    },
    "network": {
      "amount": "8",
      "usedPrice": "10",
      "discountPrice": "-1",
      "totalPrice": "9"
    },
    "storage": {
      "amount": "8",
      "usedPrice": "10",
      "discountPrice": "-1",
      "totalPrice": "9"
    },
    "loadBalancer": {
      "amount": "8",
      "usedPrice": "10",
      "discountPrice": "-1",
      "totalPrice": "9"
    },
    "others": {
      "amount": "8",
      "usedPrice": "10",
      "discountPrice": "-1",
      "totalPrice": "9"
    },
    "support": {
      "amount": "8",
      "usedPrice": "10",
      "discountPrice": "-1",
      "totalPrice": "9"
    },
    "totalPrice": {
      "totalUsedPrice": "8",
      "totalDiscountPrice": "-2",
      "missedPrice": "10",
      "tax": "9",
      "otherDiscount": "-1"
    }
  }
}

I have to append these data to the view, so I made a code like this:

var serverpriceHTML = "총 " + result.detailPrice.server.amount + "대<br/>";
serverpriceHTML += "이용요금 " + result.detailPrice.server.usedPrice + "원<br/>";
serverpriceHTML += "할인요금 " + result.detailPrice.server.discountPrice + "원<br/>";
var serverTotalPriceHTML = result.detailPrice.server.totalPrice + "원";
$("#server_price").html(serverpriceHTML);
$("#server_totalprice").html(serverTotalPriceHTML);

var networkpriceHTML = "총 " + result.detailPrice.network.amount + "대<br/>";
networkpriceHTML += "이용요금 " + result.detailPrice.network.usedPrice + "원<br/>";
networkpriceHTML += "할인요금 " + result.detailPrice.network.discountPrice + "원<br/>";
var networkTotalPriceHTML = result.detailPrice.network.totalPrice + "원";
$("#network_price").html(networkpriceHTML);
$("#network_totalprice").html(networkTotalPriceHTML);

As you can see, it has a lot of duplicated code, so I'm trying to make a private function about it.

The problem is:

result.detailPrice.server.amount

I have to change server to network, storage, loadbalancer and etc. to get the data, but I'm not sure how can I change this.

If I make like:

function makeHTML(price, totalPrice, name) {
  var test = "result.detailPrice" + name + ".amount";
  var serverpriceHTML = "총 " + test + "대<br/>";
  serverpriceHTML += "이용요금 " + result.detailPrice.server.usedPrice + "원<br/>";
  serverpriceHTML += "할인요금 " + result.detailPrice.server.discountPrice + "원<br/>";  
  var serverTotalPriceHTML = result.detailPrice.server.totalPrice + "원";

  $(price).html(serverpriceHTML);
  $(totalPrice).html(serverTotalPriceHTML);
}

This is just adding string test. Any good idea about this?

why dont u use for loop to iterate the JSON?

Shiv Kumar Ganesh
– Shiv Kumar Ganesh

2013-08-07 06:14:52 +00:00
Commented Aug 7, 2013 at 6:14 — Shiv Kumar Ganesh
– Shiv Kumar Ganesh, Commented Aug 7, 2013 at 6:14

Sushanth -- · Accepted Answer · 2013-08-07 06:19:38Z

3

Use [] notation to access values when you want to use string values.

Instead of

var test = "result.detailPrice" + name + ".amount";

try

var test = result.detailPrice[name].amount;

Dot notation does not work if , you want to replace a variable value.

Simple Example

var obj = {
       "ball" : "bat"
    };

var name = "ball";

// If you use dot notation

obj.name (Gives you undefined) (It will try to get the get the key = name) It won't replace the variable name

// [] Bracket notation

obj[name] (Gives you bat) It will replace the variable name and get the value

edited Aug 7, 2013 at 6:19

answered Aug 7, 2013 at 6:13

Sushanth --

55.8k9 gold badges70 silver badges109 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sushanth -- Over a year ago

Dot notation does not work if , you want to replace a variable value.

Sushanth -- Over a year ago

@user1765884.. Glad to have helped :) . Also check the example

Shiv Kumar Ganesh · Accepted Answer · 2013-08-07 06:28:04Z

You can specify the different variable values such as :-

//This will give you some private variables for following:-
var constants={
server=function(){return 0},
network=function(){return 1},
storage=function(){return 2},
loadBalancer=function(){return 3},
others=function(){return 4},
suport=function(){return 5},
totalPrice=function(){return 6}
}

Then you can take up the JSON in a variable like below:-

You can alter the JSON as follows:-

var jsonData= {
           "detailPrice":{
              {
                 "amount":"8",
                 "usedPrice":"10",
                 "discountPrice":"-1",
                 "totalPrice":"9"
              },
                {
                 "amount":"8",
                 "usedPrice":"10",
                 "discountPrice":"-1",
                 "totalPrice":"9"
              },
                {
                 "amount":"8",
                 "usedPrice":"10",
                 "discountPrice":"-1",
                 "totalPrice":"9"
              },
                {
                 "amount":"8",
                 "usedPrice":"10",
                 "discountPrice":"-1",
                 "totalPrice":"9"
              },
                {
                 "amount":"8",
                 "usedPrice":"10",
                 "discountPrice":"-1",
                 "totalPrice":"9"
              },
                {
                 "amount":"8",
                 "usedPrice":"10",
                 "discountPrice":"-1",
                 "totalPrice":"9"
              },
                {
                 "totalUsedPrice":"8",
                 "totalDiscountPrice":"-2",
                 "missedPrice":"10",
                 "tax":"9",
                "otherDiscount": "-1"
              }

           }
        }

and then call it anywhere as follows:-

jsonData.detailPrice[constant.server];//For Server Details
jsonData.detailPrice[constant.network];//For Network Details

And so on. Hope this sounds helpful.

Collectives™ on Stack Overflow

Can I change var in jQuery(JavaScript)?

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related