Javascript , Data URL을 이용한 엑셀 파일 생성하기

Open API/그 외 |2018. 2. 21. 17:12
반응형





javascript 에서 테이블 구조의 html을 전달 받아 Excel 파일을 생성하는 함수 입니다.


기본적으로 서버에서 만들어진 내용을 다운받도록 하지만 

클라이언트 쪽에서 바로 xls 파일을 생성 할 수 있도록 하는 방법입니다.

기본문법 : data:[<mediatype>][;base64],<data>



    
function fnExcelReport(cont, fileName)
{
	var ua = window.navigator.userAgent;
         
	if ( (navigator.appName == 'Netscape' && ua.search('Trident') != -1) || (ua.indexOf("msie") != -1) )       // IE
	{
		newWin = window.open();
		newWin.document.open("txt/html","replace");
		newWin.document.write(cont);
		newWin.document.close();
		newWin.focus();
		newWin.document.execCommand("SaveAs", true, fileName + ".xls");
		newWin.close();
	}
	else   //other browser
	{
		var a = document.createElement('a');
		var data_type = 'data:application/vnd.ms-excel';
		a.href = data_type + ', ' + encodeURIComponent(cont);
		a.download = fileName+'.xls';
		a.click();
		e.preventDefault();
	}
}


상세 내용은 MDN 웹 Document 를 참조하세요.


링크 : https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs

댓글()

jquery ajax 동기처리가 안되는 경우.. async 옵션이 적용 안될 때.

Open API/Jquery|2017. 9. 20. 18:59
반응형

jQuery ajax 옵션중에는 async 옵션이 있습니다.

이것은 기본적으로 ajax가 비동기 처리를 하지만 필요에 따라 동기 요청을 하기 위한 옵션이지만

최근 경험상 적용이 되지 않는 것이 확인되어 api 사이트를 확인해보니 

아래와 같은 내용이 확인이 됩니다.


크로스 도메인일 경우 데이터 타입이 jsonp라면 지원되지 않는다. 

위의 조건 외에도 1.8 버전 이후부터 지원되지 않음이라고 명시되어있고 

콜백 함수를 이용하도록 명시가 되어있으니 

1.8버전 혹은 최신 버전을 사용하는 경우 문제가 될 것같습니다.


그런데...되는 경우도 있고..안되는 경우도 있고...모호하네요.


확실하게 그냥 콜백 함수를 사용해야겠습니다.


 

  async (default: true)
  Type: Boolean
By default, all requests are sent asynchronously (i.e. this is set to true by default). If you need synchronous requests, set this option to false. Cross-domain requests and dataType: "jsonp"requests do not support synchronous operation. Note that synchronous requests may temporarily lock the browser, disabling any actions while the request is active. As of jQuery 1.8, the use of async: false with jqXHR ($.Deferred) is deprecated; you must use the success/error/complete callback options instead of the corresponding methods of the jqXHR object such as jqXHR.done().


http://api.jquery.com/jQuery.ajax/

댓글()

modal 팝업창에서 datepicker 사용 시 연도 월 Select box가 열리지 않는 문제 해결 방법

Open API/Jquery|2017. 9. 18. 13:51
반응형


Bootstrap modal 팝업창에서 datepicker 사용 시 


changeMonth , changeYear 옵션을 true 로 사용할 경우 정상적으로 펼쳐지지 않고


바로 닫히는 버그가 있는데 꽤 오래된 상황임에도 업데이트가 되어지지 않고 있습니다.




하지만,  역시 스택오버플로우 


https://stackoverflow.com/questions/22050641/month-select-in-datepicker-inside-a-bootstrap-modal-wont-work-in-firefox


해결 방안을 제시해줍니다.


$('#modal').on('show', function () {
    $.fn.modal.Constructor.prototype.enforceFocus = function () { };
});




위와 같이 Show 혹은 modal 팝업 활성화 이후에

    $.fn.modal.Constructor.prototype.enforceFocus = function () { };

위와 같은 코딩을 실행해주면 정상적으로 연도 및 월 변경이 가능합니다.


댓글()