Нужна помощь в написании функции JQuery

Question

Мне нужна помощь в реализации jQuery.

У меня есть выпадающий список со следующим кодом

<td width="20%">Programs<font color="red">*</font>:</td>
<td width="20%"><c:set var="programMap"
value="${userTraining.programMap}"></c:set> <form:select
path="programs" id="selectPrograms"
onchange="javascript:checkboxlist();">
<c:forEach var="item" items="${programMap}">
<form:option value="${item.key}">
<c:out value="${item.value}"></c:out>
</form:option>
</c:forEach>
</form:select></td>

В событии изменения моего выпадающего списка (флажок функции javascript "() "вызывается), и функция извлекает список курсов и отображает вкладку" курс "в форме флажка.

function checkboxlist() {
    document.userTrainingForm.action = "/UserRegistration/training/main/student/getCourses";
    document.userTrainingForm.submit();
    }

Фрагмент кода вкладки курса

<c:set var="courseMap" value="${userTraining.courseMap}"></c:set> 
<c:set var="selectedCourseMap" value="${userTraining.selectedCourseMap}"></c:set> 
<c:forEach var="item" items="${courseMap}">
<c:set var="valuePresent" value="false"></c:set>

<c:forEach var="selectitem" items="${selectedCourseMap}">
<c:if test="${selectitem.key == item.key}">
<c:set var="valuePresent" value="true"></c:set>
</c:if>
</c:forEach>

<c:choose>
<c:when test="${valuePresent == 'true'}">
   <form:checkbox id="chkCourse" path="courseName"
   checked="checked" value="${item.key}"
   style="font-weight: 700" />
   <c:out value="${item.value}"></c:out>
</br>
</c:when>
<c:otherwise>
    <form:checkbox id="chkCourse" path="courseName"
    value="${item.key}" style="font-weight: 700" />
    <c:out value="${item.value}"></c:out>
    </br>
</c:otherwise>
</c:choose>
</c:forEach>

Страница обновляетсяна каждое событие при изменении.Может кто-нибудь, пожалуйста, помогите мне написать "function checkboxlist ()" в jQuery (jQuery.ajax ()) , чтобы страница не обновлялась при каждом событии onchange.

Answer 1

function checkboxlist() {
    document.userTrainingForm.action = "/UserRegistration/training/main/student/getCourses";
    document.userTrainingForm.submit();
}

вы отправляете форму с изменениями, если вы хотите отправить форму с помощью jQuery, вы должны использовать что-то вроде этого:

function checkboxlist() {
    $.ajax({
        type: 'POST',
        url: "/UserRegistration/training/main/student/getCourses",
        data: $('#userTrainingForm').serialize(),
        success: function(msg){
            alert('form submitted');
        }
    });
}