검도 그리드를 통해 뷰 모델의 데이터를 컨트롤러로 전달

Question

지금까지 kendogrid를 인스턴스화하고 내 뷰 모델의 값을 전달하려고합니다. vb.net에 대한 Telerik의 설명서에서 다음 코드를 얻었습니다. 문제는 .Grid -> "(T)의 그리드 빌더 인 public override 할 수있는 오버로드 함수 격자 (T)의 유형 매개 변수는 유추 될 수 없습니다."

Html.Kendo .Grid(). 이름 ("kendogrid")

이 오류의 의미를 모르거나 수정 방법을 모르겠습니다.

보기

$(document).ready(function() { 
    var dataSource = new kendo.data.DataSource({ 
     transport: { 
      read: { 
       url: "TestAjax", 
       dataType: "json", 
       type: "GET", 
      }, 
      update: { 
       url: "update", 
       dataType: "json", 
       type: "POST" 
      }, 
      create: { 
       url: "CreateInvoiceRecord", 
       dataType: "json", 
       type: "GET", 
      }, 
      parameterMap: function (options, operation) { 
       console.log(operation); 
       console.log(options); 
       if (operation !== "read" && options.models) { 
        return { models: kendo.stringify(options.models) }; 
       } 
      } 
     }, 
     batch: true, 
     pageSize: 20, 
     schema: { 
      model: { 
       id: "itemID", 
       fields: { 
        ItemName: { type: "string" }, 
        Amount: { type: "number", editable: false, validation: { required: true } }, 
        ProductLine: { type: "string" }, 
        Status: { type: "string" }, 
       } 
      } 
     }, 
     aggregate: [{ field: "Amount", aggregate: "sum" } 
     ] 
    }); 
    $("#kendogrid").kendoGrid({ 
     DataSource: dataSource, 
     pageable: true, 
     height: 550, 
     toolbar: ["create", "save"], 
     columns: [ 
      { field: "ItemName", title: "Item", width: "150px" }, 
      { field: "Amount", title: "Amount", format: "{0:c}", width: "100px", aggregates: ["sum"], footerTemplate: "Total Amount: #=sum#" }, 
      { field: "ProductLine", title: "Product Line", width: "150px", editor: productLineDropDownEditor}, 
      { field: "Status", title: "Status", width: "150px", editor: statusDropDownEditor }, 
      { command: "Update", title: "Update" , width:"150px"}], 
     editable: true 
     }); 
}); 

모델

Public Class MyViewModel 
    Public Property id As String 
    Public Property id2 As String 
End Class 

Answer 1

마침내 내가 만든 해킹을 사용하고 독서를 위해 아약스를 사용하고 싶었습니다. 이것이 왜 그렇게 작동하는지 완전히 확신 할 수 없으므로 좀 더 살펴볼 필요가 있습니다. kendogrid에 연결된 컨트롤러, 특히 읽기 및 만들기 작업에 매개 변수를 전달해야했습니다. 내 인덱스 컨트롤러에서 얻은 값을 저장하는 뷰 모델을 만든 다음 뷰 모델을 사용하여 kendogrid의 값을 읽기 및 작동 컨트롤러에 전달했습니다. 어떤 이유로, 나는 ajax를 사용하여 읽기 조작에만 매개 변수를 전달할 수있었습니다.

참고 : 여전히 최상의 솔루션은 아닙니다.그것은 readData 컨트롤러를 두 번 호출하고 싶지 않습니다.

자바 스크립트

<Script> 
    $(document).ready(function() { 
     var dataSource = new kendo.data.DataSource({ 
      transport: { 
       read: {  
        url: "readData", 
        dataType: "json", 
        type: "GET",     
       }, 
       create: { 
        url: "CreateInvoiceRecord?trxid=@Model.id2&bcid=@Model.id", 
        dataType: "json", 
        type: "GET", 
       }, 
       parameterMap: function (options, operation) { 
        if (operation !== "read" && options.models) { 
         return { models: kendo.stringify(options.models) }; 
        } 
       } 
      }, 
      batch: true, 
      pageSize: 20, 
      schema: { 
       model: { 
        id: "itemID", 
        fields: { 
         ItemName: { type: "string" }, 
         Amount: { type: "number", validation: { required: true } }, 
         ProductLine: { type: "string" }, 
         Status: { type: "string" } 
        } 
       } 
      }, 
      aggregate: [{ field: "Amount", aggregate: "sum" }] 
     }); 
     $("#kendogrid").kendoGrid({ 
      dataSource: dataSource, 
      navigatable: true, 
      pageable: true, 
      height: 550, 
      toolbar: ["create", "save"], 
      columns: [ 
       { field: "ItemName", title: "Item", width: "150px" }, 
       { field: "Amount", title: "Amount", format: "{0:c}", width: "100px", aggregates: ["sum"], footerTemplate: "Total Amount: #=sum#" }, 
       { field: "ProductLine", title: "Product Line", width: "150px", editor: productLineDropDownEditor}, 
       { field: "Status", title: "Status", width: "150px", editor: statusDropDownEditor }, 
       { command: "Update", title: "Update" , width:"150px"}], 
      editable: true 
     }); 
    }); 
    function productLineDropDownEditor(container, options) { 
      $('<input required name="' + options.field + '"/>') 
      .appendTo(container) 
      .kendoDropDownList({    
       autoBind: false, 
       valuePrimitive: true, 
       dataTextField: "name", 
       dataValueField: "name", 
       dataSource: { 
        transport: { 
         read: { 
          url: "/Customs/getProdLines", 
          dataType: "json" 
         } 
        }, 
        schema: { 
         data: "Data", 
         model: { 
          fields: {} 
         } 
        }, 
       } 
      }); 
    } 
    function statusDropDownEditor(container, options) { 
      var data = [ 
       { text: "Active", value: "1" }, 
       { text: "Paid", value: "2" }, 
       { text: "Cancelled", value: "3" } 
      ] 
      $('<input required name="' + options.field + '"/>') 
      .appendTo(container) 
      .kendoDropDownList({ 
       valuePrimitive: true, 
       dataTextField: "text", 
       dataValueField: "value", 
       autobind: false, 
       dataSource: data 
      }); 
    } 
    //function testAjax() {  
    //} 
    //data: { 'name': ItemName, 'amount': Amount, 'prodline': ProductLine, 'status': Status }, 
    $.ajax({ 
     type: "Get", 
     data: { id: "@Model.id", id2:"@Model.id2" }, 
     url: "readData/", 
     dataType: "json", 
     success: function (itemList) { 
      console.log(itemList); 
     } 
    }); 
</script> 

모델

Public Class MyViewModel 
    Public Property id As String 
    Public Property id2 As String 
End Class 

Answer 2

http://docs.telerik.com/kendo-ui/aspnet-mvc/vb#grid 에서 VB 그리드 구문은 다음과 같습니다

Html.Kendo().Grid(Of YourViewModelClassThatYouWantToBindTheGridTo)() _ 
    .Name("grid") _ 
    ...additional configuration. 

당신은 당신이 어떤 유형의 객체 그리드를 말할 부분을 누락 당신은 ("Of NameOfYourClass"부분에 바인딩하고 있습니다.)

전체 눈금 정의를 게시해야합니다.

또한 ... C# 구문은 훨씬 더 깨끗한 sooooo입니다 (도움이되지 않습니다).

편집

좋아, 그럼이 질문은

이 당신이 컨트롤러 방법에 전달 "추가"데이터를 가져 오는 방법입니다 .... 더 이상 올바른 VB.NET 면도기 구문이 아닙니다 데이터 소스에서 :

transport: { 
     read: { 
      url: "TestAjax", 
      dataType: "json", 
      type: "GET", 
      data: { 
       parameterToPassToReadAction: valueYouWantToPassToReadAction 
      } 
     }, 

: 당신은 객체를 사용하여 dataSource.transport.read.data 구성 ( http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-transport.read.data)

를 사용 함수를 사용하여

:

parameterToPassToReadAction는 서버 방식으로 매개 변수의 이름이고 valueYouWantToPassToReadAction이 때 페이지로드 당신이 그것을 저장 어느 곳에 저장되어 당신이 ...이 원하는 값입니다

transport: { 
     read: { 
      url: "TestAjax", 
      dataType: "json", 
      type: "GET", 
      data: extraDataFunction 
     }, 

function extraDataFunction() { 
    return { 
     parameterToPassToReadAction: valueYouWantToPassToReadAction 
    }; 
} 

. 그것은 당신의 vbhtml 파일의 뷰 모델에 당신의 자바 스크립트 같은 파일의 스크립트 블록에있는 경우, 구문은 같은 것입니다 :

function extraDataFunction() { 
    return { 
     parameterToPassToReadAction: @Model.FieldYouWantToSend 
    }; 
} 

을하지만,이 값이 저장되어있는 곳은 분명하지 않다.