Hi I am trying to make a modify booking page but the save button in my table is not working, there is not output. Originally i used text input (save was still working) but changed to drop down then the save button stopped working. Please help me take a look.

I have uploaded the code. Thank you.

document.getElementById("levels-list1" + no).value = stime_data;
}
}

function save_row(no) {
  var date_val = document.getElementById("date_text" + no).value;
  var roomtype_val = document.getElementById("roomtype_text" + no).value;
  var stime_val = document.getElementById("stime_text" + no).value;


  document.getElementById("date_row" + no).innerHTML = date_val;
  document.getElementById("roomtype_row" + no).innerHTML = roomtype_val;
  document.getElementById("stime_row" + no).innerHTML = stime_val;


  document.getElementById("edit_button" + no).style.display = "block";
  document.getElementById("save_button" + no).style.display = "none";

  alert("Booking has been succesfully modified.");
}
<h1 id="middle">View your bookings</h1>

<span style="position:fixed ;left: 1350px; top: 155px;">Logout</span>
<span style="position:fixed ;left: 675px;top: 155px;"><a href="https://stackoverflow.com/questions/72251816/home page.html">Homepage</a></span>
<div id="wrapper">

  <table align='left' style="background-color:#001641;  padding-right: 750px; padding-top: 0px; padding-bottom: 400px;">
    <tr>
      <td>
        <table align='left' cellspacing=20px cellpadding=10px id="data_table" border=5 " style="width:200% " rules="all ">
    <tr>
    <th >Date</th>
    <th>Room type</th>
    <th>Time</th>
    <th></th>
    <th></th>
    </tr>
    
    <tr id="row1 ">
    <td id="date_row1 ">2022-05-10</td>
    <td id="roomtype_row1 ">101</td>
    <td id="stime_row1 ">09:00</td>
    <td>
    <input type="button " id="edit_button1 " value="Modify booking " class="edit " onclick="edit_row( '1') ">
    <input type="button " id="save_button1 " value="Save " class="save " onclick="save_row( '1') " hidden>
    </td><td><input type="button " value="Delete booking " class="delete " onclick="delete_row( '1') ">
    </td>
    </tr>
    
    <tr id="row2 ">
    <td id="date_row2 ">2022-05-09</td>
    <td id="roomtype_row2 ">102</td>
    <td id="stime_row2 ">13:00</td>
    <td>
    <input type="button " id="edit_button2 " value="Modify booking " class="edit " onclick="edit_row( '2') ">
    <input type="button " id="save_button2 " value="Save " class="save " onclick="save_row( '2') " hidden>
    </td><td><input type="button " value="Delete booking " class="delete " onclick="delete_row( '2') ">
    </td>
    </tr>
    
    <tr id="row3 ">
    <td id="date_row3 ">2022-05-11</td>
    <td id="roomtype_row3 ">101</td>
    <td id="stime_row3 ">10:00</td>
    <td>
    <input type="button " id="edit_button3 " value="Modify booking " class="edit " onclick="edit_row( '3') ">
    <input type="button " id="save_button3 " value="Save " class="save " onclick="save_row( '3') " hidden>
    </td><td><input type="button " value="Delete booking " class="delete " onclick="delete_row( '3') ">
    </td>
    </tr>
    
    <tr id="row4 ">
    <td id="date_row4 ">2022-05-11</td>
    <td id="roomtype_row4 ">103</td>
    <td id="stime_row4 ">16:00</td>
    <td>
    <input type="button " id="edit_button3 " value="Modify booking " class="edit " onclick="edit_row( '4') ">
    <input type="button " id="save_button3 " value="Save " class="save " onclick="save_row( '4') " hidden>
    </td><td><input type="button " value="Delete booking " class="delete " onclick="delete_row( '4') ">
    </td>
    </tr>
    
    
    </table>
    </td>
    </tr>
    </table>
    </div>
    
    </body>
    </html>

JS

    function edit_row(no)
    {
     document.getElementById("edit_button "+no).style.display="none ";
     document.getElementById("save_button "+no).style.display="block ";
        
     var date=document.getElementById("date_row "+no);
     var roomtype=document.getElementById("roomtype_row "+no);
     var stime=document.getElementById("stime_row "+no);
    
        
     var date_data=date.innerHTML;
     var roomtype_data=roomtype.innerHTML;
     var stime_data=stime.innerHTML;
        
     date.innerHTML="<input type="date" min='2022-05-09' max='2022-05-13' id='date_text"+no+"' value=""+date_data+"">"; roomtype.innerHTML='

          <select id="levels-list'+no+'">
            <option value="A" id="option-1">101</option>
            <option value="B" id="option-2">102</option>
            <option value="C" id="option-3">103</option>
          </select>'; document.getElementById("levels-list"+no).value = roomtype_data; roomtype.onchange = function(){ stime.innerHTML='
          <select id="levels-list1'+no+'">
            <option value="A1" id="option-11">101</option>
            <option value="B1" id="option-22">102</option>
            <option value="C1" id="option-33">103</option>
          </select>';

1