While form submitting using ajax..getting Post not supported error …don’t know what is the error?

hi i am using form submission using ajax in spring mvc and thymeleaf have a problem, when i try to submit it shows Post method is not supported. i cant figure out the mistake in my code. please some one help me.

    <form class="form-horizontal" action="#" th:action="@{/teacher/teacherProfileUpdation}" th:object="${teacherProfileDetailsList}"
                             id="saveTeacherForm" method="POST" >
                                <br />
                                <div class="row">

                                    <div class="col-lg-14 col-md-12">
                                        <br />
                                        <h5 style="margin-left: 15%;">Personal Details</h5>
                                        <hr />
                                        <div class="form-group">
                                            <label class="col-sm-3 control-label">Name</label>
                                            <div class="col-md-3 col-sm-4 col-xs-4">
                                                <input placeholder="Teacher first name" id="txtTeacherFname" th:field="*{firstName}" type="text" class="form-control" />
                                            </div>
                                            <div class="col-md-3 col-sm-4 col-xs-4">
                                                <input placeholder="Teacher middle name" id="txtTeacherMname" th:field="*{middleName}" type="text" class="form-control" />
                                            </div>
                                            <div class="col-md-3 col-sm-4 col-xs-4">
                                                <input placeholder="Teacher last name" id="txtTeacherLname" th:field="*{lastName}" type="text" class="form-control" />
                                            </div>
                                        </div>

                                    </div>
                                    <div class="col-lg-14 col-md-12">
                                        <div class="form-actions">
                                            <input type="hidden" id="hdnStudentByIdInSchoolAdmin" value="0" /> 
                                            <input type="button" class="btn btn-info pull-right" id="btnUpdateTeacherProfile" value="Save" />
                                        </div>
                                    </div>
                                </div>
                            </form>`

JS

    saveTeacherProfile :function(){
                        $("#saveTeacherForm").ajaxForm({
                                    success : function(status) { 
                                        alert("success");
                                    },
                                }).submit();
                    }

controller

    @RequestMapping(value = "/updateTeacherProfile", method = RequestMethod.POST)
        public String updateTeacherProfile( TeacherProfileDetails teacherProfileDetails){

            System.out.println("-----------"+teacherProfileDetails.getFirstName()+"-------------");
            System.out.println("-----------"+teacherProfileDetails.getLastName()+"-------------");
            System.out.println("-----------"+teacherProfileDetails.getMiddleName()+"-------------");

            return "success";
        }


Source: forms

Leave a Reply