kendo gride example

<script type="text/javascript">

$(function () {

$('#AID').change(function () {

if ($('#AID :selected').text() != "Select") {

$('#btnTicket').removeAttr('disabled');



$.ajax({

cache: false,

type: "Get",

url: "/OrderManagement/GetAccountNumber",

data: { Id: $(this).val() },

success: function (data) {

$('#lbacountnumber').text(data);



},

error: function (xhr, ajaxOptions, thrownError) {



alert(thrownError);

}

});

}

else {

$('#lbacountnumber').text('');

$('#btnTicket').attr('disabled', 'disabled');



}

　

　

　

});

$('#txtSearch').val('Search');

$('#txtSearch').focus(function () {

$(this).val('');



});

$('#txtSearch').blur(function () {

if ($(this).val().length == 0)

$('#txtSearch').val('Search');



});

　

$("#orderManagement-grid").kendoGrid({



dataSource: {

type: "json",



transport: {

read: {

url: "@Html.Raw(Url.Action("OrdermanagementListKendoData", "OrderManagement"))",

type: "POST",

dataType: "json",



data: additionalData

}

},

schema: {

data: "Data",

total: "Total",

errors: "Errors"



},

error: function(e) {



display_kendoui_grid_error(e);

this.cancelChanges();



},

pageSize: @(defaultGridPageSize),

serverPaging: true,

serverFiltering: false,

serverSorting: false,



},

filterable: {

extra:false,



operators: {

string:{ contains: "Contains"}



}

},

sortable: {

mode: "single",

allowUnsort: false



},

pageable: {

refresh: true,



pageSizes: [@(gridPageSizes)]

},

scrollable: false,

selectable: false,



columns:

[

{

field: "Id",

template: "#=Id#",

hidden: true



},

{

field: "SalesOrderNumber",

title: "Sales Order Number",

template: '<a href="/admin/SalesOrder/Index/#=Id#">#=SalesOrderNumber#</a>'



},



{

field: "AccountNo",

title: "Account No.",





},

{

field: "AccountName",

title: "Account Name",

filterable: true



},

{

field: "OrderPlacedDate",

title: "Order Placed Date",

template: "#= (OrderPlacedDate == null) ? '' : kendo.toString(OrderPlacedDate, 'MM/dd/yyyy') #",

type: "date",

format: "{0:MM/dd/yyyy}",

filterable: true,



},

{

field: "DeliveryDate",

title: "Order Delivery Date",

template: "#= (DeliveryDate == null) ? '' : kendo.toString(DeliveryDate, 'MM/dd/yyyy') #",

type: "date",

format: "{0:MM/dd/yyyy}",

filterable: true,



},

{

field: "PlaceToDeliver",

title: "Place To Deliver",

filterable: true,



},

{

field: "Status",

title: "Status",

filterable: true,



}

　

　

　

], dataBound: function ()



{

　

if ($('#orderManagement-grid').find("tr").length==1) {

$('#orderManagement-grid').find('tbody')

.append('<tr class="kendo-data-row"><td colspan="6" style="text-align:center"><b>No Results Found!</b></td></tr>');



}

var grid = this;

grid.tbody.find('>tr').each(function(){

var dataItem = grid.dataItem(this);

if(dataItem.Status=="Order Placed")

(this).cells[7].style.color = "#bb0000";

else if(dataItem.Status=="Awaiting Approval")

(this).cells[7].style.color = "#0000FF ";

else

(this).cells[7].style.color = "#068700";



})

}

} );

function additionalData() {

return {

OrdermanagementSearch: $('#txtSearch').val(),



};

}

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

var grid = $('#orderManagement-grid').data('kendoGrid');



grid.dataSource.page(1);

return false;



});

$('#txtSearch').keydown(function (event) {

if (event.keyCode == 13) {

$("#btnSearch").click();

return false;



}

});

});

</script>