Createorder at runtime

[bbm]

Hi,

I have two UniContainerPanels with different components. The Layout of the Panel is column. Depending on the situation some of the components has to be switched from one Panel to the other.

How can I change the CreateOrder at runtime.

Best regards

[Sherzod]

15 hours ago, bbm said:

Depending on the situation some of the components has to be switched from one Panel to the other.

Hi,

Can you please explain in more detail?

[bbm]

Hi,

example:

Two UniContainerPanel (CP1and CP2). At the beginning 3 UniEdit (E1, E2, E3) are placed on the CP2. The order is E1, E2, E3.

When I switch the E2 to the CP1 and back the order is E1, E3, E2. 

What I need is the possibility to reorder the components on C2 as it is at the beginning (E1, E2, E3)

I hope my explanation is not too complicated

Best regards

[Sherzod]

This post may help you:

http://forums.unigui.com/index.php?/topic/13150-client-alignment-and-runtime-object-creation/&do=findComment&comment=70287

[bbm]

Hi,

thank you, but I don't want to create new components at runtime. I only want to be able to reorder the components at runtime.

Best regards

[Sherzod]

2 minutes ago, bbm said:

but I don't want to create new components at runtime.

Hi,

Yes I know, just wanted to say that you can use the approach that is used in the above solution.

[bbm]

Hi,

when I try to do that I get an Exception.

In my test application I have the following source:

procedure TMainForm.UniButton1Click(Sender: TObject);
begin
  E1.CreateOrder := 2;
  E1.JSInterface.JSConfig('creatorder', [E1.CreateOrder]);

  E2.CreateOrder := 3;
  E2.JSInterface.JSConfig('creatorder', [E2.CreateOrder]);

  E3.CreateOrder := 1;
  E3.JSInterface.JSConfig('creatorder', [E3.CreateOrder]);
end;

When I click the Button I get the following Exception:

Best regards

[bbm]

Hi,

I also had a typo (creatorder --> createorder),but I have still the same mistake

Best regards

[Sherzod]

17 hours ago, bbm said:

Depending on the situation some of the components has to be switched from one Panel to the other.

Hi, 

No, this is wrong, I'll try to show you, how to do it.

[bbm]

Hi,

do you have a solution for my problem in the test application? I only want to reorder the edit field at runtime.

I have no success when I change the CreateOrder value.

Excuse me, but I just don't understand the way as described in the link

Best regards.

[Sherzod]

24 minutes ago, bbm said:

do you have a solution for my problem

Try.

1. MainForm.Script:

function generateSortFn(props) {
    return function (a, b) {
        for (var i = 0; i < props.length; i++) {
            var prop = props[i];
            var name = prop.name;
            var reverse = prop.reverse;
            if (a[name] < b[name])
                return reverse ? 1 : -1;
            if (a[name] > b[name])
                return reverse ? -1 : 1;
        }
        return 0;
    };
};

2. UniContainerPanel1 (UniAlignmentClient, column, column=3)

    UniPanel1

    UniPanel2

    UniPanel3

3.

procedure TMainForm.UniFormCreate(Sender: TObject);
begin
  UniPanel1.JSInterface.JSAssign('_createorder', [0]);
  UniPanel2.JSInterface.JSAssign('_createorder', [1]);
  UniPanel3.JSInterface.JSAssign('_createorder', [2]);
end;

4. Usage:

procedure TMainForm.UniButton1Click(Sender: TObject);
begin
  UniPanel1.JSInterface.JSAssign('_createorder', [0]);
  UniPanel2.JSInterface.JSAssign('_createorder', [2]);
  UniPanel3.JSInterface.JSAssign('_createorder', [1]);

  with UniContainerPanel1.JSInterface do
  begin
    JSCode(#1'.items.items.sort(generateSortFn([{name: "_createorder", reverse: false}]));');
    JSCall('updateLayout', []);
  end;
end;

 

[bbm]

Hi,

thank you very much! No it works like it should. The only thing is the TabOrder. Can I do it in the same way?

Only for understanding: Is the JSCall('updateLayout', []); like a refresh?

Best regards

[Point]

hi @Sherzod, i use your function in derived form to rearrange control. but form can't be closed.

here a test case.

atestcase.7z

[Sherzod]

Hello @Point

I will try to check. 

[Point]

any news

[Sherzod]

22 hours ago, Point said:

any news

Sorry, I haven't been able to figure out the reason yet.

[Sherzod]

I will check more and let you know.

[Sherzod]

On 2/13/2023 at 12:06 PM, Point said:

any news

Solution, try:

1. UniFormCreate ->

procedure TUniForm2.UniFormCreate(Sender: TObject);
begin
  inherited;
  UniButton3.JSInterface.JSAssign('_createorder', [1]);
  UniContainerPanel2.JSInterface.JSAssign('_createorder', [2]);
  UniButton1.JSInterface.JSAssign('_createorder', [3]);
  UniButton2.JSInterface.JSAssign('_createorder', [4]);
end;

2. UniContainerPanel1.ClientEvents.ExtEvents ->

function boxready(sender, width, height, eOpts) 
{
    (function() {
        var arr = [];
        sender.items.items.forEach(function(item) {
            arr.push(item._createorder)
        });
        arr.sort();
        arr.reverse();

        arr.forEach(function(idx) {
            var _item = sender.items.items[sender.items.items.findIndex(p => p._createorder == idx)];
            sender.move(_item, 0)
        });
    })()
}

 

[Point]

work very well. thanks you very much