How to dynamically auto populate a input field uisng Nodejs and MySQL? - mysql

I have a field in my website where I want users to enter book names that they can checkout from the database. I want it so that when they start typing the names I want suggestions or drop down under the input box matching the name of the book they are typing.
Is it possible to achieve something like this? I have a books table in my MySQL database and I am using Nodejs as my backend. I have searched a lot online but did not find anything related to this online. Therefore, I decided to ask the question here.

You have to send AJAX request with type GET and send the typed character to the Backend.
and in backend you have to do query for ex :select * from book where name like %input%
Then you have to return the result as an array to the front-end.
Finally, in your front-end code you have to render the result array under the input.
Also, you can use any ready jquery plugin to do this task in front-end code.

The UI element is commonly called a "typeahead" or autocomplete.
Twitter release their frontend component as a jQuery plugin called typeahead.js. Most frontend frameworks will have an equivalent plugin or component.
The backend datasource for the books is up to you to implement.
For small datasets you can render the required book data within the page so it is directly accessible from your javascript.
For large datasets you will probably need to create a backend "book search" service in Nodejs. Typeahead libraries can send that user input to a URL via an AJAX request and the service returns the matching results, usually as a JSON object.
Code for geek example for your stack.

You can make a drop-down menu with book names and using ajax you can get value from the input and search in database and display data .
I suggest you to use mongo db as database.
You can find tutorials in w3 schools or
in malayalam https://www.youtube.com/c/Crossroadstalk

Related

Azure logic app allows only one language for captions translations. How to extend logic app to custom web page?

I have built an Azure logic app, that will output an VTT transcript file, once a video has been uploaded. Link to the API: https://api-portal.videoindexer.ai/docs/services/Operations/operations/Get-Video-Index. However, I am trying to find a way to let a user choose outside of the logic app, what language they want the captions to be translated in.
How can I build a simple web app/page that will allow a user to choose a language from a radio button with a list of languages and then loop that back to a logic app?
For example I want to build something like this and then wire it up to my logic app "Caption Language" field:
How can I create a HTML form and loop that inside my Azure Logic app? What is the efficient way of doing this?
There are 2 things:
How will the user select the item
How you will use it as a parameter in your logic App
For the 1st point, it's totally up to you: choose the technology you prefer, and go. The thing that you have to understand is how it is linked to the 2nd point.
What you could do for this 2nd point:
Add a custom payload to your Logic App HTTP Trigger content: you can define it by using a sample:
That will create the following schema:
Use this chosen language as an input in your Logic App query, and set this parameter in the field "Captions language", using "Enter custom value":
You must point to the value in your payload:
So when you call your logic app from your web page, ensure that when you submit your form, your make a POST to your logic app url and pass in the body a content which is
{ "lang": "yourSelectedLanguageCode" }

Flutter: rendering an UI from JSON and store / map data dynamic

I want to render a UI from a jSON string that has multiple layers.
The user should be able to enter data, which will then be stored and shared, without the overhead of the jSON Render Structure.
However, the assignment of the data must be possible.
The app renders a template from a multidimensional json string that can capture metrics (user inputs). The measured data are entered via text fields by the user.
There are different windows in the app, which are rendered from different json UI-render-files.
The stored algorithms in the windows at the Frontend differ.
The following should be possible:
All windows are created with different jSON strings (works with build_value now).
The user's input is saved. (Currently only works by saving the render json string with the data under a different name (with Package: Shared Preferences)).
The data entered by the user is copied from one window to the other window. (Data Binding / Data Mapping)
The data entered by the user will be sent to a backend.
I only have the idea to use id's in the render json, which allow a mapping.
Are there better solutions?
Saving the entered data is possible by saving the whole jSON - String with an other name.
The goal is to map the data.
It should also be possible for the user to insert another object for the measurement data acquisition at the client / device. The entered data must also be saved.
This sounds like a REST API. Then you would use a frontend framework like angular or react to take user input.
I could build this with a .net core web api with sql db as the backend. this would be a web service (REST API solution) on the backend of your solution.
Next I would integrate Swagger with dependency injection and add authentication.
now its time to create the front end that will use your tested Web Service.
you would have 1 side of your SPA POST new JSON to the Web service in a form.
you would have the other side GET the new record as a new tab with pagination or in a table with pagination.
This would be a good PoC for your idea and will let you learn the parts of the solutions architecture in your language of choice. the "design" would be the same no matter what language your choice.
backend web service can be done in a flask and with a MySQL DB. or with any other combo you have skills with.
the Frontend could be done in knockout.js, making it a little easier to learn than angular or react.
Please create new questions when you choose your software design. I would love to give answers for each:)
I would love to level up with you! ;)

IBM WATSON - Upload json file to create meaningful intents

My requirement is,
I have an exam schedule data for a class of students, And I want to create a Chat bot Teaching Assistant(TA) with this data source and to respond to the students, Example - Student asks, when is my next exam , Then TA has to respond the date time of his/her next exam.
So what is the recommended solution?
So my assumption is to upload the exam schedule as json document in a preferred format and take use accordingly.
Am I correct or not? If not, can you help me suggesting the best option to do this?
Note - Exam schedule is dynamic which can be updated by the admin whenever he wants.
I understand that you need to send the correct data, but, Watson Conversation will give you the possibility for built one awesome Assistant with his Natural Language power. And you need to add some custom codes for integrates APIs, get database data, use Webservices, etc. Watson in your application will be one endpoint, and you can do a lot of thins with code.
Example:
After create your chatbot, when you user asks about "When is my next exam" in the Child node, you'll create one ACTION VARIABLE for call another service with some custom code... and in your backend when you post some message, this value from this action variable will return in your response parameter, and you'll can doSomething(), like get the exam data. You can click in my link above for understand how these action variable and context variables work.
So, like you said, the data can update, what you can do so is use Webservices, if you Univeristy have some Web application, so in the function doSomething() you'll POST and use the webservice to return the correct exam data, and return for your user like my example here.
Example for Integrate some API using Conversation: Weather API.

Filter entries using form

I have an ExpressionEngine site that I'm building with Bootstrap. It's a site for volunteers to find projects to help with. On the home page I have a modal with a form for them to select when they're available and what categories of jobs they're looking for. Then they can click submit and it'll go to a new page with filtered entries.
I don't know if this is possible using the GET method or POST method on the form. I've figured out how to use the GET method and get a query string into my URL but I don't know how to use that data to filter my entries on the entries page. Or would using POST and JSON be a better option? I don't know really how to implement either so any help would be great.
Thanks a lot!
It depends on how the information you would like to show is stored.
If you are using MySQL (a common RDMS), or any other form of SQL Database for that matter, the most common way is to send your GET query string (for example) to your server, have a sever-side language (such as PHP) handle that request by accessing your database, and then echo the result. This can be done synchronously, or with AJAX.
For example, the flow of everything might look like this:
User selects an option (say, "Gardening Projects").
JavaScript converts the value of that input option to a query string and sends an HTTP request using the GET method.
The destination of this request is "filter.php" (for example).
"filter.php" access your database using an SQL query, which searches for any entries in your database, say, having a tag of "gardening".
"filter.php" echos a statement with those entries (or, better yet, returns a JSON object)
JavaScript then parses the resultant JSON object into the DOM, which displays as a bunch of links in a result area that your user can click on.
The question you have about how to handle this is very broad, so I would recommend simply doing some Google searches or looking around this site for resources that show you how to set up databases, access those databases with possibly PHP/SQL, and maybe even use AJAX to return those results, etc.
To get you started (these are in no particular order):
AJAX Tutorial
PHP - JSON encode
SQL tutorial
jQuery AJAX
I got it figured out with some help from #JoshBeam. It turns out that I was trying to make it way more complicated than it actually is. Rookie mistake. In the end I just ended up using method=get in my form and the setting the action as the page with the filtered entries. I then used php to echo the inputs into my EE channel:entries tag.
One thing I still haven't figured out is how to make it so that my query string will combine values for matching names. Currently I have checkboxes for days of the week, each with name="day" and different values for each day. If there are multiple checked, my query string becomes example.com/?day=sun&day=mon when I'd rather have it as example.com/?day=sun&mon. So if anyone has any tips on that, I'd welcome them! I also wonder if there's a way to add pipes between each value when I echo them in my EE tag so that I can have multiples - e.g. {exp:channel:entries category="1|2|3"}. But I have really yet to Google either of these questions so I'll do that.
Thanks!

How to create Liferay JSON web service for existing tables?

I am developing a mobile app which retrieves data from a Liferay-based portal. I am using JSON web services to access the data which works well for e.g. Blog Entries. How can I make a new web service for existing tables? Each tutorial I have found starts with the definition of a new entity (i.e. database table), but I don't need that. I just want to access existing data in such a way which is not provided by system ws, e.g. to filter web content which have a specific structure.
Note: I tried also a workaround, I managed to make a struts action which prints out the desired JSON data and returns null. When I enter the address for the action in a browser, I see the JSON string. But if I put it in my mobile app, I see an HTML code, it seems that it is redirected to the home page of the portal.
Neat trick if you don't want to define a new entity with servicebuilder: Just leave the entity empty, this defines just a type, but no fields, e.g. no underlying table. Then implement your methods by just delegating to whatever persistence you'd like to access (or even without any persistence).
<Entity name="Foo" local-service="true" remote-service="true">
</Entity>
This will create FooServiceImpl and FooLocalServiceImpl that you can use to implement your business logic, without any attached database table.