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
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.