Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How does the InsertionMode.Replace works on the Ajax.BeginForm

i have the following Ajax.beginform inside my asp.net mvc view, where the result of the ajax call will replace the <div id= "searcharea">, as follow:-

@using (Ajax.BeginForm("Search", "Patient",
    new AjaxOptions
{
    HttpMethod = "GET",
    InsertionMode = InsertionMode.Replace,
    UpdateTargetId = "searcharea",
    LoadingElementId = "progress2"
}))
{
   <table >

 <tr>

        <th>
         Searching By First Name (English) :-
        </th>
        <th>
          <input type="text" name="firstname"  />
        </th></tr>
      <tr>

        <th>
         Searching By Family Name (English) :-
        </th>
        <th>
          <input type="text" name="familyname"  />
        </th></tr>

      <input type="submit" value="Search      " /></th><th></th></tr>
  </table>

}

<div id = "progress2">
<img src= "@Url.Content("~/Content/images/Ajax-loader-bar.gif") ">
</div>
<p>
<div id= "searcharea">
</div>

So at the begining i though that i will only be able to perform one search since the <div id= "searcharea"> will be replaced with the result of the ajax call and it will not be avilalbe after that, and if i try to do anther ajax call there will be no more <div id= "searcharea"> to replace the result with.

But what actually happened is that I was able to do multiple searches without any problem ,, so does this means that the InsertionMode.Replace will not replace the DOM element and that it will only insert the result of the ajax call within this DOM,, because i can not understand how i can reference a DOM element multiple times even if it has been replaced by my first ajax call ???!! can anyone explain how this happen ? BR

like image 331
john Gu Avatar asked Dec 13 '22 02:12

john Gu


1 Answers

You're misunderstanding InsertionMode.Replace. It will replace everything inside the HTML element you specify with UpdateTargetId, not the element itself.

It's the same as

$("#searcharea").html(newHTMLcontent);

An insertion mode that destroyed the element it worked with wouldn't be very useful for the reason you mentioned: you'd only be able to use it once.

like image 61
DMulligan Avatar answered Dec 22 '22 00:12

DMulligan