2
jQuery를 사용하여 양식 선택을 처리하는 HTML 양식이 있습니다. 양식 제출 및 처리는 올바르게 이루어졌지만 제출 후 필드를 지우고 제출 된 "명령문"단추 옆에 메시지를 넣으십시오. 고맙습니다.양식 제출 후 필드 지우기 및 메시지 제공
HTML5
<!DOCTYPE html>
<html lang="en">
<head>
<title>Observation Checklist: World-class-teaching-pitch</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h2>Observation Checklist: World-class-teaching-pitch</h2>
<p>Make your selections from each of the drop down boxes:</p>
<form id="sform" name="myForm">
<div class="form-group">
<label for="salesperson">Select a salesperson:</label>
<select class="form-control" id="salesperson" name="salesper">
<option value="Jerry Robinson">Jerry Robinson</option>
<option value="John Doe">John Doe</option>
<option value="Sally Smith" selected>Sally Smith</option>
<option value="Carol Adams">Carol Adams</option>
<option value="Zeek Mowat">Zeek Mowat</option>
</select>
<br>
<label for="sel1">Provided assessment of cust's key challenges:</label>
<select class="form-control" id="sel1" name="provided">
<option value="Very Strong">Very Strong</option>
<option value="Strong">Strong</option>
<option value="Average" selected>Average</option>
<option value="Needs Improvement">Needs Improvement</option>
<option value="High priority improvement">High priority improvement</option>
</select>
<br>
<label for="sel2">Shared anecdotes of other companies:</label>
<select class="form-control" id="sel2" name="shared">
<option value="Very Strong">Very Strong</option>
<option value="Strong">Strong</option>
<option value="Average" selected>Average</option>
<option value="Needs Improvement">Needs Improvement</option>
<option value="High priority improvement">High priority improvement</option>
</select>
<br>
<label for="sel3">Asked for reactions:</label>
<select class="form-control" id="sel3" name="reaction">
<option value="Very Strong">Very Strong</option>
<option value="Strong">Strong</option>
<option value="Average" selected>Average</option>
<option value="Needs Improvement">Needs Improvement</option>
<option value="High priority improvement">High priority improvement</option>
</select>
<br>
<label for="sel4">Established goodwill:</label>
<select class="form-control" id="sel4" name="goodwill">
<option value="Very Strong">Very Strong</option>
<option value="Strong">Strong</option>
<option value="Average" selected>Average</option>
<option value="Needs Improvement">Needs Improvement</option>
<option value="High priority improvement">High priority improvement</option>
</select>
<br>
<button type="submit" class="btn btn-default">Submit</button>
</div><!-- end of form-group -->
</form>
</div> <!--end of container-->
<script type="text/javascript" src="js/xapiwrapper.min.js"></script>
<script src="js/init.js"></script>
</body>
</html>
JS
$(document).ready(function(){
$('#sform').on('submit', function(e) { //use on if jQuery 1.7+
e.preventDefault(); //prevent form from submitting
// Get the values from the drop down boxes
var salesper = $("select#salesperson").val();
var provided = $("select#sel1").val() + " on 'Provided assessment of cust's key challenges'";
var shared = $("select#sel2").val() + " on 'Shared anecdotes of other companies'";
var reaction = $("select#sel3").val() + " on 'Asked for reactions'";
var goodwill = $("select#sel4").val() + " on 'Established goodwill'";
var myArray = [provided, shared, reaction, goodwill];
var myLen = myArray.length;
for (i = 0; i < myLen; i++){
var stmt =
//actor
{"actor" : {"mbox" : "mailto:[email protected]",
"name" : salesper},
//verb
"verb" : {"id" : "http://adlnet.gov/expapi/verbs/scored",
"display" : {"en-US" : "scored"}},
//object
"object" : {"id" : "http://adlnet.gov/expapi/activities/question",
"definition" : {"name" : {"en-US" : myArray[i]}}
},
//category information
"context" : {"contextActivities" : {"category" :
{"id" : "http://www.example.com/observation",
"definition" : {"name" : {"en-US" : "observation"}}}}
}
}; //end of stmt
ADL.XAPIWrapper.changeConfig({
'endpoint': 'https://lrs.adlnet.gov/xapi/',
'user': 'xapi-tools',
'password': 'xapi-tools',
});
ADL.XAPIWrapper.sendStatement(stmt, function(resp, obj){
ADL.XAPIWrapper.log("[" + obj.id + "]: " + resp.status + " - " + resp.statusText);});
}//end of for loop
}); //end of submit function
}); //end of document ready
도움 아래의 대답을 했습니까, 또는이다 아직도 문제가 있습니까? –
죄송합니다. 예, 문제가 해결되어 정확한 답변으로 표시됩니다. 프롬프트에 감사드립니다. –