728x90

목동코딩,코딩교육

function deleteOerder(obj) {

   $("#" + obj.id).closest('tr').remove();
}

var row = "";
row = row + "<tr>";

row = row +
    "<td><input id='" + resArray[0] +
    "' name='ItemCode' class='btn btn-secondary' onclick='deleteOerder(this);' type='button' value='" +
    '삭제' +
    "' style='width: 80%;padding: 0;border-radius: 0.4rem;font-size: 1.45rem;border-color: white;'></td>";
row = row +
    "<td ><input name='DispLetter'  type='text' value='" + resArray[1] +
    "' style='width: 100%;' disabled></td>";
row = row + "<td ><input name='ItemName'  type='text' value='" + resArray[2] +
    "' style='width: 100%;' disabled></td>";
row = row + "<td ><input name='Price'  type='text' value='" + comma(resArray[3]) +
    "' style='width: 100%;text-align:right;padding-right:10px;' disabled></td>";
row = row +
    "<td ><input   name='Cnt' onchange='reCalcu();'  type='number' value='1' min='1' style='width: 100%;' ></td>";

row = row + "</tr>";
$('#orderItems').append(row);
var totSum1 = uncomma($('#buySum').val());
var totSum2 = uncomma(resArray[3]);
var totSum = (parseInt(totSum2) + parseInt(totSum1)).toString();

$('#buySum').val(comma(totSum));
          
});
728x90
728x90

추석을 잊은 그대에게....

오늘이 추석이라는 명절인가 보다...

가만히 생각해 보니 내가 살아온 삶에 명절이 있었나 싶다 ㅎㅎ.

요즘 많은 사람들이, 조금 더 휴일을 갖고자 노력을 한다면 , 내가 2~30대 시절에는 일년에, 한 360일은 일을 했던 거 같다. 그 6일 정도도 집안 행사가 이유 였던 거 같다.

23세때 아버지 사고난 후 시작했던 우유 배달도 휴일이 따로 없었고, 당구장 청소도 명절이 따로 없었던 거 같다. 명절날도 일찍이 차례를 지내고 청소하러 갔던 기억이 난다.

세월이 많이 흐른 오늘도 역시 프로젝트 마무리 하느라 밥 생각도 없이 프로그램을 짜고 있다 ㅎㅎ . 옆 책상에선 거래처 팀장님도 자신의 일을 마무리 하느라 열심히 키보드를 두두린다.

아인쉬타인이 이런 애기를 했단다. "어제와 오늘을 똑같이 살면서, 내일이 나아질거를 기대한다면 , 그건 정신병의 초기증상" 이라고 ...

그런 거 보면 난 아직 정신병이 시작되지는 않은 거 같다 ㅎㅎ.

요즘은 프로그래밍 언어 하나를 가지고는 버틸 수 없는 시대가 되었다........

 

728x90
728x90

목동코딩: 코딩수업

아래의 화면에서 복수의 input의 value를 가져와서 DB에 저장하는 방법과 새로운 table row를 만들어서 새로운 record를 추가하는 방법입니다.

 

<script>
    function addItems() {
        $("input[name=ItemCode]").each(function(idx) {
            // 해당 input Value 가져오기
            var id = $(this).attr('id');
            var ItemCode = $("input[name=ItemCode]:eq(" + idx + ")").val();
            console.log(id + ":" + ItemCode);
        });

        var ret = confirm("항목을 추가하시겠습니까?");
         if(!ret){
            return false;
        }
        var row = "";
        row = row + "<tr>";

        row = row + "<td><input  type='button' value='' style='width: 100%;'></td>";
        row = row + "<td><input  type='text' value='' style='width: 100%;'></td>";
        row = row + "<td><input  type='text' value='' style='width: 100%;'></td>";
        row = row + "<td><input  type='text' value='' style='width: 100%;'></td>";
        row = row + "<td><input  type='text' value='' style='width: 100%;'></td>";

        row = row + "</tr>";
        $('#itemsTable').append(row);
}
</script>

<table id="itemsTable" class="table table-striped">
  <th width="5%">
    삭제
  </th>
  <th  width="5%">
    기호
  </th>
  <th  width="20%">
    품명
  </th>
  <th  width="10%">
    가격
  </th>
  <th  width="60%">
    설명
  </th>
</tr>
</table>

 

 

 

목동코딩 전문적인 코딩교육

 

728x90
728x90

목동코딩: 코딩교육

필요에 따라서 모달폼을 열고 닫는 방법

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<script src="https://code.jquery.com/jquery-latest.js"></script>
	<title>Document</title>
	<style>
        /* The Modal (background) */
        .modal {
            display: none; 
            position: fixed; 
            z-index: 1; 
            left: 0;
            top: 0;
            width: 100%; 
            height: 100%; 
            overflow: auto; 
            background-color: rgb(0,0,0); 
            background-color: rgba(0,0,0,0.4); 
        }
    
        /* Modal Content/Box */
        .modal-content {
            background-color: #ffffff;
            margin: 15% auto; /* 15% from the top and centered */
            padding: 20px;
            border: 1px solid #888;
            width: 30%; /* Could be more or less, depending on screen size */                          
        }
 
</style>

</head>
<body>
	<input type="button" onclick="open_pop();" value="open" />
	    <!-- The Modal -->
		<div id="myModal" class="modal">
 
			<!-- 모달폼 시작 -->
			<div class="modal-content" style="background-color: #000000;">
				<img class="bd-placeholder-img" width="100%"
                        src="http://nooh-system.com/images/logo_nooh_white.png" aria-hidden="true"
                        preserveAspectRatio="xMidYMid slice" focusable="false">
					  <p style="text-align: center;"><span style="font-size: 14pt;"><b><span style="font-size: 24pt;">공지</span></b></span></p>
					  <p style="text-align: center; line-height: 1.5;"><br />여기에 내용</p>
					  <p><br /></p>
				  <div style="cursor:pointer;background-color:#DDDDDD;text-align: center;padding-bottom: 10px;padding-top: 10px;" onClick="close_pop();">
					  <span class="pop_bt" style="font-size: 13pt;" >
						   닫기
					  </span>
				  </div>
			</div>
	   
		  </div>
			  <!--모달폼 종료-->
	  
	  
			  <script type="text/javascript">      
				jQuery(document).ready(function() {						
				});
				//팝업 보기
				function open_pop() {
					 $('#myModal').show();
				};

                //팝업 단기
				function close_pop(flag) {
					 $('#myModal').hide();
				};
				
			</script>

</body>
</html>

 

 

목동코딩학원 코딩교육

 

 

http://nooh-system.com/

728x90
728x90

목동코딩:

이번에하는 프로젝트는 이미지를 많이 다루는 사이트이다. 컴퓨터에서 보기에는 불편함이 없으나, 모바일에서 보려면 아무래도 확대해서 표시해야 할거 같아서 구글 검색으로 적용한 방법임

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>	
    <style>
		.enLargeFrame {
			position: absolute;
			display: none;
			justify-content: center;
			align-items: center;
			top:0%;
			width:100%;
			height:100%;
			background-color: gray; 
			z-index: 100;
			background:rgba(255,255,255,0.5);
		}
		.enLarge {
			position: relative;
			display:flex;
			justify-content: center;
			align-items: center;
		}
		
		.enLarge img {
			width:100%;
		}
	</style>
</head>
<body>
	<h1>이미지 크게보기</h1>
	<hr>
	<div class='enLargeFrame'>
		<div class='enLarge'>
		</div>
	</div>
	<img src="http://nooh-system.com/images/logo_nooh_white.png"> 
	<img src="http://nooh-system.com/assets/img/portfolio/4.jpg"> 
</body>
<script type="text/javascript">
	$(document).ready(function (e){
		
		$(document).on("click","img",function(){
			var path = $(this).attr('src')
			showImage(path);
		}); 
		
		function showImage(fileCallPath){
		    
		    $(".enLargeFrame").css("display","flex").show();		    
		    $(".enLarge")
		    .html("<img src='"+fileCallPath+"' >")
		    .animate({width:'100%', height: '100%'}, 1000);		    
		  } 	  
		$(".enLargeFrame").on("click", function(e){
		    $(".enLarge").animate({width:'0%', height: '0%'}, 1000);
		    setTimeout(function(){
		      $('.enLargeFrame').hide();
		    }, 1000);
		  }); 
	});
</script>
</html>

목동코딩 프로젝트 코딩교육

 

목동코딩 프로젝트 코딩교육

728x90
728x90

목동코딩:

프로젝트를 하다보면 꼭 필요한 부분이 입력 유효성 체크이다.

예전에 POS를 개발할 때 절실히 느껴던 부분이다.

개발하는 입장에서는 에러가 안나게 잘 입력해 주지만 ㅎㅎ , 일반 사용자는 그렇지 않기에 다양한 입력 검증 방식이 필요하다.

가령 금액을 입력하는데 문자를 입력하는 경우등이다. 이러한 경우를 예상하지 않으면 그냥 시스템이 죽어 버리곤 했다. 세월이 많이 흐른 지금도 키코드를 이용하여 비교하는 방식은, 예전에 코볼로 개발할 때 랑도 비슷한 느낌이다. 세월이 흘러도 원리는 변하지 않느거 같다. 그래서 학생들도 원리를 궁금해 하면서 공부 해야 한다는 생각이다.

 

$(document).ready(function () {
    // Number only
    $('#id').keyup(function (e) {
        if(!((e.keyCode >= 37 && e.keyCode <= 40) || (e.keyCode == 46))){
            this.value = this.value.replace(/[^0-9]/g,'');
        }
    });
    //Number & dot
    $('#id').keyup(function (e) {
        if(!((e.keyCode >= 37 && e.keyCode <= 40) || (e.keyCode == 46))){
            this.value = this.value.replace(/[^0-9\.]/g,'');
        }
    });
    //Amount
    $('#id').keyup(function (e) {
        if(!((e.keyCode >= 37 && e.keyCode <= 40) || (e.keyCode == 46))){
            this.value = $.number(this.value,0); //jquery.number.js
        }
    });
    //Number & '-'
    $('#id').keyup(function (e) {
        if(!((e.keyCode >= 37 && e.keyCode <= 40) || (e.keyCode == 46))){
            this.value = this.value.replace(/^[-]|[^0-9-]/gi,'');
        }
    });
    //Alpha & Number & '-'
    $('#id').keyup(function (e) {
        if(!((e.keyCode >= 37 && e.keyCode <= 40) || (e.keyCode == 46))){
            this.value = this.value.replace(/[^a-zA-Z0-9\\-]+$/i,'');
        }
    });
});

 

 

 

728x90
728x90

목동코딩:

프로젝트를 하다보면 사용하는 언어마다 숫자에 컴마를 표시하는 방법이 조금씩 다르다.

Php에서 컴마를 찍는 방법은 또 조금 다르다. 이번엔 자바스크립트에서 컴마를 표시하거나, 컴마를 제거하는 함수를 정리해둔다.

<script>
    $(document).ready(function() {

        $('input[name=saleAmount]').attr('value', comma("111222333"));
    });

    //콤마찍기
    function comma(str) {
        str = String(str);
        return str.replace(/(\d)(?=(?:\d{3})+(?!\d))/g, '$1,');
    }

    //콤마풀기
    function uncomma(str) {
        str = String(str);
        return str.replace(/[^\d]+/g, '');
    }
    </script>

목동코딩 코딩수업

 

728x90
728x90

목동코당:플랫폼 비지니스....

오늘도 작성해야 할 프로그램이 많은데 언뜻 시작이 안되고 뜸을 들이고 있습니다....

아마도 제 스타일 인 거 같습니다. 마치 가라 앉아 있는 막걸리를 휘젓듯이 초기 부팅 시간이 필요하나 봅니다.

얼마 전 새로운 플랫폼 비지니스가 또 하나 진행 됐습니다.

우리가 돈을 벌 수 있는 경우는 많이 있습니다.

버스를 운전하며 돈을 벌 수도 있고,

버스 표를 검사하며 돈을 벌 수도 있지요. 참 요즘은 고속 버스를 타보니 표 검사를 버스 안에 리더기가 하더라고요 ㅎㅎ.

반면에 버스터미날을 건설하고 여기를 이용하는 사람과 판매점을 입점시키고, 그들에게서 돈을 버는 플랫폼 비지니스가 있습니다.

건물주라고도 하지요 ㅎㅎ.

다만 플랫폼 비지니스는 내가 원한다고 쉽게 하지 못 하는게 문제인거죠.

제 경우에는 프로그램을 개발하면서 살아오다 보니 , 이러한 플랫폼 구축에 대한 동업 제안이 종종 들어옵니다.

30대 시절에는 제가 하는 일이 플랫폼인지도 모르고 돈을 벌었다면, 지금은 플랫폼을 찾아서 개발하려고 노력하는 것이 차이점 같습니다. 예를 들면 ,직방, 배달의민족, 야놀자, 여기어때 등등등.

혹시 여러분 자녀나 주변 분들 중애 무엇을 할지 고민하시는 분들에게 프로그램을 공부하게 해주세요. 그냥 놀이 방식의 코딩이 아니고 제대로 배우게 해주셔야 합니다.

아이디어가 아이디어로 멈추면 돈이 되지 않습니다. 아이디어를 구체화 시키는 대에는 프로그래밍이 참 좋습니다.

밥 먹고 잠만 잘자면 별로 돈이 안듭니다.

디지탈 노마드로서 여유있는 생활을 충분히 즐길 수 있습니다. 인터넷만 연결되어 있으면요...

이번달은 말레이지아에서 다음달은 일본에서 등등 이런 식으로...

가능하다면 코로나가 빨리 종식되기를 바래봅니다....

 

출처: VONVON 사이트

목동코딩학원 플랫폼비지니스 ​
목동코딩 Sonoff 펌웨어 커스토마이징,코딩교육

728x90

+ Recent posts