Child Lookup table with all records by default

[stephen21345]

When using the lookup tables to filter available selection items for parent to child fields...
By default a field will have all records shown if no filter is applied.
If you make it a child lookup of another field then all records are filtered until the parent has something selected.

Is there a way to have a child field that defaults to showing all records, and then filters only if the parent lookup field is selected?

I want to be able to use the GUI provided tools to create the parent to child lookup structures, but just blast all records into the child field.
I understand one way would be to do via client scripts and create a javascript array of all the records then blast it in in clientscripts at the page load.
However is there a way to do this inside server events?

Thanks
Stephen

[arbei]

You may replace the default "addoption" handler by your own, e.g. in Client Script

loadjs.ready("makerjs", () =>  $(document).off("addoption").on("addoption", function (e, args) { ... }));

Refer to the source code of ew.js, find "addoption" and modify the default handler as your own.

[stephen21345]

Thanks for the suggestion
I looked at the function in ew.js
And it seems that it takes one row at a time and returns a True or False on whether to add it.
However it doesn't seem that it runs for the rows in the Child Lookup field, only "Parent" Lookup fields during page load.

So i tried to hook changes to the parent lookup field through a jquery on change selector.
But it seems that while I try add the values, when I click the select2 there is nothing in it. I assume it is doing some check onclick or something and ensure there is nothing in there?

    $(document).on('change', 'input[name^="x_ParentField"]', function() {
        // Check which parent values are selected
        var checkedParentFieldValues = $('input[name^="x_ParentField"]:checked').map(function() {
            return this.value;
        }).get().join(',');
        // Fetch values for ChildField via custom API
        // Construct the API URL
        var apiUrl = ew.PATH_BASE + "api/get_ChildLookupFieldValues?ParentField=" + checkedParentFieldValues;

        // Fetch and update options for LookupField
        $.get(apiUrl, function(response) {
            var rows = response.data; // Make sure 'data' is the correct key that contains your options array
            // response is like { "data": [{ "lf": 1001, "df": "A1", "df2": "", "df3": "", "df4": "" },{ "lf": 1002, "df": "A2", "df2": "", "df3": "", "df4": "" }]}
            
            // try to ensure can clear select2 values if any
            $('#x_ChildField\\[\\]').select2({ allowClear: true });
            // Try to clear existing options (didn't clear)
            var $childField = $('#x_ChildField\\[\\]').empty();
            

            // Dynamically add new options from the response
            $.each(rows, function(index, row) {
                var newOption = new Option(row.df, row.lf, false, false); 
                $childField.append(newOption);
                // $("<option>", { value: row.lf, text: row.df }).appendTo("#x_ChildField\\[\\]"); // also tried #x_ChildField
            });

            // Notify Select2 (if applicable) of the update
            $childField.trigger('change');
        }).fail(function() {
            console.error("Failed to fetch data for LookupField.");
        });

But I could seem to get it to work in this fashion either.

So I tried turning off the lookup options and just use a select with multiple option checked, then tried populating it similar to the last example (with all the "use lookup table" unchecked for both "ParentField" and "ChildField"

And then just attempted to insert data via the chrome console...

$("<option>", { value: 1101, text: "My Value 1101" }).appendTo("#x_ChildField\\[\\]");

This minimal test worked but it was no longer a select2 dialog.
So ideally I could use the lookupTables but populate ChildField with all values on page load (and if all ParentField's are deselected). But I am still unclear how this can be achieved

[arbei]

stephen21345 wrote:

it doesn't seem that it runs for the rows in the Child Lookup field, only "Parent" Lookup fields during page load.

The "addoption" event should be fired by all selection lists including the children list in Dynamic Selection Lists. You may write something by console.log() and test.

[stephen21345]

I add console.log in like so into ew.js:
But while the childfield is populated as expected when I click on the parentfield checkboxes. I see nothing with name: ChildField in the console.log, only for the parent table, and only on page load...
The parentfield is using checkbox with a lookup table. The childfield a "select, multiple, with modal" lookup table

// Default "addoption" event (fired before adding new option to selection list)

  $document.on("addoption", function (e, args) {
    console.log(args);
    let row = args.data,
        // New row to be validated
    arp = args.parents; // Parent field values

    for (let i = 0, cnt = arp.length; i < cnt; i++) {
      // Iterate parent values
      let p = arp[i];
      if (!p.length) // Empty parent
        //continue; // Allow
        return args.valid = false; // Disallow

      let val = row["ff" + (i > 0 ? i + 1 : "")]; // Filter fields start from the 6th field

      if (!$__default.default.isUndefined(val) && !p.includes(String(val))) // Filter field value not in parent field values
        return args.valid = false; // Returns false if invalid
    }
  });

[arbei]

You are right. You may find the follows under createModalLookup() in ew.js:

data: lookup.generateRequest.bind(lookup),

The AjaxLookup.generateRequest() method will add parent field value to the request, so if you want to remove the parent field values (and get all options for child field), you can only customize the generateRequest() method manually.