MVC4의 동일한 페이지 모범 사례에서 TextBox를 사용한 Treeview (검도 UI)?

Question

원격 데이터 소스에 묶인 검도 트리 뷰가 있습니다.

@(Html.Kendo().TreeView() 
    .Name("schemas") 
    .DataTextField("name") 
    .DataSource(dataSource => dataSource.Read(read => read.Action("Schemas", "Forms"))) 
    .Events(events => events 
    .Select("onSelected"))) 

그래서 트리 뷰는 단지에 Schemas 행동에 대한 호출을 내 형태

에게 제출 단순히 텍스트 상자 및 버튼입니다 I 양식이 같은 페이지에 또한

FormsController

@using (Html.BeginForm("Load", "Forms", FormMethod.Post)) 
{ 
    <div id="rootNode"> 
     @Html.TextBox("rootElementName")    
     @Html.Button("next") 
    </div> 
} 

그래서 사용자 입력을 처리하고 의 Load 작업으로 전달하는 가장 좋은 방법은 무엇일까? 사용자는 트 리뷰의 옵션 중 하나를 선택하고 텍스트 상자에 값을 입력해야합니다. 또는 내 모든 노드가 텍스트 입력 및 선택된 노드에 대한 두 개의 추가 필드 안에있는보기 용 일종의 viewmodel을 만들어야합니까?

Answer 1

나는 떠나, 양식 요소를 꺼낼 것 :

<div id="rootNode"> 
    @Html.TextBox("rootElementName")    
    @Html.Button("next") 
</div> 

다음 JS,이 선택에 트리 항목 ID를 선택합니다. 두 번째 함수는 매개 변수를 사용하여 Form 컨트롤러 동작을 호출합니다.

<script> 
    var selectedNodeid; 

    //get the tree selected item id 
    function onSelected(e) { 
     var data = $('#schemas).data('kendoTreeView').dataItem(e.node); 
     selectedNodeid = data.id; 
    } 

    //button on click event 
    $(document).ready(function() { 
     $("#next") 
     .bind("click", function() { 
      //get parameters then pa 
      var id = selectedNodeid; 
      var rootElementName = $('#rootElementName).val() 
      $.ajax({ 
      url: "Form/Load", 
      data:{id:id,rootElementName:rootElementName}, 
      success: function() { } 
      }); 
     } 
    }) 
</script> 

테스트하지는 않았지만 가까운 날짜 여야합니다. 나는 더 나은 접근법을 추가하는 누군가를 기대합니다.