0

What I am trying to do is when the user opens the modal and select option from the dropdownlist and close it without doing anything and reopen it the dropdownlist become "--select--" again

<pre>
<div class="inpu_modal">
@Html.LabelFor(m => m.Add_interaction.with_name, new { @class = "sub-title alighn" })
@Html.DropDownListFor(m => m.Add_interaction.with_name, new SelectList(ViewBag.names, "Value", "Text"), "--Select--", new { @class = "with", @autocomplete = "off" })
<span class="field-validation-valid text-danger with_name_span"></span>
</div>
</pre>



function Open_new_interaction() {
        document.querySelector('.drug_name_span').innerHTML = null;
        document.querySelector('.with_name_span').innerHTML = null;
        document.querySelector('.Degree_span').innerHTML = null;
        $('.drug option:selected').removeAttr('selected');
        $('.with option:selected').removeAttr('selected');
        $('#Add_InteractionDrug').modal("show");
    }
tnw
  • 13,521
  • 15
  • 70
  • 111
Omar Alhourani
  • 3
  • 1
  • I cannot comment on the code above because of my reputation points but, I'm assuming that the code you have now does not reset the the list to the "---select---"? default option again.[You would have to manually do that with JavaScript](https://stackoverflow.com/a/16913242/15147229) – Daniel Oluwadare Apr 23 '21 at 18:50
  • I tried the link it works with open new but when I am trying to edit on the same modal and select from the dropdown passed on the data returned from the backend something go wrong – Omar Alhourani Apr 23 '21 at 18:54
  • $('.active_name option:selected').removeAttr('selected'); $(".active_name option:contains(" + data.active_name + ")").attr('selected', 'selected'); – Omar Alhourani Apr 23 '21 at 18:54
  • Can you post the error you get? – Daniel Oluwadare Apr 23 '21 at 18:57
  • I didn't get any error but the dropdownlist does not work correctly – Omar Alhourani Apr 23 '21 at 18:59

1 Answers1

0

Since you are using bootstrap modal, you must do this:

$( ".modal-class" ).on('shown', function(){
    //reset the  dropdown here, do all the reset logic here
    //check if select dropdown is not null, and then loop through and get the default and set the selected.
    //
   let dropDown = document.querySelector("#dropdownId");
   //if the default value is at index 0, then just
    dropDown.selectedIndex = 0;
   /*if not, then loop through the options and find the option by inner HTML(i forget 
    if it contains a value*/  
    //if it has a value)

});
Daniel Oluwadare
  • 53
  • 5