نمایش تصویر و به دست اوردن اندازه آن

برا اینکه بتوانیم تصویر را نمایش دهیم این کد را در view  نوشتیم

        <div class="form-group">
            @Html.LabelFor(model => model.Image, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                <input type="file" name="Image" id="Image" class="form-control" />
                <div style="direction: rtl">اندازه عکس 135X360</div>
                <img id="imgB" style="width: 50px">
                @Html.ValidationMessageFor(model => model.Image, "", new { @class = "text-danger" })
            </div>
        </div>

و در قسمت جا وااسکریپت نوشتم 

@section scripts
{
    <script type="text/javascript">
        $('input[name=Image]').change(function (ev) {
            var file = this.files && this.files[0];
            if (file) {
                var reader = new FileReader();
                //
               
                var img = new Image();

                img.src = window.URL.createObjectURL(file);

                img.onload = function() {
                    var width = img.naturalWidth,
                        height = img.naturalHeight;
                    if (width!== 360 && height !== 135) {
                        alert("اندازه تصویر نامناسب است ");
                        return;
                    } else {
                        
                        reader.onload = function (e) {
                            $("#imgB").attr('src', e.target.result);
                    }
                    
                }
               }
                reader.readAsDataURL(this.files[0]);
            }


        });
    </script>
}

استفاه از Section  را هرگز فراموش نکنید چرا که باعث میشود کد شما در صفحه اصلی بعد از لینک jquery  اجرا شود و به یاد داشته باشید که section  در پارشیال ویوو(Partial view ) کار نخواهد کرد.