DataTable Component Properties Panel (What is the purpose of the 'Server Side" property?)

General
1

In the Properties Panel for the DataTable Component, what is the purpose of the Server Side property?

See the following property panel for the DataTable.

image
image770Ă—1012 56.1 KB

2

Hello Jeremy,

The Server Side field gives a name of the component that you have selected.
For example, in your case, you can name this datatable “items”.

Best regards.

3

Hello Jeremy

The Server Side property in the Properties Panel > Data Access Category provides server-side control over a component’s behavior. You can assign a server-side reference, like “myImage”, to an Image component. Then, by creating a class function like “hideItem”, you can manipulate the component’s behavior using the Server Side reference you assigned. This enables you to hide the component through a generic class function:

exposed Function hideItem(item : string) 
    var myComponent: 4D.WebFormItem
    myComponent = webForm[item]
    myComponent.hide()

You can use it by binding this class function to an event, like an onclick event on the image:

Screenshot 2023-09-21 at 15.23.49
Screenshot 2023-09-21 at 15.23.491020Ă—588 33.6 KB

Or by calling it from other functions in your application:

exposed function hideImageOnClick()
	ds.hideItem("myImage")

With the Server Side reference, you have precise control over the component’s actions, allowing you to perform tasks like hiding, showing, adding CSS classes, or removing CSS classes based on your specific application requirements.

Best regards,

3 Likes
4

then why not just call it the “name” of the component, a property i think other objects have?

5

Hello Mikey,

When it comes to using a server-side reference instead of directly calling the “name” of a component, it’s about achieving more precise control and avoiding ambiguity, especially in scenarios where components share the same name.

Consider a webform with a CheckBox, a Select Input, and a Range Input — each of these components is equipped with an embedded Label component.

Screenshot 2023-11-13 at 19.08.14
Screenshot 2023-11-13 at 19.08.14986Ă—466 33.1 KB

If you were to directly use the name property and set styles, like making the label text red for the CheckBox component, unintended consequences could arise. This approach would inadvertently impact the labels of the Select Input and Range Input as well.

By utilizing a server-side reference, you create a specific link between your code and the target component.

Best regards,

1 Like