자바스크립트21 폼이 제출되기 전, 유효성 검사하기 목표 : 첨부한 사진을 제출하는 폼 버튼 클릭 시 사진이 첨부되어 있지 않으면 제출되지 않고 팝업을 띄워주고자 합니다! 수정 전에는 아래처럼 에러가 뜹니다. 팝업창 작성 전 폼 제출 에러를 먼저 손보겠습니다. #폼 제출 시 조건을 충족하지 않는 경우, 제출을 막고 경고를 보냅니다. 먼저 현재 코드를 먼저 확인합니다. {% csrf_token %} 데이터를 업로드하세요! 파일 업로드는 input name="i_fu"로 들어가고, submit버튼으로 제출되네요. 제출 전 확인해줘야 할 것이 있으니 제출 버튼을 눌러도 바로 제출이 되지 않도록 수정해야 합니다. //index.js const submitform = document.querySelector("#photoform"); // form을 sumitfo.. 2022. 6. 13. 클릭으로 html 항목을 화면에 표시 or 숨김 HTML로 표현한 아래 버튼을 클릭하면 id가 ㄱ, ㄴ 인 항목은 화면에 표시 (style="display: block") id가 ㄷ,ㄹ,ㅁ,ㅂ 인 항목은 화면에서 숨겨짐 (style="display:none") 1. HTML 버튼 2. JavaScript function doDisplay0(var1, novar1) { let t1 = var1; let f1 = novar1; for (let i = 0; i < t1.length; i++) { t = document.getElementById(t1[i]); t.style.display = 'block' } for (let i = 0; i < f1.length; i++) { f = document.getElementById(f1[i]); f.style.di.. 2022. 3. 15. JavaScript, 폼 값을 URL로 전달 목표 : form에 입력한 값을 파라미터가 아닌, 문자열 형태로 url에 전달합니다. form 의 텍스트박스에 zenna를 입력하면 url에 이 값이 붙도록! url로 값을 보낼 폼과 자바스크립트를 html에 작성해줍니다. 화면에는 아래처럼 보입니다. value로 기본값을 설정해줬어요. value를 빼고 적으면 빈칸으로 되어있는 form이 생성됩니다. 여기에 값을 적고 go 버튼을 눌러보겠습니다. 입력한 값이 ?뒤에 붙는 파라미터가 아닌 텍스트로 전달됩니다. input type="button"에 onclick 으로 클릭 시 할 행동을 자바스크립트로 지정해준거예요. 버튼이 클릭(onclick)되면 document(지금 보고 있는 웹 페이지를 의미합니다)의 링크(location.href)가 바뀝니다. 바뀔 .. 2022. 3. 15. 이전 1 2 3 다음 728x90
