Now, use javascript to show it in and hide, when an ajax request starts.
<script type="text/javascript">
$(document).ajaxStart(function () {
$('#spinner').show();
}).ajaxStop(function () {
$('#spinner').hide();
});
</script>
Style the div element to position it on the centre of the browser.
<style>
div#spinner
{
display: none;
width:100px;
height: 100px;
position: fixed;
top: 50%;
left: 50%;
text-align:center;
margin-left: -50px;
margin-top: -100px;
z-index:2;
overflow: auto;
}
</style>
Put the html for the loader in the page.
<div id="spinner">
<img src="~/Images/googleLarge.gif" alt="Loading..."/>
</div>
Finally I tracked it down to two issues.
I realized that if I
set UnobtrusiveJavaScriptEnabled to false in my web.config file,
everything worked.
A second issue, and one that I suspect others may run into as well, is that I didn’t have a reference to jquery.unobtrusive-ajax.min.js
in my master (or child) page. Since MVC 3 uses UnobtrusiveJavaScript
by default, it’s essential that the Javascript files are referenced,
otherwise it can break unrelated Javascript, making it obtrusive rather
than unobtrusive. Obviously not the desired effect.
The correct scripts that are required for MVC+AJAX plus UnobtrusiveJavaScript are:
var _companyId = 1;
var Name = "OP";
var FromDate;
var EmpId;
var query = from audit in edmx.tblAudit
from asst in edmx.tblAssets.Where(x => x.AutoId == audit.Asset_Id)
where audit.Company_Id == _companyId
&& asst.Name.Contains(string.IsNullOrEmpty(Name) ? asst.Name : Name)
select new
{
AssetName = asst.Name,
Serial_No = asst.Serial_No,
EmployeeName = audit.EmpName,
Date = audit.Audit_Date
};
if (FromDate.Length > 7)
{
var _FromDate = Convert.ToDateTime(FromDate);
query = query.Where(x => x.Date >= _FromDate);
}
if (EmpId.Length > 0)
{
var _empId = Convert.ToInt16(EmpId);
query = query.Where(x => x.EmployeeId == _empId);
}
var auditData = (from asst in query
asst.AssetName, asst.Serial_No, asst.EmployeeName,
asst.Date, asst.AssetType
}).OrderBy(x => x.AssetType).ToList();
looking like : SELECT AssetName, Serial_No, EmployeeName,Date,AssetType FROM [dbo].[tblAssets] AS [t0] Inner join tblAudit t1 on t1.Asset_Id = t0.AutoId WHERE (t0.AssetName like '%op%') AND (t0.Fromdata >= '01/01/2013') AND
(t1.empId = 11)
I need to enable the validation of hidden fields using ASP.net MVC3/4 unobtrusive validation. The reason behind this is a jquery plugin which hides the original input field to show something fancier. But this disables validation of the field as it becomes hidden.
Finally i found perfect solution. Now we are able to validate hidden field with following code.