Rendering Database Data on HTML

I need some help getting how to grab data from a database and show it on a webpage. Can you break down the steps, methods, and best ways to do this?
I am trying to create a webpage, where users can upload "events" and those events will be saved to a database and then it will also be displayed for all the other users.

Thanks a bunch for your time and help!
(Sorry about putting this is in general discussion there is no webdev category, and idk where else it belongs)

You can do that quite easily in Perspective. Do you have a licence for that module?

2 Likes

I made a topic tag for webdev. This does belong in the Ignition category.

1 Like

but I don't want to use perspective, I want to make use of the webdev module, is there any way i can do that?

Oh my bad

Yes, but completely hand-driven.

How does it work

No worries, only L4 members (and admins) can add topic tags.

1 Like

You write python that generates all the html, css, and javascript needed by your web page. Per GET call. Requires extreme knowledge of programming as well as html, css, and javascript.

Perspective exists to allow non-programmers a way to produce pretty pages with live machinery data.

1 Like

Do you have the WebDev module? If not, are you just using the Ignition platform to gather data from devices and/or easier database communication?

If the requirements are what you posted (i.e. not use Perspective), then you may as well create a Flask/Node/ASP.NET/etc app to do this. I guess I'm confused what exactly you're wanting and how...

Sorry for not replying, I actually did that in the webdev and it works so thank youu!

I have the webdev module, I am solely using ignition cause my coworkers want me to, other than that there's no merit to it (they want to put all the projects in one single place i.e ignition).

I didn't create a flask/react app cause it makes it more complicated for the people who are going to manage it after I leave, they don't have much experience with apps (I am a coop student), and all the functionality I want can be achieved in simple html, css, js and some python.

So you ended up choosing full webdev afterall?

Idk how your employers will manage that when you leave since they dont seem to have knowledge about it, but ahwell. If they aggreed to it and you already seem to plan to leave it is their problem xd

I did make a small page in perspective, didn't like it and then proceeded with webdev, and I am learning ignition perspective on the side as well.

As for my employers they have experience with basic html, css and js, what they don't have experience in is flask/react app.

1 Like

If you can use Perspective for this and you don't, those people stuck managing it will hate you and your odds of permanent hire or positive recommendations are zero.

Use WebDev for tasks you cannot achieve in Perspective. Really.

Using Perspective for simple display of database content is a five minute task. You should use your coop position as an opportunity to learn.

1 Like

Hate is a pretty strong word and I don't think they are going to hate me.

So here's the full picture, I am working on 3 projects in 4 months, 2 of them I was assigned, one i picked up cause I thought it would be interesting to learn. I am redesigning an original intranet website which was made in c++ back in the 90's, and it's extremely slow. So for my first project they just want me to redesign it and change the platform its running on. (this is a 2 month project edit: 2 month is not like a solid line for me set by my manager, its something i set on my own so I can give other projects time as well) and I discussed with my manager that I cannot learn perspective and deliver a nice website with a good design in 2 months, and he said its okay to do it in whatever I am comfortable in. Nevertheless I am still learning ignition cause as you said I want to learn as well.

For my 2nd project, I am using WordPress to design a template for a website that's going to be used in the company's main website to idk advertise stuff, and that template would be used in other branches of the company as well (I have a template to start from so I don't think is going to be difficult). Just giving it a facelift and make it look nicer.

For the 3rd project which I picked up on my own, I found a raspberry pi and thought it would be cool to make some kind of iot device with it, and I found out we have a 3d printer sooo I am 3d printing bb8 from star wars and doing some OpenCV stuff with it. I did a project with OpenCV where I used a model to do facial recognition I am gonna do something similar with it, and then use Llama (a friend recommended) to make it possible to have a conversation with the bb8. It doesn't really matter if I finish this one but I would definitely would love to do it.

1 Like

Fair enough.

1 Like

11k vs 2k in licensing costs for simple data reporting and charting.
WebDev makes sense for reporting/charting

For any kind of control I would go vision then perspective.

You can do a lot with webDev and gateway scripts to read write data base including Ignition historical data. Once you have data in the HTML page using webDev you can use a lot of widgets to display it in any format!

Ok, thank you for explaining that!

You can definitely build what you're describing using the WebDev module. If you want to serve up static pages, just right click on the WebDev module, click New Text Resource and then name your file (e.g. index.html). Add some HTML and then save your project. To launch your resource, click on the file you just created in the Web Dev section of your designer, then go to Tools -> Launch WebDev -> Launch Resource.
image

On the other hand, if you wish to display dynamic content from a database in your HTML content, the best way I found to do this is to create a new Web Dev resource (right-click), then select the New Python Resource option. Name your resource something that makes sense. Then use Python to build your dynamic data, create HTML from that, then serve it up just like the Text Resource (Tools -> Launch WebDev -> Launch Resource)

Example code:

def doGet(request, session):
	# untested code from memory!
	ds = system.db.runNamedQuery("Asset/GetAssets")
	
	body = ""
	for item in len(ds.getRowCount()):
		body.append("<p>{}: {}</p>".format(ds.getValueAt(item, "AssetID"), ds.getValueAt(item, "Name")))
	
	html = """
	<html>
		<body>
			<h1 style="color: aliceblue;">Asset list</h1>
			""" + body + """
		<body>
	</html>
	"""
	return {'html': html}
3 Likes