Announcement

Collapse
No announcement yet.

Multi column table

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Multi column table

    I'm trying to write my very first plugin, it's very slow progress :-)

    I need to show multiple columns of data in a Status page, I think I need to use ListView but not sure how I go about using this in the build page section as this appears to use clsjquery.

    Does anyone have any examples or advice on how to do this?

    Thanks
    Simon

  • #2
    Originally posted by Simonk View Post
    I'm trying to write my very first plugin, it's very slow progress :-)

    I need to show multiple columns of data in a Status page, I think I need to use ListView but not sure how I go about using this in the build page section as this appears to use clsjquery.

    Does anyone have any examples or advice on how to do this?

    Thanks
    Simon
    I can't see ListView, I can only see jqListBox/jqListBoxEx in clsJQuery - you got a link? Any reason you can't use a HTML table? That's all I have ever done and just have a function to loop through the data and add columns/rows as appropriate. You can return anything from GetPagePlugin as long as it is HTML so you don't have to always restrict yourselves to the functions in clsJQuery.
    My Plugins:

    Pushover 3P | DoorBird 3P | Current Cost 3P | Velleman K8055 3P | LAMetric 3P | Garadget 3P | Hive 3P |
    Yeelight 3P | Nanoleaf 3P

    Comment


    • #3
      Originally posted by mrhappy View Post
      I can't see ListView, I can only see jqListBox/jqListBoxEx in clsJQuery - you got a link? Any reason you can't use a HTML table? That's all I have ever done and just have a function to loop through the data and add columns/rows as appropriate. You can return anything from GetPagePlugin as long as it is HTML so you don't have to always restrict yourselves to the functions in clsJQuery.
      I could see it either which is why I asked question!

      Have you got an example of how to put a HTML table together that I could take a look at. I don't do coding very often, google is normally my friend!

      Comment


      • #4
        There are no doubt some JQuery table functions out there but if you are not fussy then you can just do a HTML table. If you have seen my Current Cost plugin then it has a data table and this is the function that produces the months list of data, create a top row, run through the database adding rows at a time and then finish the table off. It's not awe inspiring code at the best of times but it works....

        Code:
            Private Function BuildTabMData() As String
        
                Try
        
                    Dim stb As New StringBuilder
        
                    OpenDB()
        
                    stb.Append("<table border='0' bordercolor='#FFFFFF' style='background-color:#FFFFFF' width='900' cellpadding='3' cellspacing='1' align='center'>")
                    stb.Append("<tr>")
                    stb.Append("<td class='tblCCHeader'>Sensor</td>")
                    stb.Append("<td class='tblCCHeader'>Date</td>")
                    stb.Append("<td class='tblCCHeader'>Usage (kW)</td>")
                    stb.Append("<td class='tblCCHeader'>Cost (" & plugin.currSymbol & ")</td>")
                    stb.Append("</tr>")
        
                    For j As Byte = 0 To 9
                        If plugin.dCode(j, 0) > 0 Then
        
                            SQLcommand.CommandText = "SELECT * FROM CCHistMonth" & j & " WHERE OuterXML BETWEEN 'm001' AND 'm024' ORDER BY OuterXML ASC"
                            Log("BuildTabMData Command Text: " & SQLcommand.CommandText, LogLevel.Debug)
        
                            stb.Append("<tr>")
                            stb.Append("<td colspan='4' class='tblCCHeader'>Sensor " & j & "</td>")
                            stb.Append("</tr>")
        
                            Dim SQLreader As SQLiteDataReader = SQLcommand.ExecuteReader()
                            Dim rowOdd As Boolean = False
                            Dim tdClass As String = Nothing
                            Dim HasRows As Boolean = False
        
                            '                    If SQLreader.HasRows Then
                            Do While SQLreader.Read
                                HasRows = True
                                stb.Append("<tr>")
                                If rowOdd = False Then
                                    rowOdd = True
                                    tdClass = "<td class='tblCCRowEven'>"
                                Else
                                    rowOdd = False
                                    tdClass = "<td class='tblCCRowOdd'>"
                                End If
                                stb.Append(tdClass & "Sensor " & j & "</td>")
                                stb.Append(tdClass & DateTime.Now.AddMonths(SQLreader(0).ToString.Replace("m", "") * -1).ToString("MMMM yyyy") & "</td>")
                                stb.Append(tdClass & Format(Convert.ToDecimal(SQLreader(1).ToString), "0.00") & "</td>")
                                stb.Append(tdClass & FormatCurrency(Convert.ToDecimal(SQLreader(1).ToString) * plugin.kwHCost, 2) & "</td>")
                                stb.Append("</tr>")
                            Loop
                            'Else
        
                            If HasRows = False Then
                                stb.Append("<tr>")
                                stb.Append("<td colspan='4' class='tblCCRowEven'>No Data For Sensor " & j & "</td>")
                                stb.Append("</tr>")
                            End If
                            'End If
        
                            SQLreader.Close()
        
        
                        End If
                    Next
        
                    CloseDB()
                    stb.Append("</table>")
                    Return stb.ToString
        
                Catch ex As Exception
                    Log("BuildTabMData() Exception: " & ex.Message, LogLevel.Debug)
                    Return "No Data In Database/Error - " & ex.Message
                End Try
        
            End Function
        My Plugins:

        Pushover 3P | DoorBird 3P | Current Cost 3P | Velleman K8055 3P | LAMetric 3P | Garadget 3P | Hive 3P |
        Yeelight 3P | Nanoleaf 3P

        Comment


        • #5
          Originally posted by mrhappy View Post
          There are no doubt some JQuery table functions out there but if you are not fussy then you can just do a HTML table. If you have seen my Current Cost plugin then it has a data table and this is the function that produces the months list of data, create a top row, run through the database adding rows at a time and then finish the table off. It's not awe inspiring code at the best of times but it works....
          Thanks for that, I've now got my data read from DB and listed.

          I've got a couple of other questions if you don't mind!

          Under one of my Tabs I have a list of items and a quantity. On that page I also have a Dropdown box populated with items, if on of these is selected it updates the quantity for one of the items in the list. The only bit with this that I can't get to work is how to refresh the list without pressing F5. I've tried calling the RebuildTab function but it doesn't appear to do anything.

          Also what does the line below do?
          If Rebuilding Then Me.divToUpdate.Add("TabDD_div", stb.ToString)

          Thanks
          Simon

          Comment


          • #6
            Originally posted by Simonk View Post
            Thanks for that, I've now got my data read from DB and listed.

            I've got a couple of other questions if you don't mind!

            Under one of my Tabs I have a list of items and a quantity. On that page I also have a Dropdown box populated with items, if on of these is selected it updates the quantity for one of the items in the list. The only bit with this that I can't get to work is how to refresh the list without pressing F5. I've tried calling the RebuildTab function but it doesn't appear to do anything.

            Also what does the line below do?
            If Rebuilding Then Me.divToUpdate.Add("TabDD_div", stb.ToString)

            Thanks
            Simon
            I guess you might be using a template or some such so I don't know exactly what is going on. If you have a box of data then put this inside a HTML Div using the DivStart/DivEnd. With your dropdown you then make sure that the page is submitted when the dropdown is manipulated (autoPostBack). Then in your PostBackProc when it posts back you should get data in here, you can re-read your database data and then update all of the table using the divToUpdate. That's how I understand it works anyway and I seem to use it...
            My Plugins:

            Pushover 3P | DoorBird 3P | Current Cost 3P | Velleman K8055 3P | LAMetric 3P | Garadget 3P | Hive 3P |
            Yeelight 3P | Nanoleaf 3P

            Comment


            • #7
              Originally posted by mrhappy View Post
              I guess you might be using a template or some such so I don't know exactly what is going on. If you have a box of data then put this inside a HTML Div using the DivStart/DivEnd. With your dropdown you then make sure that the page is submitted when the dropdown is manipulated (autoPostBack). Then in your PostBackProc when it posts back you should get data in here, you can re-read your database data and then update all of the table using the divToUpdate. That's how I understand it works anyway and I seem to use it...
              I should have said I'm using Moskus plugin samples as a starting point for creating my first plugin.
              As soon as I read you reply above I can see the issue with the actual line I posted, I neglected to change the value in the line I posted to the correct one for my page. Now refreshing on change :-)

              Thanks for your help

              Comment

              Working...
              X