-1

My website ends in ...MVR/MVRView.aspx and it doesn't load another page and loads elements within the same HTML using onchange() or options. Selected='selected'.

Website menus:

  • Registration Office names: dropdown menu
  • Circle names: dropdown menu
  • Thana codes: dropdown menu

Only an option selection and onchange() from office_names menu allows circle_names select dropdown menu to show its options, and a circle_names option selection to show thana_codes menu otherwise, it stays empty.

I'm trying to test the code below in my browser console. The code is supposed to switch between the 4 circle_names options for office_names.selectedIndex = 2 to load and show the thana_codes select options element for each. But it randomly selects a circle_names option and shows its loaded thana_codes options element 4 times.

E.g. The option 4 of circle_names element gets selected randomly.

<select name="ctl00$ContentPlaceHolder1$ddl_circle" onchange="javascript:setTimeout('__doPostBack(
    \'ctl00$ContentPlaceHolder1$ddl_circle\',\'\')', 0)" id="ctl00_ContentPlaceHolder1_ddl_circle" class="iddll">
    <option value="0">--SELECT--</option>
    <option value="06">AMOUR</option>
    <option value="07">DAGARUA</option>
    <option value="08">BAISI</option>
    <option selected="selected" value="09">BAISA</option>
</select>

E.g. The thana_codes element below that loads after circle_names element option 4 selection.

<select name="ctl00$ContentPlaceHolder1$ddl_thanaCode" onchange="javascript:setTimeout('__doPostBack(
        \'ctl00$ContentPlaceHolder1$ddl_thanaCode\',\'\')', 0)" id="ctl00_ContentPlaceHolder1_ddl_thanaCode"
    class="iddll">
    <option selected="selected" value="0">--SELECT--</option>
    <option value="013">Abhaypur/013</option>
    <option value="049">Alinagar/049</option>
    <option value="002">Arhal/002</option>
    <option value="028">Ashiyani/028</option>
    <option value="015">Asja/015</option>
    <option value="116">Baies Mara/116</option>
    <option value="026">Bairgachhi/026</option>
    .......................................
    <option value="031">Sukarna/031</option>
    <option value="107">Tarabari/107</option>
    <option value="096">Tetaliya/096</option>
    <option value="020">Titiha/020</option>
    <option value="038">Ufrail/038</option>
</select>

I want a loop that switches between the circle_names options and gives 4 unique thana_codes elements instead of repeating the above one 4 times.

Code:

var office_names = document.getElementById(
  "ctl00_ContentPlaceHolder1_ddl_dsro"
);
office_names.selectedIndex = 2;
office_names.onchange();
circle_names = document.getElementById("ctl00_ContentPlaceHolder1_ddl_circle");
for (let i = 1; i < circle_names.options.length; i++) {
  const option = circle_names.options[i];
  option.selected = "selected";
  if (option.selected) {
    console.log(
      document.getElementById("ctl00_ContentPlaceHolder1_ddl_thanaCode")
    );
  }
}

The code works for a single circle_names option for office_names option 2. In the loop version, I also tried to add time delays, but it didn't work.

How can I get the thana_codes element for each circle_names in the browser console?

Mahesh Thorat
  • 1
  • 4
  • 11
  • 22
Swati Mishra
  • 11
  • 4

1 Answers1

1

The code below is wrong and not needed:

for (let i = 1; i < circle_names.options.length; i++) {
  const option = circle_names.options[i];
  option.selected = "selected";
  if (option. Selected) {
    console.log(
      document.getElementById("ctl00_ContentPlaceHolder1_ddl_thanaCode")
    );

The reason is that the website page cannot load the HTML for all elements on onchange() event because changing the selected option from the same drop-down menu which is the circle name menu, requires a page reload and it means reload of all the selections, i.e., from selecting office name then circle name to get the thana codes for that selected circle name and the process repeats. So, I created a loop in my code that changes the index dynamically and removed the loop from the javascript code.

Correct code in the browser console for a single selected circle index:

var office_names = 
document.getElementById('ctl00_ContentPlaceHolder1_ddl_dsro');
office_names.selectedIndex = 2;
office_names.onchange();
circle_names = 
document.getElementById('ctl00_ContentPlaceHolder1_ddl_circle');
circle_names.selectedIndex = 1;
circle_names.onchange();
document.getElementById('ctl00_ContentPlaceHolder1_ddl_thanaCode');

My new Python code:

for circle_index in range(0,len(circle_names)):
..........................................

# the embedded js_code in the code with
     circle_names.selectedIndex = circle_index;
..........................................
Swati Mishra
  • 11
  • 4