dropdown showing false values which are not even present in input array - html

Recently we've got one issue from customer that they have seen some random values in dropdown and after clearing browser cache, those values are gone and now its working perfectly fine.
I have used normal <select> <option> tags from html in angular and by using *ngfor I'm populating that data in dropdown.
NOTE: values are completely static and never changed in any code.
My question is, why some random values/strings were added automatically in that dropdown (which are not even present in input array). I know, it can very much happen in case of <input> tag (autocomplete) but dropdown case is completely new for me. can anyone explain this behavior please.
below marked 2 values which are not present in that static array.

Related

Cypress: mat-option element id keeps increasing unless test is completely refreshed

I just wondered if this was normal for cypress or not.
The options for the dropdown list (mat-option) are taken from another page in the website. These have fixed ids, so I'm not sure why the id is changing for the dropdown list. The website works as expected, there's no error there.
If it is to do with cypress, I'm fine. If not, then I have some work to do!
Thanks for any insight. I'm relatively new to cypress
I was expecting the options to remain static each time I tried to select an option.
mat-option-1
mat-option-2
mat-option-3
rather than:
mat-option-1
mat-option-2
mat-option-3
then:
mat-option-4
mat-option-5
mat-option-6 ...etc

Templates are rendered as editable to users

I started to work on this project which uses django volt dashboard.
The problem is I can edit all the data in the navbar, sidebar and tables.
This is the table present in the original template we have used
Current state
Morover, I can't nagivate to other sections as well. The mouse pointer becomes a I-beam pointer for every dawn UI element.
Literally everything is editable (tables,navbar,paginator)
I tried to put some random values in the tables instead of fetching the data from DB.
Still the problem persists.
I can't wrap my head around this.
Please give me some insights on where it is going wrong?

Autocomplete="off" not working on app-combobox (Chrome 69)

In my HTML I have a form with a few inputs (type text) and I have 2 app-comboboxes. What I would like to do, is set autocomplete off for every field in the form.
I set autocomplete="off" for the entire form, works perfectly except on those 2 dropdowns.
The dropdown works in the following way: if I click on it, a dropdown will appear with the full list of options to choose. If I type something, the list will be filtered based on what I typed. My problem is, when the field is empty, and when I click on it, another dropdown appears with early typed values, suggestions from Chrome above my dropdown with the full list of values. My Google Chrome Version is 69.0.3497.
I tried to put another autocomplete="off" in the app-combobox element, which didn't work. Then I tried to write a random string for autocomplete (eg. autocomplete="nope"), didn't work again.
I tried every solution which I found, but none of them work.
I would appreciate if someone has a solution for this, or just a clear answer that you cannot do this anymore in Chrome.
Thank you very much!

How does HTML form know which select option is selected?

I am trying to understand how the HTML form standard works in relation to select boxes. And the question is how does HTML form know which value a select box has as selected value in order to submit it when the form is submitted. I am inspecting a form with developer tools and I do not see anything changed whenever I change the select box selected option.
This is a pure HTML question and it should be pretty basic for those that they know the HTML standard well. Note that I am not asking for a JavaScript answer on how to get the selected option. I am asking a question in order to understand how does HTML form know which of the options is selected.
If you also have pointers to any documentation, that would be much appreciated.
You could ask the same question about how does a form know a checkbox is checked, or what text has been typed into an input field. The HTML for a web page gets parsed into a DOM (Document Object Model), and there are objects behind the scenes representing DOM elements. These objects, among other things, save state information about DOM elements such as selected options and the checking of checkboxes.
Those states don't show up just by viewing the source of a webpage, or necessarily even when using an inspect tool. But the info is there in the DOM for the browser to assemble into the HTTP request that is generated when you submit a form.

Autocomplete Chronoform in Joomla 2.5

I'm creating a simple form using Chronoforms, but so far I haven't been able to solve a small problem.
I would love to load two or three fields in a search done by the autocomplete element, i currently have two autocompletes working, but i can't seem to be able to load the other values into the corresponding textboxes.
I'm including the link to the form
http://cfobb.ca/index.php?option=com_chronoforms&chronoform=nomination_form
and as it can be seen, the first two fields in the first tab are working autocompletes, but i would love to have them linked so when the user chooses in any of the two, the other automatically gets filled. That selection would also trigger another sql query (that i already have, nothing fancy) that would fill the School Name drop-down menu. Also there's this code in the help tab
$form->data['_PLUGINS_']['autocomplete_processor']['result'];
but i don't really know how to use/handle it
Thanks