반응형

javascript 13

[JS]DATATABLE AJAX를 통한 새로운 값 변경하기.

버튼 클릭할 경우 해당 기간에 맞춰 동적으로 DataTable을 변경하는 기능이 필요했다. 코드는 기존에 작성했던대로 사용했으면 됐으나 기존 값이 있는 경우 새로 갱신이 되지 않았다. 2021.11.03 - [취업/Datatable] - [PHP] DATATABLE AJAX 통신하기2. [PHP] DATATABLE AJAX 통신하기2. https://kasumil.tistory.com/196 이전편에서 해당 내용을 언급했었다. 하지만, 해당 부분은 완벽하지 않았다. DB값에서 온 것을 바로 넣는 수준이었기때문에 그러하다. 응답 값을 수정하지 못 했으니까! kasumil.tistory.com 그래서 찾아보니 datatable을 destroy해라 이것을 사용해도 된다. 그런데, ui가 깨지는 문제가 발생하더..

취업/Datatable 2022.08.23

[ci4] DataTable 서버-사이드 Server-side Processing

데이터 테이블을 구현하는데 있어 서버사이드 기능이 필요했다. 프론트만 쓰면 좋지만, 이게 5천개가 넘어간 순간 1분이 넘게 로딩된다... 그래서 이전에는 구현하지 못했지만, 이번에 구현하게 되었다. 아래 테이블 컬럼들은 의미 없는 데이터입니다. // front.js 네트워크 통신시 전달되는 데이터 값. draw: 3 columns[0][data]: 0 columns[0][name]: columns[0][searchable]: true columns[0][orderable]: true columns[0][search][value]: columns[0][search][regex]: false columns[1][data]: 1 columns[1][name]: columns[1][searchable]: tru..

취업/CodeIgniter 2022.07.15

[JS] 프리티포토 모바일 크기 수정하기.

워드프레스 라이브러리 같은데, 엄청 오래된 라이브러리다. 아마도 수정이 되어야 했을 거 같은데 안되어서...그냥 있는 버그였다. jquery.prettyPhoto.js 파일에서 코드 난독화를 제거하고, imageWidth, imageHeight를 찾아보면 -200을 수정해야한다. 예쁜 사진에서 같은 문제가 발생했고 rafael.dev에서 게시한 것과 동일한 CSS 코드 수정 사항을 찾았습니다. 다만, 이전 버튼과 다음 버튼이 사라지고 스타일이 정말 이상해서 여전히 좋지 않은 것 같습니다. 크기 조정 계산으로 인해 문제가 발생한 것 같아서 js 소스에서 크기 조정 기능의 스니펫을 찾으려고 하면 아래와 같이 쉽게 솔루션을 얻을 수 있습니다. 저는 3.1.6 버전을 사용하고 있습니다 _fitToViewport..

[php] 자동 개행, 줄바꿈, \n 기능 실행하기

nl2br 함수 자바스크립트에선 동일하게 작동되는 내장함수가 없으므로 만들어줘야한다. 원래 replace는 알고 있었는데, 글쓰려고 찾아보니 누가 만들어놓은 함수가 있더라. 자바스크립트 함수 출처는 요기 https://ezcode.tistory.com/51 [Js] php의 nl2br과 같은 기능의 javascript textarea 같은 개행이 가능한 데이터를 개행처리하고자 할때 대부분은 php의 nl2br함수를 사용한다. 하지만 부득이하게도 javascript 로 처리해야 한다면 아래의 function을 정의하고 사용하자. ezcode.tistory.com

취업/PHP 2022.06.10

[메타마스크] React 메타마스크 앱 브라우저 구동 테스트

간단하게 메타마스크 내에서 굴러가는 부분을 구현하기 위해서 React로 해당 부분을 구현해보았다. 목적: 로그인 값이라던가 프론트 세션스토리지와 쿠키값 소실 여부를 체크하기 위함. 로그인 인증방식에는 세션 기반과 토큰 기반으로 구성되는데, php로 접속시 헤더값인 세션이 삭제되어 로그인 유지가 안되는 끊김이 생기는 문제가 발생하고 있었다. 그래서 React 세션스토리지 저장과 쿠키값 저장을 구현해보았더니 잘되네.. 서버 통신해서 success를 주기로 구성해놨더니 그 값을 잘 받아와서 저장하더라. 이번에 기능을 구현하면서 발견한 점이 React에선 내부 통신이 안된는 것 같더라. php는 내부 통신을 통해서 해당 Controllers에 접근하여 외부 통신을 다르게 하고, 호출시 아예 도메인을 분리하여 사..

취업/Metamask 2022.05.16

[php]간단하게 장바구니 기능 만들기

리액트나 뭐나 어차피 내용은 같다. 그냥 배열 하나 만들고, 그곳에 해당 정보를 넣어준 뒤 그것을 화면에 뿌려주는 것. 이렇게 왜 하냐고? 나중에 까먹을까봐... 구조는 겁나 간단하다. 내 경우 셀렉트 박스로 해당 제품을 선택하는 것이라 그러한 셀렉트 박스의 선택에 따라서 해당 bind된 값이 들어오면 그것을 넣어주면 되는 것이었다. 상태 관리 라이브러리인 리덕스도 배열 갖고 장난치는건데, 그냥 어디든지 접속가능하냐 못하느냐 이것 차이. 한번 수정했는데, 작성했다가 보니 splice를 사용할 경우 없어져야 하는 대상만 배열에 남는 문제가 생겨서, filter 함수로 교체했다. 안쓰던 map 함수의 idx 매개변수도 삭제하고. let cart = []; $(`.셀렉트박스`).change(function()..

취업/PHP 2022.03.29

php 배열로 만들어 자바스크립트 단에 객체 전달하기(feat. excel변환)

오늘의 후기. 서버 두번 뻗게 만들어서 한소리 들었다. PHP 문제부분이 기존에는 백엔드 측에서 데이터를 만들어서 줬는데, 이번에는 SQL문 자체를 가져와 내가 배열->객체로 넘겨주는 부분에서 발생했다. 원래는 dataTable을 사용하여 해당 부분을 sheet.js를 통해서 excel을 만들었는데, 테이블 보이는 게 10개고 실제 1,2,3페이지 이렇게 구성되어 있으면 보이는 10개만 excel 파일로 만들어주는 것이 문제였다. 원인은 3번 예시인 html table를 사용했더니 발생한 문제였다. 말 그대로 화면에 보여지는 부분이 10개니 그냥 tag에서 10개만 있다고 뽑아오는 것이 문제. 이름 CP 망나뇽 4000 마기라스 3900 해피너스 3800 파일 내보내기(HTML TABLE) : https..

취업/PHP 2021.07.22

React Native 스니펫 특정용어 자동완성 확장프로그램.

https://marketplace.visualstudio.com/items?itemName=jundat95.react-native-snippet React Native Snippet - Visual Studio Marketplace Extension for Visual Studio Code - React Native, Typescript React Native, StyleSheet, Redux Snippet marketplace.visualstudio.com 원래는 스니펫을 일일히 설정해줘야하는데, 귀-찮. 누가 이걸 vscode 확장 프로그램으로 만들어놨다. 이것이 누군가에게는 쓸모없을지라도여러 개의 반복되는 것을 치는 것은 매우 귀찮다. Console clg→ console.log(object) c..

코딩/vscode 2021.07.19

비밀번호 정규식 일치여부 확인 방법

1 2 3 4 5 6 7 8 9 // id 체크 정규식 : 숫자, 영문만 입력 가능 var regExpId = /^[0-9a-z]+$/; // 비밀번호 규칙 정규식 // : 숫자, 특문 각 1회 이상, 영문은 2개 이상 사용하여 8자리 이상 입력 var regExpPw = /(?=.*[A-Za-z])(?=.*\d)(?=.*[@$!%*#?&])[A-Za-z\d@$!%*#?&]{8,}$/; // 이메일주소 형식 체크 정규식 var regExpEm = /^[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*\.[a-zA-Z]{2,3}$/i; 흔하게 보는 비밀번호 정규식이다. 8글자 이상 kisa가 지키라고 권고한 8글자 이상 비밀번호 정규식이다...

728x90