AnswerBun.com

How do I fill a dropdown menu with a list of dictionaries based on a previous select?

Stack Overflow Asked by definetly_not_a_robot on September 17, 2020

I have to let the user select gears from a list I extracted from a database.

<fieldset>
   <label>Wählen Sie Ihre Getriebeart aus: </label>
   <select name="typgetr" id="type">
      <option value="k">Kegelradgetriebe</option>
      <option value="s">Stirnradgetriebe</option>
   </select>
</fieldset>

Depending on this select the user can either choose a bevel or a spur gear. Based on that I want to fill the following select with one of the two lists below (first one is called by stri, second by keri).

[{'name': '4950491', 'typ': 'Ritzel', 'nzahn': 17, 'zahnver': 4.412}, {'name': '4559693', 'typ': 'Ritzel', 'nzahn': 18, 'zahnver': 4.39}, {'name': '4960360', 'typ': 'Ritzel', 'nzahn': 18, 'zahnver': 4.5556}, {'name': '4960346', 'typ': 'Ritzel', 'nzahn': 20, 'zahnver': 3.5}, {'name': '4960377', 'typ': 'Ritzel', 'nzahn': 19, 'zahnver': 3.53}, {'name': '4960356', 'typ': 'Ritzel', 'nzahn': 19, 'zahnver': 3.53}, {'name': '4960348', 'typ': 'Ritzel', 'nzahn': 19, 'zahnver': 3.53}, {'name': '4960314', 'typ': 'Ritzel', 'nzahn': 20, 'zahnver': 3.05}]

[{'name': '4950428', 'typ': 'Ritzel', 'nzahn': 11, 'zahnver': 3.3636}, {'name': '4447822', 'typ': 'Ritzel', 'nzahn': 11, 'zahnver': 2.5455}, {'name': '4936736', 'typ': 'Ritzel', 'nzahn': 11, 'zahnver': 2.55}, {'name': '4564106', 'typ': 'Ritzel', 'nzahn': 9, 'zahnver': 4.778}]


<fieldset>
    <label>Geben Sie Ritzelwelle und Zahnrad der <strong>ersten</strong> Getriebestufe ein: </label>
    <select name="zr12" id="zr12">
        {% for i in keri %}
            <option value="{{i.name}}">{{i.typ}}: {{i.name}}</option>
        {% endfor %}
    </select>
</fieldset>

I pretty much just want to show the name of each gear and pass it as its value back to python. The other items may be used later aswell. I already looked at some examples but I can’t write a javascript function.

One Answer

You have to use ajax calls.

You have to set on change event of the <select name="typgetr" id="type"> You send a ajax call to a Url that will contain the id of the selected option, example: localhost/example?id=1.

Then you get the id param on Django as GET request and based on that option the user selected you return the select list (html) and you render in the dom using javascript

Answered by Edson Magombe on September 17, 2020

Add your own answers!

Related Questions

Get data from DataGrid if DataGridCheckBoxColumn is checked

0  Asked on November 4, 2021 by user12711263

     

The value of local variable isn’t used

1  Asked on November 4, 2021 by greenycodeskii

     

clickhouse : information_schema.KEY_COLUMN_USAGE

1  Asked on November 4, 2021 by sravya-jasthi

 

WPF prevent combobox selection change under condition

1  Asked on March 8, 2021 by hasan-h

     

How to listen to Boot Complete broadcast in Oneplus?

1  Asked on March 8, 2021 by saarang-tiwari

 

Indirection requires pointer operand error

1  Asked on March 8, 2021 by mr-needhelp

 

Point Cloud Segmentation

1  Asked on March 7, 2021 by aldi-lin

   

Angular HTTP get request is not working in ngOnInit

1  Asked on March 6, 2021 by iamgrooot

   

CheckedChanged not triggering

0  Asked on March 6, 2021

     

flutter splash screen is blurry on physical device

1  Asked on March 5, 2021 by mohamed-mostapha

   

Nginx syslog post request

1  Asked on March 5, 2021 by andreas-hunter

         

Cloning Objects in Google Optimize

0  Asked on March 4, 2021 by jpfotoz

     

Specialize how std::vector grows

3  Asked on March 3, 2021 by gary-allen

   

Ask a Question

Get help from others!

© 2022 AnswerBun.com. All rights reserved. Sites we Love: PCI Database, MenuIva, UKBizDB, Menu Kuliner, Sharing RPP, SolveDir