찰떡개발자 코딩

프론트단을 만지다 보면 List를 받아서 화면에서 사용해야 할 경우가온다. 가끔 List내에서 id라던지, TypeCode 같은 Vo들이 공통적으로 묶일수있는 값을 갖고 있을때가 있다. 이때 예를 들어, ID를 중복 제거 해서 사용하고 싶다? 했을때 사용하기 유용한 것 같고, 다른 팀원들도 사용할 일이 있을것 같아 util로 정리해 놓았다. filter와 findIndex를 통해 중복 제거했다. function removeDuplicateVoList(list,duplicate) { var result = list.filter(function(item1, idx1){ return list.findIndex(function(item2, idx){ return item1[duplicate] == item2[d..

Vo List를 서버단에서 받아 화면에서 사용할때, 특정 변수를 기준으로 중복제거를 하고싶을때가 있을것이다. 항상 for문을 돌리고, include를 쓰고 이것저것 많이 했었는데, 이번에는 filter와 findIndex를 사용하여 중복 제거를 해보았다. 자주 사용될것 같아 정리..! 방법 : var voGroupList = voList.filter(function(item1, idx1){ return voList.findIndex(function(item2, idx){ return item1.voId == item2.voId }) == idx1; }); item1 / item2 = vo 객체 idx1, idx2 = 인덱스

간단하지만 또 검색해서 찾기 힘든것들을 지속적으로 올리는중...! 본인은 여러개의 아이콘중에 한 아이콘을 클릭했을때, 아이콘들을 수정할 수 있는 팝업창을 띄우고,(그 팝업창에는 아이콘들을 한번에 수정할 수 있다) 해당 아이콘의 수정위치까지 자동으로 스크롤이 내려가도록 설정하였다. 해당 코드는 간단하다. function movePopupScrollByItemIndex(index){ var offset = $("아이콘").eq(아이콘index).position(); //해당 아이콘의 위치를 찾는다. var bodyHeight = $("아이콘List를 감싸는 DIV").outerHeight(); //전체 Div의 높이 var cardBodyPadding = parseInt($("아이콘List를 감싸는 DIV"..

파일 업로드를 사용할때 자주쓸만한 Validation 적어놔야지 /**Img Video Validation-START**/ function getExtension(filename) { var parts = filename.split('.'); return parts[parts.length - 1]; } function isImage(filename) { var ext = getExtension(filename); switch (ext.toLowerCase()) { case 'jpg': case 'gif': case 'bmp': case 'png': //etc return true; } return false; } function isVideo(filename) { var ext = getExtension..

저장/ 일괄삭제 버튼을 쇼핑몰 카트 처럼 따라다니게 만들어야했다. 스크롤의 위치를 이용하여 박스를 옮기는 방식. 사용자가 원하는 설정만 입력하면 바로 사용가능. 1. javascript.Js $(function(){ var $win = $(window); var top = $(window).scrollTop(); // 현재 스크롤바의 위치값을 반환 /*사용자 설정 값 시작*/ var speed = 500; // 따라다닐 속도 : "slow", "normal", or "fast" or numeric(단위:msec) var easing = 'linear'; // 따라다니는 방법 기본 두가지 linear, swing var $layer = $('.save-delete-btn-div'); // 레이어 셀렉팅 v..

우선 나는 Tree구조로 되어있는 Menu를 만들때 Javascript의 Object는 순서가 보장되지 않는다는것을 알았다. DB에서부터 정렬을 잘 해서 Javascript로 받고, Javascript에서 Tree구조를 만들때 발생한 상황이다. 예를들어 원하는 순서는 1,2,3,4,5 => 입력된 순서라고하면 Javascript Object를 사용해 For문을 돌리고 Tree구조를 만들때 2,1,3,4,5 이런식으로 순서가 섞이는 상황이 발생하였다. 이에 해결방안으로 Tree구조를 만들고, 내가 원하는 특정 키로 Sort하는 방식을 사용했다. function convertMenuTree(arr) { var tree = [], mappedArr = {}, arrElem, mappedElem; for(var..

javascript.js 정규표현식이 계속 바뀔수 있으므로 확인해서 사용하기바란다. //YoutubeLink validation check function checkLink(){ var link = $("input[name=youtubeLink]").val(); $("#link").val(); if(link){ var p = /^(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((\w|-){11})(?:\S+)?$/; if(!link.match(p)){ alert("YOUTUBE 링크를 확인해주세요"); $("input[name=youtubeLink]").focus(); return; ..

1). prototype.메소드 __proto__ : 자신을 만들어낸 객체의 원형과 연결된 속성. constructor : 생성자로써, 자신을 만들어낸 객체와 연결된 속성. prototype : 자신을 원형으로 만들어진 새로운 객체들과 연결된 속성. bab의 Prototype은 bab의 생성 당시 정보를 가진 새로운 객체를 복제하여 만들어진다. prototype 프로퍼티와 연결된 Prototype Object 는 bab 함수를 통해 생성되는 객체들의 원형이 되는 것이다. bab.hello는 bab의 원형에 접근하지 않았기 때문에 bab의 hello는 변경되지않은 상태의 원형으로 b1= new bab()에서 복사를 하게 된다. 그래서 => b1.hello(); 는 hello가 나오게 되지만 bab.hell..

1). 첫번째 방법( Array 객체사용) Json Array로 사용할 Array 객체를 만든다. (var jsonArray = new Array();) Json Object(객체)로 사용할 객체를 만든다. (var json = new Object();) .push(); 메소드를 사용하여 Array객체에 담는다. Javascript 객체(Array포함)를 JSON 문자열화 시켜서 사용한다. (JSON.stringify(jsonArray) function makeJsonArray() { var jsonArray = new Array(); var json = new Object(); let companyId = $("#companyId"); //가져올값 $("필요위치").each(function() { va..

1). Jsp 등원 하원 2). javascript.js .is(":checked") 메소드를 사용하여 현재 체크되있는지 값을 확인 할수 있다. if($("input:checkbox[id='bus_in']").is(":checked")){ alert($(this).attr('id')+": checked") } CheckBox를 사용할때 attr과 prop 옵션 두가지를 사용하여 handling 할 수있다. .attr("checked" , true); 를 사용하여 Attribute를 변경하여 check 상태를 Control 할 수 있다. 하지만 checked옵션만으로는 화면상 체크가 되어있는지는 표시가 되지않음을 유의하라 attr은 값을 뽑아내고 싶을때 사용하면 될것이다. //속성값에 checked 표시 ..