Jump to content

MultiSelect/мультивыбор в виде списка ID+Name


x11

Recommended Posts

Хотелось бы дать возможность пользователю сделать мультивыбор. С помощью какой мобильной компоненты это можно реализовать?

Link to comment
Share on other sites

1 hour ago, x11 said:

Хотелось бы дать возможность пользователю сделать мультивыбор. С помощью какой мобильной компоненты это можно реализовать?

Я проанализирую.

Link to comment
Share on other sites

On 9/18/2020 at 4:21 PM, x11 said:

С помощью какой мобильной компоненты это можно реализовать?

Добрый день,

Вы можете попробовать использовать UnimSelect.

1. UnimSelect1.Picker = dptFloated

2. 

procedure TMainmForm.UnimFormCreate(Sender: TObject);
begin
  UnimSelect1.JSInterface.JSConfig('multiSelect', [True])
end;

 

  • Like 1
Link to comment
Share on other sites

Спасибо, очень надеюсь, разработчики добавят свойство multiSelect, чтобы его можно было использовать в Диспетчере свойств.

  • Upvote 1
Link to comment
Share on other sites

Ок, заполнить могу так

  while not qTypes.Eof do
  begin
    UnimSelect1.Items.AddObject(qTypesNAME.Value, pointer(qTypesID.Value));
    qTypes.Next;
  end;

а как теперь получить значения выделенных строк?

Как понять, что та или иная строка выделена?

Link to comment
Share on other sites

On 9/19/2020 at 5:28 PM, x11 said:

а как теперь получить значения выделенных строк?

 Как понять, что та или иная строка выделена?

Добрый день,

На данный момент, могу только привести примерное обходное решение, попробуйте.

1. 

procedure TMainmForm.UnimFormCreate(Sender: TObject);
begin
  with UnimSelect1.JSInterface do
  begin
    JSConfig('multiSelect', [True]);
    JSAddListener('change', 'function(me){ajaxRequest('+ Self.WebForm.JSName +', "selEvents", ["objName="+me.uname, "values="+me.getValue()])}');
  end;
end;

2. 

procedure TMainmForm.UnimFormAjaxEvent(Sender: TComponent; EventName: string;
  Params: TUniStrings);
begin
  if EventName = 'selEvents' then
  begin
    if FindComponent(Params.Values['objName'])<>nil then
    begin
      //(FindComponent(Params.Values['objName']) as TUnimSelect) 
      Переменная := Params.Values['values'];
    end;
  end;

end;

 

  • Like 1
Link to comment
Share on other sites

On 9/19/2020 at 2:50 PM, Sherzod said:

1. UnimSelect1.Picker = dptFloated

Со значением dptFloated удобно тем, что список большой, на пол экрана, галочки видны, но не хватает кнопки OK (Done) для закрытия/подтверждения.

Можно ее как-то добавить?

 

Кнопка Done есть у значения dptAuto, но в этом случае сам список неудобный: маленький (только 3 строки) и нет галочек.

Спасибо.

Link to comment
Share on other sites

3 minutes ago, x11 said:

но не хватает кнопки OK (Done) для закрытия/подтверждения.

Для закрытия, нужно проанализировать. Но, подтверждение работает "автоматически". 

Link to comment
Share on other sites

Just now, Sherzod said:

Но, подтверждение работает "автоматически". 

все равно это неудобно, пользователь тыркает в экран и попадает в какой-нибудь unimEdit и ему всплывает клавиатура... а она не должна всплывать...

Link to comment
Share on other sites

8 minutes ago, x11 said:

все равно это неудобно, пользователь тыркает в экран и попадает в какой-нибудь unimEdit и ему всплывает клавиатура... а она не должна всплывать...

Может, как-то так:

function afterCreate(sender)
{
    var done = new Ext.Button({
        text: 'Закрыть'
    });
    done.render(sender.getPicker());
}

 

Link to comment
Share on other sites

Если строк мало (5 и меньше), то кнопка Закрыть нормально видна.

Если строк много, то кнопка или вообще не видна, или чуть-чуть видна

 

Link to comment
Share on other sites

15 minutes ago, x11 said:

Если строк мало (5 и меньше), то кнопка Закрыть нормально видна.

Если строк много, то кнопка или вообще не видна, или чуть-чуть видна

function afterCreate(sender)
{
    var done = new Ext.Button({
        text: 'Закрыть',
        renderTo: sender.getPicker(),
        style: 'position: absolute; bottom: 0px; width: 100%;'
    });
    //done.render(sender.getPicker());
}

 

Link to comment
Share on other sites

On 9/19/2020 at 3:28 PM, x11 said:

Как понять, что та или иная строка выделена?

 

осталось еще немного: как понять в любой момент времени, какие строки выделены

заполняю названия + ID

 

while not qTypes.Eof do
  begin
    UnimSelect1.Items.AddObject(qTypesNAME.Value, pointer(qTypesID.Value));
    qTypes.Next;
  end;

как мне получить ID выбранных строк?

Link to comment
Share on other sites

1 hour ago, x11 said:

как мне получить ID выбранных строк?

1.

  with UnimSelect1 do
  begin
    Clear;
    // while not EOF do...
    JSInterface.JSCode(#1'.getStore().add({id: "1", val: "Значение1"});');
    JSInterface.JSCode(#1'.getStore().add({id: "2", val: "Значение2"});');
  end;

2.

function afterCreate(sender) {
    var done = new Ext.Button({
        text: 'Закрыть',
        renderTo: sender.getPicker(),
        style: 'position: absolute; bottom: 0px; width: 100%;'
    });

    sender.getSelIds = function(sender) {
        let Ids = "";
        if (sender.getSelection() == null) return "";
        sender.getSelection().forEach(function(item) {
            Ids += item.id + ","
        });
        return Ids.slice(0, -1);
    };
}

3. 

procedure TMainmForm.UnimFormAjaxEvent(Sender: TComponent; EventName: string;
  Params: TUniStrings);
begin
  if EventName = 'selEvents' then
  begin
    if FindComponent(Params.Values['objName'])<>nil then
      //(FindComponent(Params.Values['objName']) as TUnimSelect)
      Переменная := Params.Values['selIds'];
  end;

end;

 

  • Like 1
Link to comment
Share on other sites

4.

procedure TMainmForm.UnimFormCreate(Sender: TObject);
begin
  with UnimSelect1.JSInterface do
  begin
    JSConfig('multiSelect', [True]);
    JSAddListener('change', 'function(me){ajaxRequest('+ Self.WebForm.JSName +', "selEvents", ["objName="+me.uname, "values="+me.getValue(), "selIds="+me.getSelIds(me)])}');
  end;
end;

 

  • Like 1
Link to comment
Share on other sites

1 hour ago, Sherzod said:

procedure TMainmForm.UnimFormAjaxEvent(

 

получается, что я не могу прочитать в любой момент времени значения ID выбранных строк, а только когда пользователь их непосредственно выбирает?

Получается, нужно где-то отдельно держать какой-то глобальный массив и менять его в событии  UnimFormAjaxEvent?

Link to comment
Share on other sites

1 minute ago, x11 said:

Получается, нужно где-то отдельно держать какой-то глобальный массив и менять его в событии  UnimFormAjaxEvent?

Это решение является обходным, на данный момент...

  • Like 1
Link to comment
Share on other sites

Спасибо, вроде получилось.

 

Но вот еще мальнькая проблемка.

Я заполняю placeHolder,

FormControl.JSInterface.JSConfig('placeholder', [sText]);

но при выборе он все равно остается

Screenshot_1.jpg

Link to comment
Share on other sites

23 hours ago, x11 said:

Но вот еще мальнькая проблемка.

Я заполняю placeHolder,


FormControl.JSInterface.JSConfig('placeholder', [sText]);

но при выборе он все равно остается

procedure TMainmForm.UnimFormCreate(Sender: TObject);
begin
  with UnimSelect1.JSInterface do
  begin
    JSConfig('multiSelect', [True]);
    
    JSConfig('_placeHolder', ['Test']);
    JSAddListener('painted', 'function(me){if (me.getValue()) {me.setPlaceholder()} else {me.setPlaceholder(me._placeHolder)}}');
    
    JSAddListener('change', 'function(me){if (me.getValue()) {me.setPlaceholder()} else {me.setPlaceholder(me._placeHolder)} ajaxRequest('+ Self.WebForm.JSName +', "selEvents", ["objName="+me.uname, "values="+me.getValue(), "selIds="+me.getSelIds(me)])}');
  end;
end;

 

  • Like 1
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...