Populating select values (id's with corresponding text) by using custom dialog

[szetodave]

Dear Artem,

I see that there is a long time since someone has asked for your help but I hope I'll get your answer. At first congratulations for your work and for this awesome grid. I am a beginner in php and javascript but in the past few months I could get further and further with jsgrid and could almost program a usable table administration tool!

Now I try to change the editing method using the example of "custom dialogs". I could insert and edit data with it but only with visualizing the id's from the main table (i.e. the data loaded with the loadData function at the beginning.

In my system's tables there are some id's as foreign keys, but I would like to populate their corresponding names in the custom popup dialog (and of course by editing and inserting their corresponding integer values back to the database...) Probably it is a really easy task for you but I couldn't go through it.

in the showDetailsDialog function I tried to use the already queried items (from the field options:
fields: [
{ name: "syst_name",
title: "System",
type: "text",
width: 20 },

        { name: "syst_customer_id", 
		title: "Customer", 
		type: "select", 
		width: 30,  
		items: customer, 
		valueField: "cust_id", 
		textField: "cust_name"
			  },
        { name: "syst_sla_id", 
		title: "SLA",
		type: "select", 
		width: 30, 
		items: sla, 
		valueField: "sla_id", 
		textField: "sla_name", 
		css: "dependent-select", 
		},
		
        { name: "syst_contact_id", 
		title: "Contact", 
		type: "select", 
		width: 30, 
		items: contact, 
		valueField: "cont_id", 
		textField: "cont_name", 
		},
		
        { name: "syst_snow_hostname", 
		type: "text", 
		title: "Snow1", 
		width: 50 },
		
		{ name: "syst_snow_companyname", 
		title: "Snow2", 
		type: "text", 
		width: 50 },
		
		{ name: "syst_snow_unique_id_prod", 
		title: "Snow3", 
		type: "text", 
		width: 50 },
		
		{ name: "syst_snow_unique_id_test", 
		title: "Snow4", 
		type: "text", 
		width: 50 },

but of course it didn't work.

var showDetailsDialog = function(dialogType, systemf) {
$("#syst_name").val(systemf.syst_name);
$("#syst_customer_id").val(customer.cust_name); ----> this is the queried id and name from the customer table
$("#syst_sla_id").val(systemf.syst_sla_id);
$("#syst_contact_id").val(systemf.syst_contact_id);
$("#syst_snow_hostname").val(systemf.syst_snow_hostname);
$("#syst_snow_companyname").val(systemf.syst_snow_companyname);
$("#syst_snow_unique_id_prod").val(systemf.syst_snow_unique_id_prod);
$("#syst_snow_unique_id_test").val(systemf.syst_snow_unique_id_test);

    formSubmitHandler = function() {
        saveSystems(systemf, dialogType === "Add");

So my question is, how can I reach the items array's values in the custom dialog window (sorry for this stupid question, I am a beginner as I mentioned)

Many thanks for your help and I wish you a good luck!

Regards,
David