728x90
반응형
728x90
반응형
728x90
반응형
1
2
3
4
$("#table").on('click''tbody tr'function () {
    var row = $("#table").DataTable().row($(this)).data();
    console.log(row);
});
cs

 

 

 

# 관련글

[jQuery DataTable] table paging 적용 : https://deonggi.tistory.com/98

[jQuery DataTable] work page reload : https://deonggi.tistory.com/101

 

 

728x90
반응형
728x90
반응형

1. ajax으로 json 형태의 데이터를 보낼때 

에러 : org.springframework.web.HttpMediaTypeNotSupportedException: Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supported

javascript 소스의 ajax에 contentType: 'application/json' 추가

 

2. javascript ajax에서 form의 데이터를 json으로 보내야 할때

에러 : org.springframework.http.converter.HttpMessageNotReadableException: JSON parse error: Unrecognized token 'page': was expecting (JSON String, Number, Array, Object or token 'null', 'true' or 'false'); nested exception is com.fasterxml.jackson.core.JsonParseException: Unrecognized token 'page': was expecting (JSON String, Number, Array, Object or token 'null', 'true' or 'false')

 

JavaScript Ajax JSON parse error

Spring Controller와 통신하는 Ajax JSON parse error 고치기!

velog.io

 

jquery form serialize 를 이용하여 json으로 만들기

jquery 에서 form serialize를 이용하여 json 을 만들수 있습니다. 먼저 serialize 에 대해서 간단히 설명하겠습니다. serialize 함수는 2개가 있습니다. 첫번째로 serialize() 입니다. URL-encoded 표기법으로 fo..

cofs.tistory.com

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
/**
 * form 데이터를 json으로 변환
* 사용방법 : JSON.stringify( $("#WRITE_FORM").serializeObject())
 * 출처: https://cofs.tistory.com/184 [CofS]
 */
jQuery.fn.serializeObject = function() {
    var obj = null;
    try {
        if (this[0].tagName && this[0].tagName.toUpperCase() == "FORM") {
            var arr = this.serializeArray();
            if (arr) {
                obj = {};
                jQuery.each(arr, function() {
                    obj[this.name= this.value;
                });
            }//if ( arr ) {
        }
    } catch (e) {
        alert(e.message);
    } finally {
    }
 
    return obj;
};
 
cs

 

3. spring boot에서 리턴 할때 발생한 에러

에러 : HttpMessageNotWritableException: No converter for with preset Content-Type 'null'

 

HttpMessageNotWritableException: No converter for [VO Class] with preset Content-Type 'null'] | ThinkGround

안녕하세요. No converter for [VO Class] with preset Content-Type 'null'] 오류와 관련된 해결 포스트입니다. Spring은 기본적으로 MessageConvertor가 탑재되어 있습니다.

thinkground.studio

위 링크의 정보를 참고해서 리턴 class에 @JsonInclude(JsonInclude.Include.NON_NULL) 를 추가하고 해결됐다.

에러 메시지를 메모해 두기 위해 다시 소스를 원상복구 후 실행 했을때는 에러가 나지는 않았다. ㅡㅡ?? 응??

현재는 위 내용을 제거하고 실행하고 있지만 에러가 없는 상태.

 

 

4. 파일을 전송하기 위한 ajax에서 발생

에러 : java.lang.IllegalStateException: Current request is not of type [org.springframework.web.multipart.MultipartHttpServletRequest]: ServletWebRequest: uri=/bbs/ajax/insert;client=0:0:0:0:0:0:0:1;session=01C5D81F89E59ACA7C2BEE397A35A677

 

ajax 호출을 받는 controller에서 MultipartHttpServletRequest가 누락된 경우 발생한다.

 

728x90
반응형
728x90
반응형

1. string 타입의 값을 객체에 key로 만들고 싶다.

1
2
3
4
5
6
7
var arrKey = ['k1''k2''k3'];
var arrVal = ['abc'120'000'];
 
var kkk = new Object();
kkk[arrKey[0]] = arrVal[0];
kkk[arrKey[1]] = arrVal[1];
kkk[arrKey[2]] = arrVal[2];
cs

 

 

크롬 console 창에서 실행 결과 1

 

 

 

2. 해당 키값이 있나 확인하고 싶다.

1
2
3
4
5
6
7
8
9
10
11
console.log('k1' in kkk); // true
console.log('k9' in kkk); // false
 
kkk.k8 = {
    q1 : 'qeg',
    q2 : 141,
    q3 : 'gkgk'
};
 
console.log('q1' in kkk); // false
console.log('q1' in kkk.k8); // true
cs

 

 

크롬 console 창에서 실행 결과 2

 

 

3. 간단한 오브젝트 함수

1
2
3
4
var objTemp = {name : 'kim', age : 22, height : 175};
Object.entries(objTemp);
Object.keys(objTemp);
Object.values(objTemp);
cs

 

4. object 에 객체 붙이기

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

 

Object.assign() - JavaScript | MDN

Object.assign() 메서드는 출처 객체들의 모든 열거 가능한 자체 속성을 복사해 대상 객체에 붙여넣습니다. 그 후 대상 객체를 반환합니다.

developer.mozilla.org

 

 

 

 

 

 

 

 

 

.

728x90
반응형
728x90
반응형
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!-- ASP 코드의 include -->
<!-- 상대경로 -->
<!--#include file="/second.html"-->
<!-- 절대경로-->
<!--#include virtual="/main/second.html"-->
 
<!-- PHP 코드의 include -->
<?
    include_once $_SERVER["DOCUMENT_ROOT"].'/main/second.html';
?>
 
<!-- javascript 코드의 include -->
<script>
    // 상대주소
    document.location.href="second.html";
    // 절대주소
    document.location.href="../main/second.html";
</script>
 
<!-- HTML 코드의 include -->
<!-- 절대주소 -->
<link rel="stylesheet" href="../main/second.html">
cs
728x90
반응형
728x90
반응형

기존에 썼던 코드를 그대로 가져와서 적은거라 좀 장황한데

 

# 셈플1

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
function AddCareerLine(){
    var cnt = $('.career').length;
 
    // textarea 추가
    var nCareer = document.createElement("textarea");
    var sName = 'careerList['+ cnt +'].career';
    var sId = 'career'+cnt;
    nCareer.setAttribute("rows"3);
    nCareer.setAttribute("cols"120);
    nCareer.setAttribute("name", sName);
    nCareer.setAttribute("id", sId);
    nCareer.setAttribute("class""career");
    document.getElementById("tchrCreear").appendChild(nCareer);
 
    // 줄바꿈
    var tagBr = document.createElement("br");
    document.getElementById("tchrCreear").appendChild(tagBr);
}
 
function DeleteCareerLine(){
    var cnt = $('.career').length;
 
    // textarea가 2개 이상인 경우 마지막 textarea를 삭제
    if (cnt > 1) {
        var sId = 'career' + (cnt-1);
        $('#'+sId).remove();
    }else {
        console.log('textarea count : 1');
    }
}
cs

 

javascript로 만드는 건데

태그를 만들고 var nCareer = document.createElement("textarea");

태그의 속성을 지정한다 nCareer.setAttribute("rows"3);

마지막으로 특정 태그 하위에 자식으로 넣어준다. document.getElementById("tchrCreear").appendChild(nCareer);

삭제는 jquery를 썼는데 이렇게 삭제한다. $('#'+sId).remove();

 

 

# 셈플2

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// 재료 입력 div 추가
function addMaterialfrm(){
    
    var addIndex = $("#main_nextIndex").val();
    $("#main_nextIndex").val(Number(addIndex) + 1 );
 
    var addDivTag = "<div id='main_div_" + addIndex + "' style='margin-bottom: 5px;'>";
    addDivTag += "<input type='text' name='main[" + addIndex + "].mtrlNm' id='main[" + addIndex + "].mtrlNm' placeholder='재료명' style='width:250px;margin-right: 22px;'>";
    addDivTag += "<input type='text' name='main[" +addIndex + "].qty' id='main[" + addIndex + "].qty' placeholder='수랑' style='width:250px;margin-right:5px;'>";
    addDivTag += "<input type='hidden' name='main[" +addIndex + "].mtrlSeq' id='main[" + addIndex + "].mtrlSeq' value='0'/>";
    addDivTag += "<input type='hidden' name='main[" +addIndex + "].mtrlTp' id='main[" + addIndex + "].mtrlTp' value='main'/>";
    addDivTag += "<button type='button' class='btn btn-danger btn-sm' onclick='delMaterialfrm(`main`, " + addIndex +")'><i class='glyphicon glyphicon-minus'></i></button>";
    addDivTag += "</div>";
 
    $("#main_span").append(addDivTag);
 
}
// 재료 입력 div 삭제
function delMaterialfrm(id){
 
    var delDivId = "main_div_" + id;
    $("#"+delDivId).remove();
 
}
cs

 

이건 그냥 스트링으로 하나하나 써서 만든 경우.

복잡해 보이지만 사실 간단한 내용으로 스트링으로 태그를 모두 작성하고

마지막에 jquery로 특정 태그 하위에 추가한다. $("#main_span").append(addDivTag);

 

* 관련글

[javascript, jquery] 동적 tag 추가시 이벤트 : https://deonggi.tistory.com/119

 

 

728x90
반응형

'코딩 삽질' 카테고리의 다른 글

[oracle] link db  (0) 2019.11.17
[git] remote 추가  (0) 2019.11.17
[javascript] ckeditor 유효성 체크  (0) 2019.11.06
[메모] 네이버 클라우드 서버 - 윈도우 서버 세팅  (0) 2019.11.06
[tomcat] memory leak 에러  (0) 2019.11.05
728x90
반응형
1
2
3
4
5
6
7
// 입력 내용 받기 = CKEDITOR.instances.textarea태그의id.getData();
if(CKEDITOR.instances.cntnt.getData() =='' 
        || CKEDITOR.instances.cntnt.getData().length ==0){
    alert("내용을 입력해주세요.");
    $("#cntnt").focus();
    return false;
}
cs

 

출처 : https://stackoverrun.com/ko/q/11691633

 

728x90
반응형
728x90
반응형

thymeleaf 3.0.10 이상을 사용하는 html에서 javascript 함수에 인수를 전달할때

 

기존에는 이렇게 작성했다.

1
<a href="#" th:onclick="${'writeProc('+ detailVO.itemSeq+')'}">Delete</a>
cs

 

하지만 아래와 같은 에러 메시지가 나온다.

 

org.thymeleaf.exceptions.TemplateProcessingException: Only variable expressions returning numbers or booleans are allowed in this context, any other datatypes are not trusted in the context of this expression, including Strings or any other object that could be rendered as a text literal. A typical case is HTML attributes for event handlers (e.g. "onload"), in which textual data from variables should better be output to "data-*" attributes and then read from the event handler.

 

그래서 thymeleaf 3.0.10 이상에서는 이렇게 바꿔야 한다.

1
<a href="#" th:onclick="writeProc( [[${detailVO.itemSeq]] )">Delete</a>
cs

 

함수 호출 부분이 보기에 좀더 직관적이라 좋다.

 

 

 

출처 : https://codeday.me/ko/qa/20190702/944892.html

728x90
반응형

+ Recent posts