Web Development

var displayStock = formatStock(stock);

$row = $(rowTemplate.supplant(displayStock));

var displayStock = formatStock(stock),
    $row = $(rowTemplate.supplant(displayStock));

var ticker = $.connection.stockTickerMini; // the generated client-side hub proxy
var up = '▲';
var down = '▼';
var $stockTable = $('#stockTable');
var $stockTableBody = $stockTable.find('tbody');
var rowTemplate = '<tr data-symbol="{Symbol}"><td>{Symbol}</td><td>{Price}</td><td>{DayOpen}</td><td>{Direction} {Change}</td><td>{PercentChange}</td></tr>';

$(function(){
    var foo = 42;
    
    function bar(){
        alert(foo); // 42
    }
    
    bar();
    
    (function(){
        alert(foo); // 42
    })();
    
    $("form").on("submit", function(){
        alert(foo); // 42
    });
    
    alert(foo); // 42
});

alert(foo); // undefined

function formatStock(stock) {
    return $.extend(stock, {
        Price: stock.Price.toFixed(2),
        PercentChange: (stock.PercentChange * 100).toFixed(2) + '%',
        Direction: stock.Change === 0 ? '' : stock.Change >= 0 ? up : down
    });
}

function formatStock(stock) {

    stock.Price: stock.Price.toFixed(2);
    stock.PercentChange: (stock.PercentChange * 100).toFixed(2) + '%';
    stock.Direction: stock.Change === 0 ? '' : stock.Change >= 0 ? up : down;

    return stock;
}

grid.Column(columnName: "RowId", header: "Row Id", format: @<text><span data-row-id="@item.RowId">@item.RowId</span></text>),

var $row = $(".webgrid-table").find("span[data-row-id='" + model.RowId + "']").closest("tr");
if ($row.length){
    // The row exists:
    $row.find("td").eq(1).text(model.SiteId);
    ...
}
else {
    // The row does not exist:
    $row = createNewRow(model);
    $(".webgrid-table > tbody").append($row);
}

Richard Deeming wrote:

$row.find("td").eq(1).text(model.SiteId);

$row.find("td")

.eq(1)

.text(model.SiteId)

grid.Column(columnName: "RowId", header: "Row Id",              format: @<text><span data-row-id="@item.RowId">@item.RowId</span></text>),
grid.Column(columnName: "SiteId", header: "Site Id",            format: @<text>@item.SiteId</text>),
grid.Column(columnName: "Instrument", header: "Instrument",     format: @<text>@item.InstrumentId</text> ),
grid.Column(columnName: "TowerLocation", header: "Tower",       format: @<text>@item.TowerLocation</text>),
grid.Column(columnName: "BayLocation", header: "Bay Location",  format: @<text>@item.BayLocation</text>),
grid.Column(columnName: "BaySerialNo", header: "Bay Serial #",  format: @<text>@item.BaySerialNo</text>),
grid.Column(columnName: "BayStatus", header: "Bay Status",      format: @<text>@item.BayStatus</text>),
grid.Column(columnName: "AccessionId", header: "Accession ID",  format: @<text>@item.AccessionId</text>),
grid.Column(columnName: "Result", header: "Result",             format: @<text>@item.Result</text>),
grid.Column(columnName: "AssayName", header: "Assay Name",      format: @<text>@item.AssayName</text>),
grid.Column(columnName: "TestStarted", header: "Started",       format: @<text>@item.Started</text>),
grid.Column(columnName: "TestCompleted", header: "Completed",   format: @<text>@item.Completed</text>),
grid.Column(columnName: "TestSummary", header: "Test Summary",  format: @<text>@item.TestSummary</text> )

// Find the row who's Id matches the model's RowId
var $row = $(".webgrid-table").find("span[data-row-id='" + model.RowId + "']").closest("tr");

// If the row was found...
if ($row.length) {

    // Update the row
    var col01 = $row.find(".x-SiteId").text(model.SiteId);
    var col02 = $row.find(".x-InstrumentId").text(model.InstrumentId);
    var col03 = $row.find(".x-TowerLocation").text(model.TowerLocation);
    var col04 = $row.find(".x-BayLocation").text(model.BayLocation);
    var col05 = $row.find(".x-BaySerialNo").text(model.BaySerialNo);
    var col06 = $row.find(".x-BayStatus").text(model.BayStatus);
    var col07 = $row.find(".x-AccessionId").text(model.AccessionId);
    var col08 = $row.find(".x-Result").text(model.Result);
    var col09 = $row.find(".x-AssayName").text(model.AssayName);
    var col10 = $row.find(".x-Started").text(model.Started);
    var col11 = $row.find(".x-Completed").text(model.Completed);
    var col12 = $row.find(".x-TestSummary").text(model.TestSummary);

}
else {

    // The row does not exist, so add it to the table

    // Make a copy of the first row
    var table = document.getElementById('divData');
    var new_row = table.rows[0].cloneNode(true);
    var len = table.rows.length;
    new_row.cells[0].innerHTML = len;

    // Copy the model's data to the new row
    new_row.cells[1].value = mode.SiteId;
    new_row.cells[2].value = mode.InstrumentId;
    new_row.cells[3].value = mode.TowerLocation;
    new_row.cells[4].value = mode.BayLocation;
    new_row.cells[5].value = mode.BaySerialNo;
    new_row.cells[6].value = mode.BayStatus;
    new_row.cells[7].value = mode.AccessionId;
    new_row.cells[8].value = mode.Result;
    new_row.cells[9].value = mode.AssayName;
    new_row.cells[10].value = mode.Started;
    new_row.cells[11].value = mode.Completed;
    new_row.cells[12].value = mode.TestSummary;

    // Add the new row to the table
    table.appendChild(new_row);
}