Web forum is in read-only mode. Login as active registered customer for write access
  Forum Search   New Posts New Posts

TWebResponsiveGrid

 Post Reply Post Reply
Author
Randall Ken View Drop Down
Senior Member
Senior Member
Avatar

Joined: 25 Oct 2014
Posts: 558
Post Options Post Options   Quote Randall Ken Quote  Post ReplyReply Direct Link To This Post Topic: TWebResponsiveGrid
    Posted: 22 May 2019 at 4:22pm
Hi,

How can I lod this from an array I have extracted from a respones? I am using:

jsO:=TJSONObject.ParseJsonValue(AResponse) as TJSonObject;
Res:=StrToInt(jsO.GetJsonValue('Result'));
if Res=200 then
begin
    jsObj:=jsO.ParseJsonValue(jsO.GetJsonValue('Body')) as TJsonObject;
//    jArr:=jsObj.GetValue('obligations') as TJSONArray;
    jsObj2:=jsObj.GetValue('obligations') as TJSONObject;
    gObligations.BeginUpdate;
    gObligations.Items.Clear;
    gObligations.LoadFromJSON(jsObj2.ToJSON);
    gObligations.EndUpdate;
  ...

I get nothing. I have tested that the array is populate>

Thanks,

Ken
Back to Top
Bruno Fierens View Drop Down
TMS Support
TMS Support
Avatar

Joined: 11 May 2010
Posts: 7701
Post Options Post Options   Quote Bruno Fierens Quote  Post ReplyReply Direct Link To This Post Posted: 22 May 2019 at 5:31pm
The method LoadFromJSON expects the URL of a JSON file, not the JSON.
This is demonstrated in the demo Basics\ResponsiveGrid.
To add items directly via code instead of loading from a JSON URI, you'd need to fill the ResponsiveGrid.Items collection
Back to Top
Randall Ken View Drop Down
Senior Member
Senior Member
Avatar

Joined: 25 Oct 2014
Posts: 558
Post Options Post Options   Quote Randall Ken Quote  Post ReplyReply Direct Link To This Post Posted: 22 May 2019 at 6:09pm
Ah, ok. Thanks, that's fine.
Back to Top
Randall Ken View Drop Down
Senior Member
Senior Member
Avatar

Joined: 25 Oct 2014
Posts: 558
Post Options Post Options   Quote Randall Ken Quote  Post ReplyReply Direct Link To This Post Posted: 22 May 2019 at 7:10pm
This causes an error when clicking on one of the items. It displays ok. Can you please check this out in the new version:

RItem:=gObligations.Items.Add;
RItem.HTML:='<table width="100%" border="0"><tbody>'+
        '<tr><td>Period Key: '+PeriodKey+'</td><td>Status: '+Status+'</td></tr>'+
        '<tr><td>Start: '+StartPeriodS+'</td><td>End: '+EndPeriodS+'</td></tr>'+
        '<tr><td>Due: '+DueS+'</td><td>Received: '+ReceivedS+'</td></tr>'+
        '</tbody></table>';
Back to Top
Randall Ken View Drop Down
Senior Member
Senior Member
Avatar

Joined: 25 Oct 2014
Posts: 558
Post Options Post Options   Quote Randall Ken Quote  Post ReplyReply Direct Link To This Post Posted: 23 May 2019 at 7:38am
Hi,

Trying to do this differently as I want the background color to be different according to it's status.

I have tried this by setting the individual items HTML as:

<div class="container text-white" style="background-color:orangered">
<div class="row">xxxxx</div>
</div>

This sort of works, see https://snag.gy/3Pj5Nv.jpg

Problem with this though is that selecting an item has no visible feedback and the item gap isn't correct.

Is there a better way to set the background color?

Thanks,

Ken
https://snag.gy/3Pj5Nv
Back to Top
Bruno Fierens View Drop Down
TMS Support
TMS Support
Avatar

Joined: 11 May 2010
Posts: 7701
Post Options Post Options   Quote Bruno Fierens Quote  Post ReplyReply Direct Link To This Post Posted: 23 May 2019 at 9:25am
I tested:


procedure TForm1.WebButton1Click(Sender: TObject);
var
  PeriodKey,Status,StartPeriodS, EndPeriodS, DueS, ReceivedS: string;
begin
  PeriodKey := 'a';
  Status := 'b';
  StartPeriodS := 'c';
  EndPeriodS := 'd';
  DueS := 'e';
  ReceivedS := 'f';

  WebResponsiveGrid1.BeginUpdate;
  WebResponsiveGrid1.Items.Add.HTML :='<table width="100%" border="0"><tbody>'+
        '<tr><td>Period Key: '+PeriodKey+'</td><td>Status: '+Status+'</td></tr>'+
        '<tr><td>Start: '+StartPeriodS+'</td><td>End: '+EndPeriodS+'</td></tr>'+
        '<tr><td>Due: '+DueS+'</td><td>Received: '+ReceivedS+'</td></tr>'+
        '</tbody></table>';


  WebResponsiveGrid1.EndUpdate;
end;

and I could not see a click problem with this.
Back to Top
Bruno Fierens View Drop Down
TMS Support
TMS Support
Avatar

Joined: 11 May 2010
Posts: 7701
Post Options Post Options   Quote Bruno Fierens Quote  Post ReplyReply Direct Link To This Post Posted: 23 May 2019 at 9:26am
You can make a CSS class with a different color setting for hover.

I cannot judge from this picture what could be wrong with gap.
Back to Top
Randall Ken View Drop Down
Senior Member
Senior Member
Avatar

Joined: 25 Oct 2014
Posts: 558
Post Options Post Options   Quote Randall Ken Quote  Post ReplyReply Direct Link To This Post Posted: 23 May 2019 at 9:39am
Setting the hover collor to cl yellow shows it like this https://snag.gy/mW5lEt.jpg

The problem is that the gap is set to 0.
Back to Top
 Post Reply Post Reply

Forum Jump Forum Permissions View Drop Down