onsubmit, @RequestBody, radio button, $('input[name='

* el ${} 을 javascript에서 쓰고 싶을 때! 

var js변수    =    '${el변수}';

*    radio button : input name + value 값으로 checked되게 만드는 법

$('input [name='     '][value='    '].attr('checked', 'checked');

<script>
$(document).ready(function() {
    
    var gender = '${gender}';
    if(gender=='1'){
         $('input[name="gender"][value="1"]').attr('checked','checked');
    } else if (gender=='2'){
        $('input [name=gender][value="2"]').attr('checked', 'checked');
    }
    
    $("#modifyBtn").on("click", function() {
        alert( $("input[name=gender]:checked").val());
 
        var parameter = JSON.stringify({'id' : $("#id").val(), 'name' :  $("#name").val(), 
            'bdate' :  $("#bdate").val(), 'gender' : $("input[name=gender]:checked").val(), 'pnum' :  $("#pnum").val(), 
            'addr' :  $("#addr").val()});
        alert(parameter);
        $.ajax({
                url : '${root}/member',
                type : 'PUT',    
                contentType : 'application/json;charset=UTF-8',
                dataType : 'json',
                data : parameter,
                success : function (data) {
                    alert("data : " + data);
                }
            });
        });
    });    
</script>

*    radio button checked된 value 값을 가져오는 법

$("input [name='    ']:checked").val();

* Json.stringify로 string화한 파라미터를 +

contentTYpe : 'application/json; charset=UTF-8' 설정 하여

json 데이터타입으로 컨트롤러에 전달할 때, 컨트롤러에서는...?

@Controller
@RequestMapping("/member")
public class MemberController {
 
 
    @Autowired
    private MemberService memberService;
 
@RequestMapping(method = RequestMethod.PUT, headers={"Content-type=application/json"})
    public @ResponseBody String modifyMember(@RequestBody MemberDto memberDto, HttpSession session,
 Model model,
            HttpServletRequest request) {
        MemberDto member = (MemberDto) session.getAttribute("userInfo");       
        int cnt=0;
        if (member != null) {
            
            memberDto.setPw(member.getPw());
            memberDto.setZcode(member.getZcode());
            cnt = memberService.updateMember(memberDto);
        }
        String msg = "";
        if (0 < cnt) {
            msg = "회원수정이 완료되었습니다";
        } else {
            msg = "회원수정이 실패했습니다";
        }
        return msg;
    }
}

@RequestMappng에서 headers={"Content-type=application/json"} 으로 받는다

+ ajax에서 건네받은 데이터가 Dto와 일치할 경우!! @RequestBody로 DTo를 선언하면 ajax의 데이터가 자동으로 Dto 화 되서 쉽게 쓸수 있다!

이전화면 가기 : window.location.href = history.go(-1) || history.back();

 * onsubmit()

form에서 submit 하기 전에 onsubmit='return function()'을 거칠 수 있다! onsubmit 통과하면 return false, 아니면 return true;

<form name='myform' onsubmit='return mysubmit()'>
    아이디: <input type='text' name='id' />
    패스워드: <input type='text' name='pw' />
    <input type='submit' value='로그인' />
</form>

<script>
function mysubmit() {
    var myform = document.forms['myform'];
    if( myform['id'].value.length < 1) {
        alert( '아이디를 입력하세요.');
        return false;
    }
    if( myform['pw'].value.length < 1) {
        alert( '패스워드를 입력하세요.');
        return false;
    }
    return true;
}
</script>

 출처 :  https://zetawiki.com/wiki/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8_onsubmit