How to create a jstree tree dynamical from a mysql database using python - jstree

I want to display the a tree format in html. Im using the following script in my html to show a jstree structure:
<div id="container"></div>
<script>
$(function() {
$('#container').jstree({
'core' : {
'data' : {
"url" : "getBOMH",
"dataType" : "json"
}
}
});
});
</script>
The getBOMH is a python method that connects to a mysql database using a stored procedure to pull the tree data. The mysql database table has a bunch of columns including "material_id", "material_name", "parent_id".
The relationship between the materials is captured by the parent_id column which stores the material_id of the parent of each material.
Im extracting the data from the database using the following python code:
#app.route('/getBOMH')
def getBOMH():
con = mysql.connect()
cursor = con.cursor()
cursor.callproc('sp_getBOMByUser',(_user,))
boms = cursor.fetchall()
Im trying to figure out a way to parse the results, and then send them to the jstree script such that it can understand the parent-child relationship of the data. Note that the data in the table is dynamic and can be changed by the user to different products with different components. So need to parse the information based on the parent_id column that determines the parent of each material.
Any ideas or tips on how to do this or where I should go for information.
Thanks

Related

Update a table via a Form with Data from Inputs on the Form and from another table

being new to coding I have run into a wall. I am attempting to update a table "Data_Tbl" from a Form "Form1" with inputs, and a value from a second table "Temp_Tbl" (Which contains predetermined temperature data) based on a Temperature keyed into a field on the Form. My "Temp_Tbl" has 2 fields "Temp" and "TDS" while the "Data_Tbl" has 3 fields to gather data from the form and "Temp_Tbl", "Serial", "Temp" and "TDS". I would like to populate the "TDS in the "Data_Tbl" from the "Temp_Tbl" based on the "Temp" keyed into the "Form1" and send it to the table "Data_Tbl" I have attempted to use the answers put forth in this site but to no avail. All I get are errors with the code. I am slightly familiar with VBA. Any help would be appreciated. I have tried so many things, I don't know what to put as an example.

How to update rows / set row data in server side row model type in ag grid?

My data model looks like this. Array of objects containing title and created_date.
{
title : String
created_date: Date
}
I have defined a column definition which only renders the title. However, I'd like to sort the rows based on the created_date, without creating a created_date column. There will be an external button detached from the table, which will call the api to get the data. I am using row model type serverSide. I have the sorted data from the backend. I just need to update the data / refresh the data. How can I achieve this ? I have so far tried setRowData(updatedRows). but its giving me an error saying cannot call setRowData unless using normal row model. Is there any way to update my rows in this serverSide row model type settings ?
Calling this.gridApi.setServerSideDatasource(myDataSource); and passing in your dataSource will do the trick. Check here for details

Vuejs table with dynamic columns connectted to flask API

I am building a web application using Flask, SQLAlchemy and Vuejs. I have built an API to pass data from my database to be displayed in a table, built as a Vuejs component. I want my table component to be as generic as possible so I reuse it in different places.
For my first attempt, my API returns data as follows:
data = [
{
firstName: ‘Joe’,
lastName: ‘Bradley’,
email: ‘joe#company.com
},
{
firstName: ‘Mary’,
lastName: ‘Kelly’,
email: ‘mary#company.com
},
{etc....}
]
Right now my Vue table component has column headings hard coded in but, I want the table component to be able to dynamically change the number of columns based on what data it receives. I don’t want the headings to be hard coded. I might have a different table that displays 4 totally different columns of data. How should I set the column headings in the Vue component?
Some ideas I had:
Include a list of columns headings in the API response so that the
table know what headings to use?
Make a separate API end point that returns a mapping of column
headings to database field names.
Just hard code the headings into the Vue table and define a new table
component for each time I want to display a different data set.
Can anybody offer any best practise advice for a situation like this? I’m self taught and pretty new to this as you have probably gathered from the question. Thanks in advance!

Meteor tabular tables - multiple tables showing same data

I'm using multiple tabular-tables in Meteor to display sets of partitioned data on the same page. Each occurrence of the tabular appears in a separate template instance, but they all refer to the same table. I have a template that looks as follows:
<template name="parentTemplate">
....
{{#each folders}}
{{> childTemplate}}
{{/each}}
....
</template>
<template name="childTemplate">
{{> tabular table=Table class="..." selector=selector}}
</template>
folders returns a set of partitions for the data, selector just returns {folderId: _id}
My Tabular.Table constructor is pretty simple, the only thing of note is:
changeSelector(selector, userId){
const ret = _.extend(selector, {status: "active"});
console.log(JSON.stringify(ret));
return ret;
}
the console.log part returns what I would expect, for each table a different folderId. When I put the logged selector into mongodb, I get the expected partition for each table, however each table shows me the same set of data as the first table. Additionally, when I click "next page" all the tables update to show the partition that should be displayed in the final table. I've checked that all the tabular table elements in the HTML have unique Id's.
Am I just using tabular-tables incorrectly?
EDIT:
After some tinkering, I found a potential solution, but it isn't clean, so I'd still like to hear people's thoughts. What I did was declare a meteor method as follows:
Meteor.methods({Table: function(){return new BlahTable(...);})
This is executed on the client and server, creating the relevant tabular table in both locations, then I use the newly created table in {{>tabular...}}

Input data into a table using DLookUp in Access

I am using a Data entry continuous form to input data into a table named 'Order_History'. All fields successfully input their data into that table except for one. I have a text box that uses DLookUp to get the value from a combo box on that form and use it to select data in hopes of entering it into the table. The DLookUp is getting the data from a different table named 'Postcodes'. I assume that the reason the others work is because the control source is linked to columns in the table.
Is there a way I can link this text box (Drop_Number) to the specific column in my Order_History table while still using DLookUp to get the values?
My DLookUp code:
=DLookup("Drop_Number", "Postcodes", "Postcode = [Forms]![Order_Form]![Postcode_cb]")