2017-01-17 6 views
1

서버 요청없이 각 셀의 툴팁에 html 테이블을 추가하고 싶습니다. 검도는 API 호출과 함께이 기능을 제공합니다.api 또는 ajax없이 각 셀에 kendo 툴팁에 html 테이블을 추가하는 방법은 무엇입니까?

$(document).ready(function() { 
var tooltip = $("#target").kendoTooltip({ 
    iframe: false, 
    content: { 
    url: "*http://demos.telerik.com/kendo-ui/content/web/tooltip/ajax/ajaxContent3.html*" 
    }, 
    width: 220, 
    height: 280 
    }).data("kendoTooltip"); 
}); 

요청하지 않고 html을 추가 할 수있는 방법이 있습니까?

답변

0

툴팁의 컨텐트 구성은 URL뿐만 아니라 문자열을 받아 들일 수 있습니다. 이 문자열은 다음과 같이 HTML을 포함 할 수 있습니다 : 당신이 포함 동적 문자열을 (돌아갈 수 있도록

td { 
 
    background: red; 
 
    width: 10px; 
 
    height: 10px; 
 
}
<link href="http://kendo.cdn.telerik.com/2016.2.607/styles/kendo.mobile.all.min.css" rel="stylesheet" /> 
 
<link href="http://kendo.cdn.telerik.com/2016.2.607/styles/kendo.silver.min.css" rel="stylesheet" /> 
 
<link href="http://kendo.cdn.telerik.com/2016.2.607/styles/kendo.rtl.min.css" rel="stylesheet" /> 
 
<link href="http://kendo.cdn.telerik.com/2016.2.607/styles/kendo.common.min.css" rel="stylesheet" /> 
 

 
<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script> 
 
<script src="http://kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js"></script> 
 

 

 
<body> 
 
    <span id="target"> 
 
    Some content 
 
    </span> 
 

 
    <script> 
 
    $(document).ready(function() { 
 
     $("#target").kendoTooltip({ 
 
     content: "<table><tr><td></td><td></td></tr><tr><td></td><td></td></tr></table>" 
 
     }); 
 
    }); 
 
    </script> 
 
</body>

0

content option 또한, 대상 요소를 포함하는, 이벤트 데이터를 노출하는 기능으로 설정할 수 있습니다 예 : 대상 요소의 내용에 따라 HTML 요소 (예 : 위에서 언급 한 것처럼) :

Example