Results 1 to 5 of 5

Threaded View

  1. #1
    Power Member
    Join Date
    Sep 2013
    Location
    Coimbatore
    Posts
    121

    Comparing previous value with new value and changing color

    In LightStreamer Demo i have seen the stock list updating. It's working fine and updating with red and green color based on the rate increase / decrease.
    They used the bellow code,

    <td><div data-source="lightstreamer" data-field="last_price">-</div></td>
    var fieldsList = ["last_price", "time", "pct_change", "bid_quantity", "bid", "ask", "ask_quantity", "min", "max", "ref_price", "open_price", "stock_name", "item_status"];
    var lastPrice = info.getChangedFieldValue("last_price");
    if (lastPrice !== null) {
    var prevPrice = dynaGrid.getValue(key,"last_price");
    if (!prevPrice || lastPrice > prevPrice) {
    info.setAttribute(greenColor,cold,"backgroundColor ");
    } else {
    info.setAttribute(redColor,cold,"backgroundColor") ;
    }
    } else {
    info.setAttribute(greenColor,cold,"backgroundColor ");
    }

    You are using "last_price" in single field only. But updating for all the rows. How is it happening? Where you are doing this whether in this above code or creating data adapter in server.


    I'm using java script client as,
    <tr>
    <td class="rate-title"><div data-source="lightstreamer" data-grid="stocks" data-item="item1" data-field="stock_name">Loading...</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item1" data-field="buy_price">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item1" data-field="sell_price">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item1" data-field="ltp">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item1" data-field="net_change">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item1" data-field="tot_buyqty">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item1" data-field="tot_sellqty">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item1" data-field="open">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item1" data-field="high">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item1" data-field="low">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item1" data-field="close">-</div></td>
    </tr>
    <tr>
    <td class="rate-title"><div data-source="lightstreamer" data-grid="stocks" data-item="item2" data-field="stock_name">Loading...</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item2" data-field="buy_price">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item2" data-field="sell_price">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item2" data-field="ltp">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item2" data-field="net_change">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item2" data-field="tot_buyqty">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item2" data-field="tot_sellqty">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item2" data-field="open">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item2" data-field="high">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item2" data-field="low">-</div></td>
    <td class="rate"><div data-source="lightstreamer" data-grid="stocks" data-item="item2" data-field="close">-</div></td>
    </tr>

    .
    .
    .
    .

    I used following code to achieve this,
    grid.addListener({
    onVisualUpdate: function(key,info,domNode) {
    if (info == null) {
    //cleaning
    return;
    }
    var cold = (key.substring(4) % 2 == 1) ? "" : "";
    //info.setAttribute("yellow", cold, "backgroundColor");
    domNode.style.backgroundColor = cold;

    var lastPrice = info.getChangedFieldValue("buy_price");
    if (lastPrice !== null) {
    var prevPrice = grid.getValue(key,"buy_price");
    if (!prevPrice || lastPrice > prevPrice) {
    info.setAttribute(greenColor,cold,"backgroundColor ");
    } else {
    info.setAttribute(redColor,cold,"backgroundColor") ;
    }
    } else {
    info.setAttribute("#000000",cold,"backgroundColor" );
    }
    formatDecimalField(info, "buy_price");
    }
    });
    But it changing color for single field.
    How can i check each field value and update the background colors.
    Last edited by rvkvino; September 20th, 2013 at 10:34 AM.

 

 

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT +1. The time now is 03:28 PM.