javascript - Lightswitch HTML Client - set modal picker value when screen created

Question

ive done quite a bit of research into this now and non of the examples are helpful or apply. What I am trying to do is when the user loads the Add screen, I want the Details Picker to display a name when the screen is created rather than having to select it everytime. im sure this can be done but my javascript skills are lacking.

thanks for any help, and below is an example:

this name is stored within a table and can be searched for in this modal picker/details picker but as you can imagine, if this value is required 50% of the time then manually adding it is not only time consuming but would become a little tedious

a text box can be manipulated by using contentItem.value or element.innerText after pressing post render on each item, but this does not work with this type of control, and I am presented with the below error:

heres some useful information which may help:

• ProjectData (datasource)
• Main screen references OrderRequest
• foreign key link references ShippingContact and CustomerName is searched for on the DetailsPicker

based on the below answer do I need to substitute in anything to the top function, and then base don the 2nd part of code, where you have written defaultLookup(screen.Customer, "Contact", "Contacts", what needs to go here?

example of what im trying to change, and unfortunately this isn't working

var defaultValue = "Test User";
    var filter = "(ContactName eq " + msls._toODataString(defaultValue, ":String") + ")";
    defaultLookup(screen.OrderRequest, "ContactName", "ShippingContacts", { filter: filter });

Answer 1

Having had the same requirement we've implemented the following helper function: -

function defaultLookup (entity, destinationPropertyName, sourceCollectionName, options) {
    /// <summary>
    /// Defaults an entity's lookup property
    /// </summary>
    /// <param name="entity" type="Object">The entity featuring the lookup property to default</param>
    /// <param name="destinationPropertyName" type="String">The lookup property against the entity to default</param>
    /// <param name="sourceCollectionName" type="String">The collection from which to source the lookup value</param>
    /// <param name="options" type="PlainObject" optional="true">
    /// A set of key/value pairs used to select additional configuration options. All options are optional.
    /// <br/>- String filter: If supplied, defines the match condition for the required default, otherwise the lookup defaults to the first entry in the source collection
    /// </param>
    options = options || {}; // Force options to be an object
    var source = myapp.activeDataWorkspace.ApplicationData[sourceCollectionName]; // DataServiceQuery
    var query = {}; //DataServiceQuery
    if (options.filter) {
        query = source.filter(options.filter);
    } else {
        query = source.top(1);
    }
    query.execute().then(function (result) {
        entity[destinationPropertyName] = result.results[0];
    });
};

In your case, you'll need to change the ApplicationData to read ProjectData.

This can be called in your screen's created event as follows: -

myapp.AddEditCustomer.created = function (screen) {
    var defaultValue = "Chris Cook";
    var filter = "(Name eq " + msls._toODataString(defaultValue, ":String") + ")";
    defaultLookup(screen.Customer, "Contact", "Contacts", { filter: filter });
};

In your case, screen.Customer should be changed to screen.OrderRequest, "Contact" should be changed to "CustomerName" and "Contacts" should be changed to "ShippingContacts". Also, based on your lookup table having a field called ContactName, the filter string needs to reference ContactName rather than just name.

Alternatively, this helper can be called from your entity created events (in your UserCode script section) as follows: -

myapp.Customer.created = function (entity) {
    var defaultValue = "Chris Cook";
    var filter = "(Name eq " + msls._toODataString(defaultValue, ":String") + ")";
    defaultLookup(entity, "Contact", "Contacts", { filter: filter });
};

In my code example, the main table is called "Customers" and the lookup table is called "Contacts". The "Contact" field in the main table references an entry in the Contacts table. The Contacts table has a field called "Name" and a record with the name set to a value of "Chris Cook" (the defaultValue and filter variables refer to this situation).

The following image shows the screen.Customer property being debugged: -