머니머니해도 머니

체크된 행의 금액 합계 

var $obj = $("input[name='b_checkbox']");

var checkCount = $obj.size();

for (var j=0; j<checkCount; j++){

 if($obj.eq(j).is(":checked")){

amtSum_b =  parseFloat(amtSum_b) + parseFloat(arrObj("b_recpAmt",j).value);

}

} 

//배열일때 와 배열이 아닐때

function arrObj(name , i){

var objID   = document.frm1.elements[name];

return (objID.length > 0 ? objID[i] : objID);

}

jquery로 파일다운로드 요청하기 . framework 사용시 요청url을 변경하면 된다. 

$.fileDownload("/common/fileDownload.jsp", {

 httpMethod: 'POST',

 dataType:"json", // data type of response

      contentType:"application/json",

 data: {"fileNm":fileNm},

 successCallback: function(url) {  

 }

})

fileDownload.jsp 

<%@ page contentType="text/xml; charset=utf-8" language="java" errorPage="" %>

<%@page import="java.util.*"%>

<%@page import="java.io.OutputStream" %>

<%@page import="java.io.File" %>

<%@page import="java.io.FileInputStream" %>

<%@page import="java.io.IOException" %>

<%@page import="java.io.PrintWriter" %>

<%@page import="java.net.URLEncoder" %>

<%@page import="net.sf.json.JSONObject"%>

<%@page import="com.comUtil.Constants"%>

<%@page import="org.apache.commons.lang.StringUtils" %>

<%

String pathname = Constants.FILE_UPLOAD_PATH;

String filename[] = request.getParameterValues("fileNm");

if(filename.length == 1){

File uFile = new File(pathname,filename[0]);

int fSize = (int)uFile.length();

if (fSize > 0) {

String mimetype = "application/x-msdownload";

response.setContentType(mimetype);

String header = request.getHeader("User-Agent");

String browser ="";

if (header.indexOf("MSIE") > -1 || header.indexOf("Trident") > -1) {

browser= "MSIE";

     } else if (header.indexOf("Chrome") > -1) {

    browser= "Chrome";

     }

String dispositionPrefix = "attachment; filename=";

String encodedFilename = null;

if (browser.equals("MSIE")) {

   encodedFilename = URLEncoder.encode(filename[0], "UTF-8").replaceAll("\\+", "%20");

}else if (browser.equals("Chrome")) {

   StringBuffer sb = new StringBuffer();

   for (int i = 0; i < filename[0].length(); i++) {

char c = filename[0].charAt(i);

if (c > '~') {

   sb.append(URLEncoder.encode("" + c, "UTF-8"));

} else {

   sb.append(c);

}

   }

   encodedFilename = sb.toString();

}  

response.setHeader("Content-Disposition", dispositionPrefix + encodedFilename);

response.setContentLength(fSize);

OutputStream outputstream = null;

    FileInputStream inputstream = null;

try {

out.clear();

pageContext.pushBody();

outputstream = response.getOutputStream();

         inputstream = new FileInputStream(uFile);

         byte[] buffer = new byte[1024]; 

         int length = 0; 

         while((length = inputstream.read(buffer)) > 0) {

             outputstream.write(buffer,0,length); 

         }

} catch (Exception e) {

         e.printStackTrace();

     } finally {

         try {

             if (inputstream != null){

                 inputstream.close();

             }

             outputstream.flush();

             outputstream.close();  

         } catch (Exception e2) {}

     }

}

}

%>

jQuery로 id 접근시 $(“#id”),

ex) $(“#header_area”)

class로 접근시 $(“.class”),

ex) $(“.section_nav”)

name으로 접근시 $(tag_name[name=name]),

ex) $(“input[name=search_value]“)

출처: http://breakpoint.tistory.com/85 [BreakPoint]

테이블에 CSS가 먹힌 상태에서  tr에 배경색이 아닌 tr 자식노드의 td 의 배경색 바꾸기 

tr 클릭시 this를 매개변수로 넘겨줘  해당 엘리먼트 접근한다. 

 funtion xxx(obj){

 $(obj).parent().children().children().css("background-Color","");  //이전에 변경한 배경색을 원래대로 돌려놓는다. obj위치가 tr 이며 부모노도의 하위에 딸린 tr 의 td에 접근

 $(obj).children().css("background-Color","F5F6CE");  //this를 obj로 받아  children()  자식노드를 찾아 배경색을 변경해준다. 

}

//전체문서에서 태그 이름이 div인 Element Node찾기.

     var $divs = $("div")

     alert("전체문서에서  div 엘리먼트 갯수 : " + $divs.length)

     $divs.css("border", "4px solid #ff0000")

     //#data_1의 모든 상위 부모노드 중 id가 sample_page인 노드 구하기

     $("#data_1").parents("#sample_page").css("border", "4px solid blue")

     //문서 전체에서 content_data라는 클래스 이름이 적용된 엘리먼트 찾기

     var $contentData= $(".content_data")

     $contentData.css("border", "4px solid orange")

     //문서에서 아이디가 "header" element 찾기

     var $header = $("#header")

     $header.css("border", "4px solid black")

     //1. 모든 자식 노드 찾기

     //1-1. 텍스트 노드를 포함한 모든 자식 노드를 찾을 때.

     var $nodes1 = $("body").contents()

     alert("body의 자식노드자식 노드 갯수는 ? " + $nodes1.size())

     //1-2 텍스트 노드를 제외한 오직, 태그 노드만을 찾고 싶을 때.

     var $nodes2 = $("body").children()

     alert("body의 자식 노드의 갯수는 ? " + $nodes2.size())

     //2. 자식 노드에 하나씩 접근하기

     var $nodes3 = $("#sample_page").children()

     for(var i=0 ; i < $nodes3.length ; i++){

      //i번째 노드를 감싼 확장 집합을 구합니다.

      var $node = $nodes3.eq(i)

      $node.css("border", "4px solid pink")

     }

     //3. 첫번째 자식 노드에 접근하기.

     var $firstChild = $("body").contents(":first-child")

     $firstChild.css("border", "1px solid red")

     //4. 마지막번째 자식 노드에 접근하기.

     var $lastChild = $("body").contents(":last-child")

     $firstChild.css("border", "1px solid orange")

     //#header의 부모노드는?

     var $header = $("#header")

     $header.parent().css("border", "4px solid violet")

     //#data_1의 부모노드는?

       $("#data_1").parent().css("border", "1px solid black")

     //#data_1의 모든 상위 부모노드 구하기

     $("#data_1").parents().css("border", "1px solid green")

포맷 : USD  달러인 123,333,22.33 

input text 필드에 금액 입력시  자동으로  포맷형으로 변환해 주기 위하여 jquery plugin  inputmask.js 사용하였다. 

공통인클루드 파일에 js를 임포트 한후  inputmask 객체를 초기화 하였다. 

customInputmask.init(); //input mask 초기화   customInputmask 는 js파일을 만들고 inputmask 객체를 정의하였다. 

var customInputmask = (function() {

 var config = {

  extendDefaults: {

     showMaskOnHover: false,

    showMaskOnFocus: false

},

   extendDefinitions: {},

   extendAliases: {

    'numeric': {

    radixPoint: ".",

       groupSeparator: ",",

       digits: 2,      

       autoGroup: true,

       //prefix: '', 

       rightAlign: false

     },

     'currency': {

      alias: 'numeric',

       radixPoint: ".",

   groupSeparator: ",",

   digits: 2,

   autoGroup: true,

   prefix: ' ', //No Space, this will truncate the first character

   rightAlign: false

     },

    'euro': {

      alias: 'currency',

       prefix: '',

       suffix: ' €',

      radixPoint: ',',

       groupSeparator: '',

       autoGroup: false,

     },

    'euroComplex': {

      alias: 'currency',

       prefix: '',

       suffix: ' €',

     }

   }

 };

var init = function() {

Inputmask.extendDefaults(config.extendDefaults);

   Inputmask.extendDefinitions(config.extendDefinitions);

   Inputmask.extendAliases(config.extendAliases);

   $('[data-inputmask]').inputmask();

};

 return {

  init: init

 };

}());

각 화면에서는 input 필드에   data-inputmask="'alias':'numeric'"  구문을 넣어주면 자동으로 알아서 형변환을 해준다. 

참고 사이트 https://git.dei.uc.pt/amoreno/bd/tree/silvia/assets/plugins/jquery-inputmask

전체 해제

$("input[name=체크박스이름]:checkbox").removeProp("checked");

전체 선택

$("input[name=체크박스이름]:checkbox").prop("checked", "checked");

example : 첫번째 로우의 체크박스가 선택이 되어있으면 전체 해제 else 전체 선택 

//배열일때 와 배열이 아닐때

function arrObj(name, i) {

    var objID = document.getElementsByName(name);

    return (objID.length > 0 ? objID[i] : objID);

}

 function checkAll() {

  var objID = document.getElementsByName("체크박스이름")

  if (parseInt(objID.length, 10) > 0) {

   if(arrObj("체크박스이름",0).checked){

   $("input[name=체크박스이름]:checkbox").removeProp("checked");

   }else{

   $("input[name=체크박스이름]:checkbox").prop("checked", "checked");

   }  

    }

}