1
나는 탭 및 유효성 검사가 포함 된 jQuery 플러그인을 찾고있었습니다. 나는 발견했는데 jquery-steps을 사용하려고 노력 중이며 작동하지 못하는 것 같습니다. jQuery 2.1 (Scripts.jsp에 포함)을 사용하고 있습니다.jquery-steps 사용 중 문제
JSP로 :
<link rel="stylesheet" href="/eServices/css/jquery.steps.css"
type="text/css" />
<jsp:include page="/pages/includes/Scripts.jsp" />
<script type="text/javascript"
src="<s:text name="cp.globalContextPath"/>js/jquery.steps.js"></script>
<s:div id="wrapper">
<s:div id="maincontent">
<s:form name="tabs_form" id="tabs_form" cssClass="tabcontrol">
<h3>Intake</h3>
<fieldset id="intake" class="step">
...a few fields
</fieldset>
<h3>Details</h3>
<fieldset id="details" class="step">
...a few more fields
</fieldset>
<h3>Comments</h3>
<fieldset id="comments" class="step">
...a few more fields
</fieldset>
</s:form>
</s:div>
</s:div>
jQuery를 : 나는 응용 프로그램을 실행할 때
$(function() {
var form = $("#tabs_form");
form()
.validate(
{
rules : {
"reportedByName" : {
required : true
},
"reportedByPhone" : {
required : true
}
},
messages : {
"reportedByName" : {
required : "The Reported By Name is required."
},
"reportedByPhone" : {
required : "The Reported By Phone Number is required."
}
},
errorContainer : $('#errorContainer'),
errorLabelContainer : $('#errorContainer ul'),
wrapper : 'li'
});
form.steps({
headerTag : "h3",
bodyTag : "fieldset",
transitionEffect : "slideLeft",
onStepChanging : function(event, currentIndex, newIndex) {
form.validate().settings.ignore = ":disabled, :hidden";
return form.valid();
},
onFinishing : function(event, currentIndex) {
form.validate().settings.ignore = ":disabled";
return form.valid();
},
onFinished : function(event, currentIndex) {
alert('Submitted!');
}
});
});
, 나는 어떤 탭이 표시되지 않습니다 여기 내 코드입니다. 헤더와 필드 세트 태그로 구분 된 하나의 긴 페이지가 있습니다. 그래서 나는 무엇을 놓치고 있습니까? 다른 .js 파일이 필요합니까?
감사합니다.