Getting the Error: "Templates Can be used only with field access,property access, single dimension, or Single-parameter Custom Indexer Expression" in Asp.Net MVC3/MVC4

While working on an MVC3 project I need to Show the short date  & time in the display for HTML helper, but when I used it is throwing the above error, the reason behind it was that the HTML helper DisplayFor and EditorFor  takes directly the properties of the model rather than the functions which are associated with it.
  @Html.DisplayFor(model => model.DateStart.Value.ToShortDateString( ))

To fix the above situation you can simply remove the DisplayFor and use as :

@if(Model.DateStart!=null)
{
  Model.DateStart.ToShortDate( )
}

However, the best method to fix this situation is create a partial class with the above field and use the DisplayFormat properties to it with the one you wants.

    [DisplayName("Start Date")]
    [DisplayFormat(DataFormatString="{0:MM/dd/yyyy}",  ApplyFormatInEditMode=true)]
    public System.Nullable<System.DateTime> ModifiedStartDate
    {
        get
        {
            return this.StartDate.ToShortDateString( );
        }
        set
        {
            this.StartDate = value;
        }
    }

How to use it:
  @Html.DisplayFor(model => model.ModifiedStartDate)

Center an element on the screen using jQuery

jQuery.fn.center = function () {

    this.css("position","absolute");

    this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");

    this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");

    return this;

}

 This is how you use it:  $('#window').center();

The above method will show the control @ center of the Window.

How to resize a website dynamically as per the window size

Today I got some requirement to re-size the some website that should doesn't have scroll bar and need to adjust dynamically as per the window size.

To do that you need to do it JQuery or CSS. I am posting here how you will do it in JQuery.

Just put this script in the page which you want to adjust its size.

<script type="text/javascript">
    $(document).ready(function () {
        Resize();
    });
    
 $(window).resize(function () { Resize(); location.reload(true); }); // when the window get re-sized
   
    function Resize() {
        var height = window.innerHeight ? window.innerHeight : $(window).height();
        height = height - 96; // Height of the Logo and the Footer is 96px so it is deducted.
        $("#leftNav").height(height);
    }
</script>

Here i am concerned about the height. I you want to resize with width also you can use $(window).width().

Note: Be cautious if you are still want to work the code in IE7 the do remember the following things, you need to deduct the view port

    // IE7

    if (jQuery.browser.msie) {

        if(parseInt(jQuery.browser.version) == 7) {

            viewportHeight -= 3;

        }

    }

    if($('#leftNav').height() > viewportHeight) {

        $('#leftNav').height($('#leftNav').height() - viewportHeight);

    }

    if($('#leftNav').height() < viewportHeight) {

        $('#leftNav').height(viewportHeight - $('#leftNav').height());

    }