i am trying to test jquery post. I am posting a form and want to update in ajax and replace with a success form over a div (seems like a common use case).
The following code works fine in firefox but not in IE.
One issue is that from Firefox Request.IsAjaxRequest() is true but coming from IE, Request.IsAjaxRequest() is returning false
NOTE: i put in the Thread.Sleep in my controller action just as a test to make sure i can see whats going on.
Here is my view code:
<div id="contact">
<form action="/Tracker/Add" method="post">
<fieldset id="inputbox">
<p>
<label>Today's number</label> <input class="inputText" id="weight" name="weight" type="text" value="208" /></p>
<p><label>Today's Date</label> <input class="inputText" id="datepicker" name="date" type="text" value="03-Mar-2010" /></p>
<p><input type="submit" value="Enter" /></p>
</fieldset>
and here is the javascript / jquery code:
<script type="text/javascript" src="../../Scripts/jquery/1.3.2/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#contact form').live('submit', function() {
//$("#Loading").fadeIn(); //show when submitting
$.post($(this).attr('action'), $(this).serialize(), function(data) {
$("#contact").replaceWith($(data));
});
return false;
});
});
</script>
and here is my controller action:
public ActionResult Add()
{
if (if (Request.IsAjaxRequest())
{
//firefox will hit this but IE wont
}
Thread.Sleep(5000);
return PartialView("EntryView", new MyViewModel());
}