2013-04-30 5 views
0

여러 탭이있는 응용 프로그램이 있고 코드가 .js 파일에있는 탭 중 하나에 KendoUI 그리드가 있습니다. (보기에는 div 태그가 있고 div 태그는 .js 파일의 KendoUI 그리드로 렌더링됩니다). 그것의 데이터 소스는 MVC 기반 응용 프로그램의 Model 파일에 작성된 클래스에서 값을 가져옵니다. 그리드를 편집 가능하게 만들고 다른 탭으로 이동하면서 변경 사항을 데이터 소스에 비동기 적으로 저장하려고합니다.kendoUI 그리드의 데이터 소스에 대한 변경 사항을 편집하고 저장하십시오.

<div id="example" class="k-content"> 
      <div id="grid"></div> 

div 태그가은 .js 파일에 KendoUi 그리드에 렌더링 : 이 방향으로 모든 포인터는

MVC 응용 프로그램의 뷰 파일이 포함되어 ... 좋은 것입니다. 코드는 다음과 같습니다 :

function createGrid() 
{ 
$("#grid").kendoGrid({ 
    dataSource: dataSource, 
    height: 430, 
    columns: [ 
    { field:"ProductName",title:"Product Name" }, 
    { field: "Category", title: "Category"}, 
    { field: "UnitPrice", title:"Unit Price" }, 
    editable: true 
}); 
} 
function createDataSource() 
{ 
    var dataSource = new kendo.data.DataSource({ 
    transport: { 
    read: { 
      url: BaseUrl + "/Products", //this is the action method in Controller which returns a list of Products which is hardcoded in this method itself. 
      dataType: "json" 
    }, 
    autoSync: true, 
    schema: { 
     model: { 
     id: "ProductID", 
     fields: { 
     ProductID: { editable: false, nullable: true }, 
     ProductName: { validation: { required: true } }, 
     Category: { defaultValue: { CategoryID: 1, CategoryName: "Beverages"} }, 
     UnitPrice: { type: "number", validation: { required: true, min: 1} } 
    } 
    } 
    } 
}); 
} 

클릭하면 createDataSource() 및 createGrid() 함수가 호출됩니다. 다른 탭에서 클릭하면이 편집 가능한 표에서 변경 한 내용을 데이터 소스에 저장하고 싶습니다.

답변

1

데이터 소스의 sync 메서드는 원격 서비스에 요청하여 변경 한 내용을 저장합니다. 다른 탭으로 이동할 때 호출해야합니다.

+0

autoSync : true를 시도했지만 값을 저장하지 않았습니다. – sandy

+0

코드를 보지 않으면 더 이상 도울 수 없습니다. –

+0

코드를 포함하도록 게시물을 편집했습니다. – sandy

1

다음과 같이 전송 객체에 update 메소드를 지정해야합니다.

update: BaseUrl + "/UpdateProducts", 

또는 원하는 경우;

update: { 
    url: BaseUrl + "/UpdateProducts" 
}, 
관련 문제