JsTree 선택에서 텍스트 필드 채우기

JSTree에서 선택한 HTML 양식을 기본 HTML 양식으로 전달하는 방법을 찾으려고합니다. (Flask & Wtforms에 의해 사용됩니다). 나는 그것을 콘솔 로그에 전달할 수 있었지만이 것을 다시 폼으로 가져 오는 방법을 모르겠습니다.JsTree 선택에서 텍스트 필드 채우기

JS에 비교적 새로운 것이므로 쉽게 해결할 수 있지만이 작업을 수행하는 방법이 매우 어렵습니다.

<label for="folderpath">Folder Path:</label> 
<input type="text" id="folderpath" name="folderpath" value=""> 
<br> 
<div id="container"></div> 

<script id="jstree1" name="jstree1"> 

    $('#container').jstree({ 

    'core': { 
     "themes": { 
       "name": "default", 
       "dots": true, 
       "icons": true 

      },   
     'data': { 
        'url': "static/JSONData.json", 
        'type': 'GET', 
        'dataType': 'JSON', 
       } 
       } 
      });var folderpath = 
     $('#container').on("changed.jstree", function (e, data) { 
     console.log(data.instance.get_selected(true)[0].text); 
}); 
</script>

편집 #folderout을 사용해 보았습니다. 그러나 input type = "text"태그를 사용할 때는 작동하지 않습니다.

<label for="folderout">Folder Path</label> 
    <input type="text" name="folderout" class="form-control" id="folderout" > 

     $("#container").on("select_node.jstree", function (evt, data) { 
     var number = data.node.text 
     $('#folderout').html(number);

출처

2016-08-26 Infinity8

$ ('# container'). ("changed.jstree", function (e, data) { 콜백 (data.instance.get_selected (true)); }); 'changed.jstree'는 이벤트 이름이며, 함수는 이벤트가 발생하는 경우 실행될 스크립트이므로, 매개 변수 'data.instance.get_selected (true)'를 사용하여 함수에서 콜백을 호출해야합니다. 현재 선택된 모든 항목 – AbhilashK

감사합니다 AbhilashK하지만 HTML 입력 유형 텍스트에 클릭 된 값을 전달해야합니다. 그 일을 어떻게 하죠? – Infinity8

내 편집을 참조하십시오. "folderout"태그를 사용하여이 작업을 시도했지만 채울 수는 없습니다. – Infinity8

<label for="folderout">Folder Path</label> 
<input type="text" name="folderout" class="form-control" id="folderout" > 

<script id="jstree1" name="jstree1"> 

           $('#container').jstree({ 
            'core': { 
             "themes": { 
              "name": "default" 
              , "dots": true 
              , "icons": true 
             } 
             , 'data': { 
              'url': "static/JSONData.json" 
              , 'type': 'GET' 
              , 'dataType': 'JSON' 
             } 
            } 
          }); 
{ /* --- THIS IS FOLDER SELECTOR FOR ID "folderout" --- */ 
$("#container").on("select_node.jstree", function (evt, data) { 
var number = data.node.text 
document.getElementById("folderout").value = number; });}; 
</script>

마지막 부분은 여기에 트릭을했다. data.node.text를 변수로 변환. 그런 다음 변수를 getElementById를 사용하여 html로 가져옵니다. 이제 노드를 클릭하면 해당 텍스트 필드가 채워집니다.

출처

2016-09-06 19:44:57 Infinity8

입력시 html을 사용했기 때문에 코드가 더 일찍 작동하지 않는 이유는 무엇입니까? 입력 태그 (및 선택)는 $ ('# folderout'). val (number)와 같이 사용할 값이 필요합니다. 다른 태그 (예 : p, div, span 등)의 경우 HTML을 통해 텍스트가 필요합니다. – AbhilashK

JsTree 선택에서 텍스트 필드 채우기

답변

관련 문제