Jump to content


Photo

New TUniCheckListBox component

TUniCheckListBox

  • Please log in to reply
30 replies to this topic

#21 MarBar77

MarBar77

    Active Member

  • uniGUI Subscriber
  • PipPipPip
  • 59 posts

Posted 14 March 2018 - 08:46 PM

Andrea do you have any suggestions how to get ItemIndex of clicked item (when no checkbox is cliked). I want to click on particular item text and want to know what is item index of this item. Actually in Onclick ItemIndex is always -1.

 


  • 0

#22 rgreat

rgreat

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 198 posts

Posted 22 March 2018 - 06:54 PM

Can someone adapt it to beta version?


  • 0

#23 arilotta

arilotta

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 105 posts
  • LocationTrieste, Italy

Posted 23 March 2018 - 07:24 AM

It is already functional, I use it in my projects.

Please see the attached zip,  it contains the package and the unit unit for the component and the image for the icon.

Just compile the package and install it.

 

Attached Files


  • 0

#24 rgreat

rgreat

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 198 posts

Posted 23 March 2018 - 04:57 PM

 When trying to click on checkbox:

Attached File  Clipboard02.jpg   33.69KB   2 downloads


  • 0

#25 rgreat

rgreat

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 198 posts

Posted 23 March 2018 - 04:59 PM

Btw: add "margin-left: 0px; margin-top: 0px;" to your style. Will look better.

 

procedure TUniCheckListBox.WebCreate;
var JSFunctionBody: string;
begin
  inherited;
  JSFunctionBody :=
  '  var me = sender,'+
  '      list = sender.boundList;'+
  ''+
  '  document._chSelect = function(cmp, indx) {'+
  '      ajaxRequest(cmp, "checkSelect", ["indx=" + (indx - 1)]);'+
  '  };'+
  ''+
  // Se si sceglie x-boundlist-item invece di "x-checklist-item" si ha il supporto per il trackover, i font, highligth dei selezionati, ecc.
  '  list.tpl.html = ''<ul class="x-list-plain"><tpl for="."><li role="option" unselectable="on" class="x-boundlist-item" style="cursor: default">'+
                      '<input id={[Ext.id()]} type="checkbox" style="vertical-align:middle; margin-left: 0px; margin-top: 0px; cursor: pointer; cursor: hand;" onclick="_chSelect('+self.JSName+',{#})" />{val}</li></tpl></ul>'';'+
  ''+
  '  list.addListener(''beforeitemclick'', function() {'+
  '      return false'+
  '  });'+
  ''+
  '  list.addListener(''beforecontainerclick'', function() {'+
  '      return false'+
  '  })';
  JSAddListener('beforerender',
      JSFunction('sender, eOpts',  JSFunctionBody)
  );
end;


  • 0

#26 rgreat

rgreat

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 198 posts

Posted 26 March 2018 - 06:58 PM

If you add items at design time it working.

 

But at runtime you get error: 

UniCheckListBox1.Items.Add('Test 1');
Failed to execute 'querySelectorAll' on 'Element': 'input[type=checkbox]:nth(1)' is not a valid selector.

O40.insert(0,{id:"0",val:"Test 1"});O3C.boundList.refresh();O3C.el.select("input[type=checkbox]:nth(1)").elements[0].disabled=0;_sfv_(O3C,0,"");

 

Project attached.

 

 

http://www.rgreat.ru...lphi/sgtest.exe- compiled file.

Attached Files


  • 0

#27 arilotta

arilotta

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 105 posts
  • LocationTrieste, Italy

Posted 27 March 2018 - 06:48 AM

rgreat, I've added the "margin-left: 0px; margin-top: 0px;", in fact it looks nicer.

If I understand correctly, you are trying to use the component with the Beta version, running on Ext JS 6.5.

Unfortunately, at the moment I've not installed that version, so I cannot help you.

Maybe someone else on the forum can help you to fix the issues....


  • 0

#28 rgreat

rgreat

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 198 posts

Posted 27 March 2018 - 12:22 PM

:(


  • 0

#29 rgreat

rgreat

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 198 posts

Posted 27 March 2018 - 03:33 PM

Fix for ExtJS 6.5.3:

 

Unichecklst.pas

procedure TUniCheckListBox.SynchronizeJSCheck(Index: integer);
var i: integer;
begin
  for i:=IfThen(Index=-1, 0, Index) to IfThen(Index=-1, Count-1, Index) do // nth(n) (1 based)
    JSInterface.JSCode(#1'.el.select("input[type=checkbox]").elements['+i.ToString+'].checked='+Selected[i].ToString.ToLower+';');
end;

procedure TUniCheckListBox.SetReadOnly(Value: Boolean);
var i: integer;
begin
  // Problem if Items set to design-time and ReadOnly set to TRUE, because it has not yet digested the WebCreate
  if Value<>FReadOnly then
    begin
      FReadOnly:=Value;
      if not (csDesigning in ComponentState) then
        for i:=0 to Count-1 do // nth(n) (1 based)
          JSInterface.JSCode(#1'.el.select("input[type=checkbox]").elements['+i.ToString+'].disabled='+FReadOnly.ToString.ToLower+';');
    end;
end;

I think it will work in old versions too.


  • 0

#30 arilotta

arilotta

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 105 posts
  • LocationTrieste, Italy

Posted 28 March 2018 - 07:50 AM

Great job rgreat, your solution is compatible with the current official release based on EXT JS 4.2.5, so I kept it.

For those interested, I attach the updated compenent source.

Attached Files


  • 0

#31 wilton_rad

wilton_rad

    Advanced Member

  • uniGUI Subscriber
  • PipPipPipPip
  • 126 posts

Posted 09 April 2018 - 02:54 PM

ola, estou usando seu componente, mas me deparei com um problema ao definir as propriedades selecionadas com a meta visível: = false, ele gera um erro. [/ size]

 

put a component, set visible :=false;

 

 

 

    for I := 0 to (cList.Items.Count - 1) do

    begin
                cList.Selected[I]:=True;
    end;

  • 0




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users