How to validate in kendo gride field

how to validate a number field in kendo gride .

CostPrice: { editable: true, type: "number",validation: { required: true}}

how to validate a date field in kendo gride.
 var date = new Date();
        var currentYear = date.getFullYear();
        var mindate = "01/01/" + currentYear;
        var maxdate = "12/31/" + currentYear;

 schema: {
                    data: "Data",
                    total: "Total",
                    errors: "Errors",
                    model: {
                        id: "Id",
                        fields: {
                            Date: { editable: true, type: "date", format: "{0:MM/dd/yyyy}", validation: { required: true, min: new Date(mindate), max: new Date(maxdate) } },
                            Month: { editable: false, type: "string" },
                            HolidayName: {
                                editable: true, type: "string", validation: {
                                    required: true,
                                    maxlength:
                     function (input) {
                         if (input.val().length > 80) {
                             input.attr("data-maxlength-msg", "Max length is 80");
                             return false;
                         }
                         return true;
                     }
                                }
                            },
                            Id: { editable: false, type: "number" }
                        }
                    }

                },

}

How to convert large image to Small image in MVC

View


@{


ViewBag.Title = "Index";






}


　


　


@using (Html.BeginForm("Post", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))








{


<table align="center">


<tr><td><input type="file" id="file" name="file" /></td></tr>


<tr><td><input type="submit" value="Upload" /></td></tr>


</table>





}


Controller


using System;


using System.Collections.Generic;


using System.Drawing;


using System.Drawing.Drawing2D;


using System.IO;


using System.Linq;


using System.Web;


using System.Web.Mvc;


namespace MvcApplication13.Controllers






{


public class HomeController : Controller





{





public ActionResult Index()






{


return View();






}


[HttpPost]

public ActionResult Post(HttpPostedFileBase file)






{


if (file != null)






{


string pic = System.IO.Path.GetFileName(file.FileName);

string path = System.IO.Path.Combine(Server.MapPath("~/Image"), pic);

string targetPath = Server.MapPath("~/Image/" +"small"+ pic);

Stream strm = file.InputStream;

var targetFile = targetPath;






ConvertToSmallImage(0.05, strm, targetFile);


file.SaveAs(path);


}


return RedirectToAction("Index");






}


private void ConvertToSmallImage(double scaleFactor, Stream sourcePath, string targetPath)






{


var image = System.Drawing.Image.FromStream(sourcePath);

var newWidth = (int)(image.Width * scaleFactor);

var newHeight = (int)(image.Height * scaleFactor);

var thumbnailImg = new Bitmap(newWidth, newHeight);

var thumbGraph = Graphics.FromImage(thumbnailImg);

thumbGraph.CompositingQuality = CompositingQuality.HighQuality;

thumbGraph.SmoothingMode = SmoothingMode.HighQuality;

thumbGraph.InterpolationMode = InterpolationMode.HighQualityBicubic;

var imageRectangle = new Rectangle(0, 0, newWidth, newHeight);






thumbGraph.DrawImage(image, imageRectangle);


thumbnailImg.Save(targetPath, image.RawFormat);


}


}


}

how to display server side error message in client side using jquery & MVC

@using (Html.BeginForm("Post", "VendorPortal", FormMethod.Post, new { @id = "frmAddContact" }))



{
<ul>
<li>
  @Html.TextBoxFor(model => model.StreetAddress1, new { @class = "form-control", @required = "required" })
</li>
<li>


<input type="button" class="btn btn-submit" id="btnSubmit" value="Save">


</li>


<li>


<input type="button" id="btnc" class="btn btn-cancel" value="Cancel">


</li>


</ul>
}


<script type="text/javascript">


$(function () {

$('#btnSubmit').click(function () {

$('#frmAddContact').trigger("reset");

$('.field-validation-error').empty();

$('.field-validation-valid').empty();

if ($("#frmAddContact").valid()) {

$("#frmAddContact").submit();






}





});</script>

Kendo Chart

Controller Code :

 public JsonResult FillScoreCard()

        {

            List<ChartMetadata> lst = new List<ChartMetadata>() { 

            new ChartMetadata(){ Value=100,Text="Siv",Code="#00FFFF"},

            new ChartMetadata(){ Value=200,Text="Sankar",Code="#FFFF00"},

            new ChartMetadata(){ Value=300,Text="Mahadev",Code="#4E9258"},

            };

            return Json(lst,JsonRequestBehavior.AllowGet);

        }

View code :

<div style="width:100%;">
    <div style="width:49%;float:left; border:1px solid #808080; margin-top:50px">

        <div id="ScoreCard" style="width:500px;"></div>

    </div>
    <div style="width:49%;float:right;border:1px solid #808080;margin-top:50px">

        <div id="PurchaseSummary" style="width:500px;"></div>

    </div>

</div>
<script>
    $(function () {
        $.ajax({
            url: '@Url.Action("FillScoreCard", "VendorPortal")',
            type: 'GET',
            dataType: 'json',
            cache: false,
            success: function (data1) {
                $("#ScoreCard").kendoChart({
                    dataSource: {
                        data: data1
                    },
                    title: {
                        text: "Score Card",
                        color: "#2B65EC"
                    },
                    legend: {
                        position: "left"
                    },
                    seriesDefaults: {
                        type: "column",
                        labels: {
                            visible: true,
                            background: "transparent"
                        }
                    },
                    categoryAxis: [{
                        field: "Text",
                        majorGridLines: {
                            visible: false
                        },
                     
                        title: {
                            text: "Criteria",
                            background: "#4682B4",
                            color: "#ffffff",
                            padding: 15

                        },
                        labels: {

                        }

                    }],
                    valueAxis: [{
                        title: {
                            text: "Count",
                            background: "#4682B4",
                            color: "#ffffff",
                            padding: 15,
                        },
                        majorUnit: 50,
                        max: 500,
                        min: 0 ,
                        majorGridLines: {
                            visible: false
                        },
                    }],
                    series: [{
                        field: "Value",
                        colorField: "Code"
                    }

                    ]
                });
            }

        });
        $.ajax({
            url: '@Url.Action("FillPurchaseSummary", "VendorPortal")',
            type: 'GET',
            dataType: 'json',
            cache: false,
            success: function (data1) {
                $("#PurchaseSummary").kendoChart({
                    dataSource: {
                        data: data1
                    },
                    title: {
                        text: "Purchase Summary",
                        color: "#2B65EC"
                    },
                    legend: {
                        position: "left"
                    },
                    seriesDefaults: {
                        type: "column",
                        labels: {
                            visible: true,
                            background: "transparent"
                        }
                    },
                    categoryAxis: [{
                        field: "Text",
                        majorGridLines: {
                            visible: false
                        },
                        title: {
                            text: "Status",
                            background: "#4682B4",
                            color: "#ffffff",
                            padding: 15
                        }

                    }],
                    valueAxis: [{
                        title: {
                            text: "Count",
                            background: "#4682B4",
                            color: "#ffffff",
                            padding: 15
                        },
                        majorUnit: 50,
                        max: 500,
                        min: 0,
                        majorGridLines: {
                            visible: false
                        },
                    }],
                    series: [{

                        field: "Value",
                        colorField: "Code"
                    }

                    ]
                });
            }

        });

    });

</script>


Y-axis value fill dynamically


<script>


$(function () {

       




$.ajax({


url: '@Url.Action("FillScoreCard", "VendorPortal")',

type: 'GET',

dataType: 'json',

cache: false,






data:{VendorId:@Model.VendorId},


success: function (data1) {

var max1=0;

var interval=0;

for(var i=0;i<data1.length;i++)

if(max1<data1[i].Value)






max1=data1[i].Value;


max1=max1*2;


if(max1<=100)






interval=5;


else if(max1>100 && max1<=200)






interval=10;


else if(max1>200 && max1<=300)






interval=20;


else





interval=50;


$("#ScoreCard").kendoChart({






dataSource: {


data: data1


},





legend: {


position: "left"





},


seriesDefaults: {


type: "column",






labels: {


visible: true,

background: "transparent"





}


},


categoryAxis: [{


field: "Text",






majorGridLines: {


visible: false





},


title: {


text: "(Product Count) Criteria",

background: "#4682B4",

color: "#ffffff",






padding: 10


},


labels: {


}


}],


valueAxis: [{


title: {


text: "Count",

background: "#4682B4",

color: "#ffffff",






padding: 10,


},


majorUnit: interval,


max: max1,


min: 0,


majorGridLines: {


visible: false





},


}],


series: [{


field: "Value",

colorField: "Code"





}


]


});


}


});


$.ajax({


url: '@Url.Action("FillPurchaseSummary", "VendorPortal")',

type: 'GET',

dataType: 'json',

cache: false,






data:{VendorId:@Model.VendorId},


success: function (data1) {

var max1=0;

var interval=0;

for(var i=0;i<data1.length;i++)

if(max1<data1[i].Value)






max1=data1[i].Value;


max1=max1*2;


if(max1<=100)






interval=5;


else if(max1>100 && max1<=200)






interval=10;


else if(max1>200 && max1<=300)






interval=20;


else





interval=50;


$("#PurchaseSummary").kendoChart({






dataSource: {


data: data1


},





legend: {


position: "left"





},


seriesDefaults: {


type: "column",






labels: {


visible: true,

background: "transparent"





}


},


categoryAxis: [{


field: "Text",






majorGridLines: {


visible: false





},


title: {


text: "Status",

background: "#4682B4",

color: "#ffffff",






padding: 10


}


}],


valueAxis: [{


title: {


text: "Count",

background: "#4682B4",

color: "#ffffff",






padding: 10


},


majorUnit: interval,


max: max1,


min: 0,


majorGridLines: {


visible: false





},


}],


series: [{


field: "Value",

colorField: "Code"





}


]


});


}


});


});


</script>