title: mvc asp multiple bootstrap modals (opened with href="@Url.Action()")
body: <p><strong>Introduction:</strong> Hi, I'm new to Stackoverflow, any feedback apprichiated.
  I'm working on a larger mvc asp project and my problem concerns Views, modals and bootstrap.
  I created a website creating the necessary views, but was later asked to make some of these into modals, the easy solution was what follows.</p>
  
  <p><strong>Context:</strong> To open a modal I'm currently using:</p>
  
  <pre><code>  &lt;a class="btn btn-default" href="@Url.Action("Edit", "Product", new { id = item.id})" data-toggle="modal" , data-target="#modal"&gt;open modal&lt;/a&gt;
  </code></pre>
  
  <p>Which opens a my "Edit" View in/as a Modal. </p>
  
  <p>(If you would like to see the modal or View, I can supply those, they are relativly standard though)</p>
  
  <p>I used this method since it seemed to most logical to me at the time, I'm now wodering if it's the right choice.</p>
  
  <p><strong>Problem:</strong> complications arise when I want to close a secound modal (opend in the previous modal, the same way as before), the problem is that it closes all open modals.</p>
  
  <pre><code>&lt;a href="#"  data-dismiss="modal" class="btn"&gt;Close&lt;/a&gt;
  </code></pre>
  
  <p>I've tried using script functions to close the specific upper modal, without success.</p>
  
  <p><strong>Questions:</strong> </p>
  
  <ol>
  <li>Is the way I am currently handeling modals acceptable? (1. it works as long as you only want to open one modal)</li>
  <li>Is there an easy solution to close only one modal with my current setup?</li>
  <li>Is the problem related to bootstrap, if so, how do I solve it?</li>
  </ol>
  
  <p><strong>Related question/can be ignored:</strong> using this way of opening modals, i ran into the problem of "modal/View" content not resetting. Lets say I would give a product in my modal values and then close it, when I re-open it afterwards, the same values would still be shown, I "fixed" this using @Html.ActionLink instead of the traditional:
  <code>&lt;button type="button" class="close" data-dismiss="modal"&gt;&amp;times;&lt;/button&gt;</code></p>
  
  <p>The problem here is that this forces a page refresh, which i would like to avoid.</p>
  
  <p>I've tried variantions on the following, with no real success, I pressume because my modal is more View than modal.</p>
  
  <pre><code>  $(".modal").on("hidden.bs.modal", function(){
    $(".modal-content").html(""); 
  });
  </code></pre>
  
  <p>Thanks for your time!</p>
  
  <p><strong>EDIT:</strong>
  So I found a solution to #2 I had placed my modals in two diffrent views, but to open multiples, i had to have them in the same View. Example: three views: Product, Edit and ProductDetails Edit modal was placed in Product, and ProductDetails modal was placed in Edit. Mistake was placing ProductDetails modal in Edit Once i placed all modals in Product it worked. I can now open and close modals, any way i want. But now my related problem is the main problem, the content doesn't reset uppon closing so the modal will show me the same information when selecting diffrent products</p>