Fatal Error : Could not extract a stage height from the CSS. Taced height

 - 해당 Gelleria의 CSS 부분을 선언을 안할시 나오는 에러이다.

아래 css 추가하여 에러 해결 ~







1
2
3
4
5
6
#galleria{height:250px;overflow: hidden;} 
#galleria2{height:250px;overflow: hidden;} 
.galleria-container{background-color: white;} 
.galleria-stage{bottom:10px;} 
.galleria-thumbnails-container{display: none;
 
cs


<h2>fmt 의 number 태그를 이용한 숫자 포맷팅 예제.</h2>
<c:set var="price" value="10000" />
<fmt:formatNumber value="${price }" type="number" var="numberType" />
통화로 표현 시 : <fmt:formatNumber type="currency" currencySymbol="₩" 
value="${price }" /><br />
퍼센트로 표현 시 : <fmt:formatNumber value="${price }" type="percent" 
groupingUsed="false" /><br />
일반 숫자로 표현 시 : ${numberType }



<c:if test="${data.ruser+0 >= data.muser+0}" >Y</c:if>


출처 :  https://okky.kr/article/215928


==========================


fmt로 선언하여 빼거나 아니며 해당 비교문에 +0만 더하여 숫자로 치환하여 비교

아니면 

var a = '<c:out vlaue="${List.sum}'>;

으로 선언하여

자바스크립내에서 처리

 if(a <=100){

   alert('a'는 100보다 작아야만 함!!);

}


참고 JSTL 비교식

== is JSTL eq  
!=  is JSTL ne 
<   is JSTL lt 
>   is JSTL gt 
<= is JSTL le 
>= is JSTL ge



ightbox 또는fancy box 에서 화면전환시 위치 고정


trasitionIn: elastic -=> none

transitionout : elsatic => none



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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
 b.fn.fancybox.defaults = {
        padding: 10,
        margin: 40,
        opacity: false,
        modal: false,
        cyclic: true,
        scrolling: "auto",
        width: 560,
        height: 340,
        autoScale: true,
        autoDimensions: true,
        centerOnScroll: false,
        ajax: {},
        swf: {
            wmode: "transparent"
        },
        hideOnOverlayClick: true,
        hideOnContentClick: false,
        overlayShow: true,
        overlayOpacity: 0.7,
        overlayColor: "#777",
        titleShow: true,
        titlePosition: "float",
        titleFormat: null,
        titleFromAlt: false,
        transitionIn: "fade",
        transitionOut: "fade",
        speedIn: 300,
        speedOut: 300,
        changeSpeed: 300,
        changeFade: "fast",
        easingIn: "swing",
        easingOut: "swing",
        showCloseButton: true,
        showNavArrows: true,//화살표 표시
        enableEscapeButton: false,
        enableKeyboardNav: true,
        onStart: function() {},
        onCancel: function() {},
        onComplete: function() {},
        onCleanup: function() {},
        onClosed: function() {},
        onError: function() {}
    };
cs


해당 옵션중에 Cycle이 기본적으로 default로 되어 있는데 이부분을 true로 주고


원래 이미지가 끝날때 마다 if 조건문 주던 부분을 지우고

아이콘을 보여주는걸로 수정하면된다.




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
31
32
 Y = function() {
            if (d.enableEscapeButton || d.enableKeyboardNav) b(document).bind("keydown.fb"function(a) {
                if (a.keyCode == 27 && d.enableEscapeButton) {
                    a.preventDefault();
                    b.fancybox.close()
                } else if ( (a.keyCode == 37 || a.keyCode == 39&& d.enableKeyboardNav && a.target.tagName !== "INPUT" && a.target.tagName !== "TEXTAREA" && a.target.tagName !== "SELECT") {
                    a.preventDefault();
                    b.fancybox[a.keyCode == 37 ? "prev" : "next"]()
                }
            });
            if (d.showNavArrows) {
                //#fancybox-left-ico, #fancybox-right-ico css로 위치조정
                if (d.cyclic && l.length > 1 || p !== 0){
                    if( p == l.length-1){
                        //공정화면에서 맨마지막 사진일때 list 처음으로~
                        p = -1;
                    }
                    z.show();
                }
                if (d.cyclic && l.length > 1 || p != l.length - 1){
                    if(p == 0 ){
                        //공정화면에서 처음사진일때  list left click, right click
                        p = l.length;
                        z.show();
                    }//if
                    A.show();
                } 
            } else {
                z.hide();
                A.hide()
            }
        },
cs

삽질했던 나의 코드를~~

1
2
3
4
5
6
7
8
9
10
11
12
13
14
= function() {
            if (d.enableEscapeButton || d.enableKeyboardNav) b(document).bind("keydown.fb"function(a) {
                if (a.keyCode == 27 && d.enableEscapeButton) {
                    a.preventDefault();
                    b.fancybox.close()
                } else if ( (a.keyCode == 37 || a.keyCode == 39&& d.enableKeyboardNav && a.target.tagName !== "INPUT" && a.target.tagName !== "TEXTAREA" && a.target.tagName !== "SELECT") {
                    a.preventDefault();
                    b.fancybox[a.keyCode == 37 ? "prev" : "next"]()
                }
            });
                //#fancybox-left-ico, #fancybox-right-ico css로 위치조정
                z.show();
                A.show()
        },
cs




설정을 바꾼후 테스트 하러 ㄱㄱ~~







1
2
3
4
5
6
7
8
/*!
 * jQuery Mousewheel 3.1.13
 *
 * Copyright 2015 jQuery Foundation and other contributors
 * Released under the MIT license.
 */
!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof exports?module.exports=a:a(jQuery)}(function(a){function b(b){var g=b||window.event,h=i.call(arguments,1),j=0,l=0,m=0,n=0,o=0,p=0;if(b=a.event.fix(g),b.type="mousewheel","detail"in g&&(m=-1*g.detail),"wheelDelta"in g&&(m=g.wheelDelta),"wheelDeltaY"in g&&(m=g.wheelDeltaY),"wheelDeltaX"in g&&(l=-1*g.wheelDeltaX),"axis"in g&&g.axis===g.HORIZONTAL_AXIS&&(l=-1*m,m=0),j=0===m?l:m,"deltaY"in g&&(m=-1*g.deltaY,j=m),"deltaX"in g&&(l=g.deltaX,0===m&&(j=-1*l)),0!==m||0!==l){if(1===g.deltaMode){var q=a.data(this,"mousewheel-line-height");j*=q,m*=q,l*=q}else if(2===g.deltaMode){var r=a.data(this,"mousewheel-page-height");j*=r,m*=r,l*=r}if(n=Math.max(Math.abs(m),Math.abs(l)),(!f||f>n)&&(f=n,d(g,n)&&(f/=40)),d(g,n)&&(j/=40,l/=40,m/=40),j=Math[j>=1?"floor":"ceil"](j/f),l=Math[l>=1?"floor":"ceil"](l/f),m=Math[m>=1?"floor":"ceil"](m/f),k.settings.normalizeOffset&&this.getBoundingClientRect){var s=this.getBoundingClientRect();o=b.clientX-s.left,p=b.clientY-s.top}return b.deltaX=l,b.deltaY=m,b.deltaFactor=f,b.offsetX=o,b.offsetY=p,b.deltaMode=0,h.unshift(b,j,l,m),e&&clearTimeout(e),e=setTimeout(c,200),(a.event.dispatch||a.event.handle).apply(this,h)}}function c(){f=null}function d(a,b){return k.settings.adjustOldDeltas&&"mousewheel"===a.type&&b%120===0}var e,f,g=["wheel","mousewheel","DOMMouseScroll","MozMousePixelScroll"],h="onwheel"in document||document.documentMode>=9?["wheel"]:["mousewheel","DomMouseScroll","MozMousePixelScroll"],i=Array.prototype.slice;if(a.event.fixHooks)for(var j=g.length;j;)a.event.fixHooks[g[--j]]=a.event.mouseHooks;var k=a.event.special.mousewheel={version:"3.1.12",setup:function(){if(this.addEventListener)for(var c=h.length;c;)this.addEventListener(h[--c],b,!1);else this.onmousewheel=b;a.data(this,"mousewheel-line-height",k.getLineHeight(this)),a.data(this,"mousewheel-page-height",k.getPageHeight(this))},teardown:function(){if(this.removeEventListener)for(var c=h.length;c;)this.removeEventListener(h[--c],b,!1);else this.onmousewheel=null;a.removeData(this,"mousewheel-line-height"),a.removeData(this,"mousewheel-page-height")},getLineHeight:function(b){var c=a(b),d=c["offsetParent"in a.fn?"offsetParent":"parent"]();return d.length||(d=a("body")),parseInt(d.css("fontSize"),10)||parseInt(c.css("fontSize"),10)||16},getPageHeight:function(b){return a(b).height()},settings:{adjustOldDeltas:!0,normalizeOffset:!0}};a.fn.extend({mousewheel:function(a){return a?this.bind("mousewheel",a):this.trigger("mousewheel")},unmousewheel:function(a){return this.unbind("mousewheel",a)}})});
cs



 

해당 js 파일처럼 압축되어진 형태의 플러그인을 쓰게 되는데

하다보면 css 부분이라던가 약간의 부분을 수정해야할 상황이 온다.


그럴경우 http://jsbeautifier.org/


해당 사이트 가서 압축을 풀어 수정할수 있다.!!








해당 압축된 js를 복붙하여 붙힌후 'Beautify Javascirpt or HTML ' 버튼을 클릭하여 풀어진 js 파일을 복사하여


코딩을 하자!


 

저장시

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
function cmdSave(){
        var params = [];
        grid.jqGrid('saveEditingCell'); 
        var ids = grid.jqGrid('getDataIDs');
        for(var i=0; i < ids.length; i++){
            var ret = grid.jqGrid('getRowData', ids[i]);
            if(ret.flag =="I" || ret.flag =='U'){
                params.push(
                    {name:"java에 넘겨줄 parameter", value:ret.grid name},
            }
        }
        $.ajax({
            url: "자바에서 받을 method, action 명",
            data: params,
            type: "POST",
            beforeSend:function(){
             console.log("저장중입니다.");
            }
        }).done(function(){
            console.log("저장이 완료되었습니다");
        });
    };
cs






삭제시
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function cmdDel(){
        var params =[];
        var rowid = grid.jqGrid('getGridParam','selrow');
        var seq =grid.jqGrid('getRowData',rowid).seq;
            params.push({name:"seqs", value:seq});
            
        if(confirm("정말 삭제하시겠습니까?"== true){
            $.ajax({
                url: "delete action ",
                data: params ,
                type: "POST",
                beforeSend:function(){
                  console.log("삭제중입니다.");
                }
            }).done(function(){
              console.log("삭제되었습니다.");
            });
        }else{
            return false;
        
cs





1
2
3
4
var rowid, data;
    
    rowid  = $(“#jGrid”).jqGrid(‘getGridParam’, “selrow” );            // 선택한 열의 아이디값
    data = $(“#jGrid”).jqGrid(‘getRowData’, rowid).컬럼명;        // 선택한 열중에서 grid내의 정보를 가져온다.
cs


jqGrid 에서 삭제할때의 seq는 각셀의 data를 가져와야 한다

save 할때(insert, update 포함) 전체 목록을 for문 돌려 flag로 구분하여 처리하는방식으로 생각하여 delete 했다가

다른 데이터도 삭제되어 멘붕에 빠졌었음 ㅠㅠ


해당 gird data 가져오는것은 구글링

'jqgrid select value' 검색하여 획득


+ Recent posts