combine two selections to query database - javascript

I have a div which represents a category of items ...when I hover over the div a drop list of countries shows, then when the user selects a country....the items of that category of that country should be queried and retrieved from the database ...
Each category has it's own div(with the image inside). The countries are a list in a div.
I check some answers like this one ...but none fits for my case
Combine two html selections with jquery
My query should contain 2 fields ...when hover on Category need to pick its name , and country.
Trying a "form" didn't fit for this. Maybe JQuery or even React could handle this I hope...I've no clue in either one :)
Or maybe there is another approach!
P.S: I'm using spring boot 5, thyme leaf 3, Java and MySQL for DB.

Related

Getting row data on Interactive Report

Morning,
I'm currently using an Interactive Report on APEX that contains several columns, some of them being checkboxes that represent if a certain number is present in the table that is being used to fill the report.
For example, row 1 has a telephone number "99091021", row 2 a provider, and the following 5 rows are checkboxes that should represent branches in certain areas. If a checkbox is clicked, it means that this number is present in that area.
Now, I'd like to create a dynamic action that inserts that number into that table when I click the checkbox (and it becomes checked), and a delete for when it's also clicked (and becomes unchecked). Problem is, I don't know how to access the rest of the data in the row of the IR to use as a comparison for the delete and insert statements.
Say I try to click the Checkbox 3 on the row where the telephone number is "99091021". A dynamic function would get the data row, then a true action would compare the necessary data to perform either an insert or delete, depending on the state of the checkbox. That's the plan.
I've done something similar before, using localStorage, but it didn't quite work, because before I used it on an interactive grid. Is there a similar function for interactive reports?
Also, is there a way to check if a checkbox is checked or unchecked in a PL/SQL Code?
Here's the solution I found:
I had a select that got the necessary data for the Interactive Report, but because I kept getting an error of temporary data table being exceeded and always breaking the server, I had to change the checkbox query to something like this:
apex_item.checkbox (1, '1_'||a.pk, case when max(decode(b.nr,1,1,null)) is null then '' else 'CHECKED' end) as checkbox1
The '1_' part represents me selecting the first checkbox. With the value still there as the selection, I was able to do the following:
$s("P165_GET_PK",this.triggeringElement.value)
The result would basically be "1_PK_number". With this function I was able to get the value (a.pk) hidden in the checkbox to an Apex item, and then continue using it for my insert and delete statements. It's just a matter of separating the value in it with substring functions and so on.
Now I can delete or insert new data inside that table with a simple click.
I hope it helps in case someone tries doing something similar.

Display dynamic items on page after initial page load

I am using ASP.Net mvc to render my html view.
The view contains a dropdown list and a label
I load drop down list using a collection in my view model.
Lets say that the collection is called fruit
IList<Fruit> fruit
Fruit is defined as
FruitId
Name
FruitType
The dropdown list will display each Fruit name and have a value of FruitId
When I change the value of the drop down list I want to have the value of my label display FruitType.
I can think of a couple ways of doing this:
Write out Label tags for all values of FruitType. Give a css class to display the first one on load and add javascript to show/hide labels in the select onchange event
Provide json array of Fruit in the html somewhere (I would serialise the Fruit list on page load and put the resulting script on the page somewhere). I would add javascript to the onchnage event of the select to search the json and change the label value accordingly.
I have 2 questions:
Am I missing something obvious, could this be done in a better way?
If no 2 is a good idea, where should I put the json in the html so that the js can use it?
Another approach is that when you generate the dropdown list, include a data-attribute, say data-fruit-type where you store the FruitType, then when the dropdown value changes, just read the data-fruit-type attribute from the selected item.

Is it possible to share a single underlying data array with multiple selectized elements?

I have a form consisting of multiple rows, each representing an order item. The first field of each row is a selectized select element representing the Id of the item. When the user types something in this selectized element I use ajax search to search and fetch a bunch of items according to the string that the user typed. The problem is I want the options that have been fetched in any element to be shared and immediately visible at the others. Any ideas?

Building a searchable/filtering database?

I am building a searchable database that will be able to be filtered by JS using classes.
When I write my items to put into my mysql database, will I be able to assign classes, or 'tags' to an item so I can for example, hide all items with out this 1 tag/class?
I have made a few that work offline with the items just using divs in HTML but will need to this to be dynamic.
$SQL = "INSERT INTO tb_products (Type, Size, Material, Price) VALUES ('Toy', '15inch', 'Glass', '50')";
Is this the correct syntax for me to later come in and use JS to 'show' only toys that are made of glass? or other types of filtering?
If you wish to be able to filter items based on their defined attributes only then you should not use tags. Simple SQL queries will do in this case. If you want items to be filtered based on non-attribute values then you can use tags(like transparent for glass items)

3rd dynamic dropdownlist value compare with 4th table value from botton -> show div?

Honestly been looking everywhere..
The traditional 3-dropdown list dynamically populated from database:
1st table gives airport departure
2nd table gives airports choices
from 1st choice
3rd table show routes between 1 and 2.
That works perfectly!!
When passenger chooses a route from the 3rd drop list I want to check if the value from 3rd dropdownlist is represented in a 4th table called "donations"
Some routes are marked for donation possibility where passengers can donate their unused baggagecapacity to charity
My last hurdle is:
when 3rd list is selected --> check for donationpossibilities--> if possible then show a hidden div on submit
...
I've tried and read so much and gotten a lot more clever and I think I have the query to check the values in order, but I'm lost...
Not sure what programming language you are using to load the dropdowns from your database, but one option that you could try is that when you are adding the html option elements to the 3rd dropdown list you could add a data attribute to each, for example:
<option value="route 1" data-can-donate="true">...</option>
Then if you are using jquery you could bind the change event to the 3rd dropdown and do something like this:
$('#ddlRoutes').change(function() {
var canDonate = $('#ddlRoutes > option:selected').data('can-donate');
if (canDonate) {
$('#myDiv').show();
}
};
Obviously this is untested but it may work for what you are trying to do.

Categories

Resources