방법: LightSwitch 응용 프로그램용 HTML 화면에 사용자 지정 컨트롤 추가
화면에서 클라이언트에 대 한 사용자 지정 HTML 컨트롤 추가 LightSwitch 응용 프로그램입니다.사용자 지정 컨트롤을 사용 하 여 표시 하거나 내장 HTML 컨트롤에 대 한의 기능을 넘어 이동 하는 방법으로 정보를 수집할 수 있습니다 LightSwitch.
사용자 지정 컨트롤 참조
화면에 사용자 지정 컨트롤을 사용 하려면 먼저 파일 참조를 프로젝트에 추가 하 고 default.htm 파일에 스크립트 태그를 추가 하는 다음 합니다.
사용자 지정 컨트롤을 참조 하려면
솔루션 탐색기, 선택 파일 보기 의 목록 도구 모음에서.
바로 가기 메뉴를 열고를 스크립트 폴더를 선택 추가, 다음 선택 기존 항목.
사용자 지정 컨트롤에 대 한 JavaScript (.js) 파일을 선택 하 고 선택 된 추가 단추.
[!참고]
일부 사용자 지정 컨트롤에도 추가 지원 파일을 참조 해야 합니다.모든 요구 사항에 대 한 사용자 지정 컨트롤의 설명서를 참조 하십시오.
에 <script> 섹션의 default.htm 파일을 프로젝트에 대해, 다음 예제와 유사한 스크립트 태그를 추가 위치 MyControl 사용자 지정 컨트롤의 이름입니다:
<script type=”text/javascript” src=”Scripts/MyControl.js” charset=”utf-8”></script>
새 컨트롤 추가 및 기존 컨트롤 교체
새 사용자 지정 컨트롤 화면에 추가 하거나 Lightswitch에서 기존 HTML 컨트롤을 바꿀 수 있습니다.
화면에 사용자 지정 컨트롤 추가
에 화면 내용 트리, 모든 그룹을 선택 합니다.
에 화면 디자이너 도구 모음에는 레이아웃 항목 추가 목록에서 선택 사용자 지정 컨트롤.
사용자 지정 컨트롤 추가 대화 상자가 열립니다.
에 지정 새 사용자 정의 컨트롤의 데이터를 텍스트 상자에서 항목 또는 컨트롤에 바인딩할 수 있는 컬렉션을 입력 합니다.
예를 들어, 입력 Customers.selectedItem.PostalCode 입력 이나 고객에 게 우편으로 Customers.selectedItem 전체 고객 레코드를 바인딩할 수 있습니다.
컨트롤의 특정 속성에 데이터를 바인딩하는 코드를 추가합니다.
자세한 내용은 에 사용자 지정 컨트롤의 속성을 데이터 바인딩 이 항목의 뒷부분에 나오는.
기존 컨트롤을 사용자 지정 컨트롤로 대체.
에 화면 내용 트리, 교체 하려는 컨트롤을 선택 합니다.
에 속성 창이 열리고는 컨트롤 형식 선택한 다음 선택 사용자 지정 컨트롤.
컨트롤의 특정 속성에 데이터를 바인딩하는 코드를 추가합니다.
자세한 내용은 에 사용자 지정 컨트롤의 속성을 데이터 바인딩 이 항목의 뒷부분에 나오는.
데이터를 사용자 지정 컨트롤의 속성에 바인딩
반드시 사용자 지정 컨트롤 추가 대화 상자에서 지정한 데이터를 사용자 지정 컨트롤의 특정 속성에 바인딩해야 합니다.
데이터를 사용자 지정 컨트롤의 속성에 바인딩하려면
에 화면 내용 트리, 사용자 지정 컨트롤을 선택 합니다.
에 속성 창에서 선택에서 렌더링 코드 편집 하이퍼링크.
코드 편집기에서 render 메서드는 다음 예제와 유사한 코드를 추가 합니다.
createMyControl(element, contentItem, “max-width: 300px; max-height: 300px”);이 코드 실행된 시 컨트롤을 렌더링합니다.대체 MyControl 를 제어 및 변경의 이름으로는 max-height 및 max-width 매개 변수를 필요에 따라.
컨트롤에 필요한 추가 기능을 위한 코드를 추가 합니다.모든 요구 사항에 대 한 사용자 지정 컨트롤의 설명서를 참조 하십시오.