点击单选按钮

Question

在我的网站上，我有一个表格，允许您发送选择投票，之后选择投票允许您发送（可选）评论或照片或音频，此按钮允许您发送所有内容。

搜索特定位置后会显示投票方式。

现在我想更改功能，我希望点击投票后立即直接保存，然后一如既往地显示发送评论和照片的能力。

这是我的表格：

<script type="text/javascript">
	$(".sinButtonVote > img").click(function(e){
	$(this).parents("div.sinWebQuestion").addClass("voteChosen");
	$("#sendVoteButton").removeClass("hidden");
	$("#sendOpinion").removeClass("hidden");
});
  $("div.sinBottomVoteButton").click(function(e){
  $("#sendVoteButton").removeClass("hidden");
});
function afterOpinionSent() {
	$("#wsCompany").val("Select Location").change();
	}
</script>

<form th:action="@{/opinion/vote}" 
 enctype="multipart/form-data" method="post"
 data-successHandler="afterOpinionSent"
 class="s_ajaxForm">
	<input type="hidden" name="webLocationId" th:value="${webLocation.id}" th:if="${webLocation!=null}"/>
	<div th:each="webQuestion : ${webQuestions}" class="row WebQuestion">
		<div class="col-sm-6">
			<div th:text="${webQuestion.question}" class="sinButtonVoteLabel">Question?</div>
			</div>
		<div class="col-sm-6">
			<label th:each="vote : ${ {3, 2, 1, 0} }" class="radio-inline ButtonVote">
				<input type="radio" th:name="|questionVote[${webQuestion.id}]|" th:value="${vote}"/>
				<img yada:src="@{|/res/img/question/${webQuestion.iconName+vote}.png|}" th:alt-title="|Voto ${vote}|">
			</label>
		</div>
		</div>
	<div style="text-align: center; margin-top: 15px;" id="sendOpinion" class="s_ajaxForm hidden">
		<div style="float: left; width: 35%;" class="BottomVoteButton">
			<label class="btn btn-default" data-toggle="collapse" data-target="#voteComment">
				<img yada:src="@{/res/img/question/comment.png}" title="Comment">
				<span>Opinion</span>
			</label>
			</div>
			<div style="float: left; width: 30%;" class="BottomVoteButton">
		<label class="btn btn-default btn-file">
		<img yada:src="@{/res/img/question/photo.png}" height="35px" title="Photo"><br />
		<span>Photo</span>
		<input type="file" accept="image/*" capture="camera" class="hidden" name="photo"> 
		</label>	
		</div>
		<div style="overflow: hidden; width: auto;" class="BottomVoteButton">
			<label class="btn btn-default btn-file">
				<img yada:src="@{/res/img/question/Audio.png}" title="Audio">
				<span>Audio</span>
				<input type="file" accept="audio/*" capture="microphone" class="hidden" name="audio"> 
			</label>
		</div>
	<div id="voteComment" class="collapse" th:if="${webLocation!=null}">
	 <div class="form-group">
		<textarea class="form-control" rows="5" maxlength="1024" name="comment" placeholder="Comment..."></textarea>
		</div>
	</div>
</div>
<button id="sendVoteButton" type="submit" class="s_ajaxForm btn btn-default btn-block hidden">Send</button>
</form>

这是我的意见控制器.java：

@RequestMapping("/vote") // Ajax
	public String voto(FormOpinioni formOpinioni, HttpServletRequest request, HttpServletResponse response, Model model) {
		WebLocation webLocation = null;
		if (formOpinioni.getWebLocationId() != null) {
			webLocation = webLocationRepository.findOne(formOpinioni.getWebLocationId());
		}
		if (webLocation==null) {
			return "/yada/ajaxError"; 
		}
		
		YadaBrowserId yadaBrowserId = yadaBrowserIdDao.ensureYadaBrowserId(COOKIE_UUIDNAME, COOKIE_EXPIRATIONSEC, request, response);
		
		// Save WebResult
		String ipAddress = request.getRemoteAddr();
		for (Map.Entry<Long,String> idAndVote : formOpinioni.getQuestionVote().entrySet()) {
			long questionId = idAndVote.getKey();
			int vote = Integer.parseInt(idAndVote.getValue());
			boolean stored = webResultDao.storeResult(questionId, vote, yadaBrowserId, ipAddress);
		}
		
		// Save il comment
		String commento = formOpinioni.getCommento();
		if (!StringUtils.isBlank(comment) && webLocation.isEnabled()) {
			boolean stored = webAttachmentDao.storeAttachment(WebAttachment.TYPE_COMMENT, comment, ipAddress, webLocation, yadaBrowserId);
		}

		// Save photo
		saveUpload(WebAttachment.TYPE_IMAGE, formOpinioni.getPhoto(), webLocation, yadaBrowserId, ipAddress, response, model);
		
		// Save audio
		saveUpload(WebAttachment.TYPE_AUDIO, formOpinioni.getAudio(), webLocation, yadaBrowserId, ipAddress, response, model);
		
		return thanksForOpinion("Registered opiniono", model);
	}
	
	private String thanksForOpinion(String title, Model model) {
		return YadaNotify.instance(model)
				.yadaOk().yadaAutoclose(2000)
				.yadaTitle(title)
				.yadaMessage("<p style='text-align:center; min-height:60px;'>Thanks You for opinion</p>")
				.yadaSave();
	}

如何更改代码？

Answer 1

您必须进行以下更改

<script th:inline="javascript">
    $(".sinButtonVote > img").click(function(e){
    $(this).parents("div.sinWebQuestion").addClass("voteChosen");
    $("#sendVoteButton").removeClass("hidden");
    $("#sendOpinion").removeClass("hidden");
});
  $("div.sinBottomVoteButton").click(function(e){
  $("#sendVoteButton").removeClass("hidden");
});
function afterOpinionSent() {
    $("#wsCompany").val("Select Location").change();
    }
$(document).ready(function(){

$("input[@name='YOUR_RADIO_INPUTNAME']").click(function(){

$("#YOUR_FORM_ID").ajaxSubmit({url: '/vote', type: 'post'});
});
});
</script>

制作一个只能处理投票条目的Action方法。