Wednesday, July 31, 2013

In-line Conditionals

Sometimes it is nice to put a condition in line, without calling an external function or writing an in place if statement.

I am using Linq for entities, and I needed to assign different icons based upon database values.

I was able to use the code below:

select new LocationTree
                            {
                                Id = l.locationID,
                                Image = (true==l.LocationType.LocationHoldsInventory)?                                                    "Images/icons16px/plus.png":"Images/icons16px/redMinus.png",
                                ItemName = l.locationName,
                                HoldsInventory = l.LocationType.LocationHoldsInventory??false
                            };

This allowed me to use one image or the other depending upon the value of the LocationHoldInventory flag.

Tuesday, July 30, 2013

Iterating through a Kendo Grid

I put data into a Kendo grid, but then the user has the ability to sort it and edit it.  In one case, I put in a location search function that pops up a window.  When the window closes, the grid has to be updated.

Here is the function that I use to do the search and update:

function ahe_receiveNewLocation(itemType, itemId, itemName, locationId, locationName) {
    var myData = $("#ahe_inventoryHistoryTransactionsGrid").data("kendoGrid")._data;
    for (var i = 0; i < myData.length; i++) {
        var row = myData[i];
        if (row.id == window.activityHistoryInventoryTransactionId) {
            row.Location = "<a href='javascript:ahe_getNewLocation(" + row.Id + ", " + locationId
                         + ", \"" + locationName + "\")'>" + locationName + "</a>";
        }
    break;
    }
}
Note the red code above.  That datastructure points to the data for the rows currently displayed in the grid.  If the data you are interested in includes rows that are not currently displayed (paged out of sight), you have to use a slightly different data structure.  Instead, use data("kendoGrid").dataSource._data.  When using the Chrome object browser, be aware that it doesn't always show the underbar ( _ ) at the start of 'data'.  It just shows the word data, which is a function, not the array of records. 

The key item above is to get to the _data element.  That is an array that holds all of the data attributes.

In addition, if you set an id in your schema for the grid, the id element shows up there.

   var myDataSource =
        new kendo.data.DataSource({
            data: dataset,
            pageSize: 3,
            schema: {
                model: {
                    id: "InventoryTransactionId",
                    fields: {
                        InventoryTransactionId: {
                            editable: false,
                            nullable: true
                        },
                        Action: {
                            editable: false,
                            nullable: true
                        },
                        Item: {
                            editable: false,
                            nullable: true
                        },
                        UsageQuantity: {
                            editable: true,
                            nullable: false,
                            validation: {
                                required: true
                            }
                        },
                        UnitOfMeasure: {
                            editable: false,
                            nullable: true
                        },
                        UsageDescription: {
                            editable: false,
                            nullable: true
                        },
                        Run: {
                            editable: false,
                            nullable: true
                        },
                        TrackingNumber: {
                            editable: false,
                            nullable: true
                        },
                        TransactionDate: {
                            editable: false,
                            nullable: true
                        },
                        Location: {
                            editable: false,
                            nullable: true
                        }
                    }
                }
            }
        });


Finally, if you want your change to be displayed, you have to tell the grid to refresh itself.

        grid.refresh();

This will tell the grid to reload itself from it's data component.

(iactex.activityHistoryEdit.js)

Callbacks (Javascript)

Callbacks have always made me nervous.  Today, I needed to implement them (as opposed to use them) for the first time.  Turns out to be a piece of cake.

In my script, I declare my ultimate target function:

function ahe_receiveNewLocation(itemType, itemId, itemName, locationId, locationName) {
   // code goes here
}


My working function (the one that receives the callback request has a signature like this:

function ChooseTaxonomyItem_show(itemId, itemDescription, locationId, locationDescription, callbackFunction) {
    // code goes here



The original calling function has to call the working function, passing in the callback function as a variable:

ChooseTaxonomyItem_show(-1, '', locationId, locationDescription, ahe_receiveNewLocation);

Notice the fifth argument.  It looks like any other variable, but it is the name of the function to call.  In Javascript, functions are 'first class objects' like any other object, and may be passed around as such.

But: The working function has to know the arguments back to the original function.  This information is not passed with the function call.  The usage of the callback function looks like this:

callbackFunction(itemType, itemId, itemName, locationId, locationName);

Notice that callbackFunction is the name of the variable that received the call back function name above.

Nice, huh?

Why this blog?

I am developing in C#, using SQL Server, Visual Studio, Kendo, Javascript, Entity Framework, jQuery, CSS, HTML and a whole alphabet soup of other technologies.  The initial purpose of this blog is to list my problems, and record the solutions.  This will be a place that I can go back to for details of the solutions, and, just maybe, it will help someone else with a similar problem.