반응형 Web Front 개발공부56 자바스크립트 for-in 과 for-of 문 이런저런 프로그래밍 언어를 사용하니 가끔씩 자바에 자바스크립트 문법 쓰고 PLSQL 조건문을 다른 언어에 사용하며 많지 않은 시간을 훌쩍 보내기도 한다. 다양한 언어를 사용해 보고 경험해 보는 것도 나쁘지는 않으나 시간이 그리 많지 않은 SI에 들어가서 반나절을 어이없는 문법 실수로 보내기도 한다. 그럴 때를 대비한 나만의 포스팅 //오브젝트 형태 let person = {fname:"김", lname:"봉두" , age: 25}; //for in 문법 for(const key in person){ console.log(person[key]); } //오브젝트를 배열로 만들수도 있지 않을까? let persons = [ {fname:"김", lname:"봉두" , age: 25}, {fname:"김1",.. 2023. 7. 16. 자바스크립트 서버 통신 Ajax, fetch, axios, XMLHttpRequest 자바스크립트 서버통신 Ajax, fetch, axios,XMLHttpRequest 객체 XMLHttpRequest 객체 대부분의 웹브라우저는 서버에 데이터를 요청하기 위한 XMLHttpRequest 객체를 내장하고 있다. XMLHttpRequest 객체는 서버로부터 XML 데이터를 전송받아 처리하는데 사용된다. XMLHttpRequest 오브젝트의 개념은 원래 마이크로소프트 익스체인지 서버 2000용 아웃룩 웹 액세스의 개발자들이 만들었다. XMLHTTPRequest라는 인터페이스가 개발되어 이 개념을 사용하는 2번째 버전의 MSXML에 구현되었다. 2번째 버전의 MSXML 라이브러리는 1999년 3월 인터넷 익스플로러 5.0에 포함되었으며 MSXML 라이브러리의 XMLHTTP 래퍼를 사용하여 액티브 X.. 2023. 7. 9. 웹스퀘어 그리드 컨트롤 웹스퀘어 그리드 컨트롤이번 포스팅은 웹스퀘어 Grid 컨트롤 기능을 구현 및 알아본다. 자바스크립트 프레임워크나 라이브러리들은 대부분 그리드(grid)를 자체적으로 구현해 놓은 경우가 대다수다. 만든 이들이 다를 뿐 개념은 거의 비슷하다고 할 수 있다. 1. 공통점으로는 서버에서 가져온 데이터를 갖고 있는 객체가 있다. 2. 그리드는 html 객체다. Grid 객체가 존재한다. 3. 1과 2가 바인딩 또는 매핑 된다. 결국 서버에서 가져온 데이터 객체 + Html로 구현한 그리드 객체 두 개가 서로 매핑되어 상화보완 작용을 한다고 판단하면 된다. 이 원리를 머릿속에 이해하고 있다면 그리 어렵지 않게 제공된 API를 참고해서 일반적으로 많이 사용하는 기능을 충분히 구현할 수 있다. 이번에 구현해 볼 기능은.. 2023. 5. 14. 웹스퀘어 그리드 다이나믹콤보 SelectBox 적용해보기 웹스퀘어 그리드 다이나믹콤보 SelectBox 적용해 보기 Html Input type이 selectBox 일 경우, 간단한 프로그램일 경우는 하드코딩을 하지만, 프로젝트에서는 가능한 서버에서 code와 code_name을 읽어와서 세팅을 한다. 웹스퀘어 교육에서는 이런 거 안 알려준다. 아주 기본적인 것만 알려줄 뿐이다. 아이템 더블클릭해서 세팅하는 방법정도. 웹스퀘어 만든 회사에서 제공한 com 라이브러리에 공통코드를 다이내믹하게 가져오는 함수가 있기는 하지만, API를 통해서 구현해보려 한다. 1. 화면에 오픈될 때, 서버에서 셀렉트박스에 바인할 데이터를 통신해 온다. scwin.onpageload = function() { com.sbm.execute(sbm_dept); }; 서버 측 코드는 예제.. 2023. 5. 7. 웹스퀘어 팝업 기능 구현 websquare5 웹스퀘어 팝업 기능 구현 websquare5 이번 포스팅에서는 웹스퀘어 프레임워크에서 팝업 기능을 구현해 본다. 웹스퀘어 만든 회사에서 제공하는 com 라이브러리를 이용하면 API 예제보다는 조금 더 쉽게 구현이 가능하다. 자바스크립과 html으로 팝업을 호출하는 기능을 구현한 경험이 있다면 난이도가 그리 어렵지는 않다. 구현할 기능 1. 메인화면과 팝업 화면이 있다. 메인화면에서 텍스트 박스에서 부서명을 입력하고 팝업 버튼을 클릭하면 팝업 화면이 뜬다. 2. 팝업 화면에서는 메인화면에서 전달한 부서명 파라미터를 받아 자동으로 텍스트 박스 검색조건에 바인딩이 되고 조회 버튼을 누르면 그리드에 부서정보가 조회된다. 3. 그리드에서 원하는 부서를 더블 클릭하면 팝업이 닫히고 메인화면으로 돌아온다. 이때 팝업.. 2023. 5. 6. 웹스퀘어 그리드 부모 자식 1:N 조회 구성 웹스퀘어 그리드 부모 자식 1:N 조회 구성 부서정보가 조회되고 해당 부서에 마우스를 클릭하면 하단 사원정보 그리드에 해당 부서의 속한 사원리스트가 나오는 화면을 구성해 본다. 두 가지 방법이 존재한다. 1. 부서정보의 그리드를 클릭할 때마다 서버와 통신을 해서 사원정보를 조회하는 방법 2. 최초에 조회를 할 때, 부서정보 전체와 사원정보 전체를 모두 서버로부터 갖고 와서 사원정보를 필터 형태로 그리드에서 나타내게 하는 방법. 두 가지 방법대로 장단점이 존재하는데. 2번 방법의 경우 데이터가 많다면 문제가 된다. 데이터가 많다면 초기 로딩이 문제가 될 텐데 막상 로딩 후에는 빠르게 필터링이 된다. 1번의 경우 단점은 역시 서버와 통신이 너무 잦다는 것. 하지만 최신 정보를 가져올 수 있다. 처음에는 빠르.. 2023. 5. 5. 이전 1 2 3 4 5 6 7 ··· 10 다음 반응형
