我有一个带有两个选择下拉列表的gsp页面。根据我选择的值并单击比较按钮,它从数据库中检索值并进行操作。 (如比较)如果它们在相同的gsp页面中是相同的打印,因为它们是相同的。如果它们不相同,那么该值必须在索引gsp页面中与两个文本区域并排显示。
this is my gsp page
<!DOCTYPE html>
<html>
<head>
<meta name="layout" content="main" />
<title>Json Compare</title>
<g:javascript plugin="jquery" library="jquery" src="jquery/jquery-1.7.2.js"/>
<script>
$(document).ready(function(){
$('.testMe').click(function(){
var URL="${createLink(controller:'jsonComparison',action:'compare')}";
alert(URL)
alert(firstText.value)
alert(secondText.value)
$.ajax({
url:URL,
data: {firstText:firstText.value,secondText:secondText.value},
success: function(data){
//console.log(resp);
$("#result").val(data).show()
}
});
});
});
</script>
</head>
<body>
<g:form>
<div></div><label>From Time</label><g:select name="firstText" from="${eventsList}" noSelection="['':'-Choose the From Date-']"/>
<label>To Time</label><g:select name="secondText" from="${eventsList}" noSelection="['':'-Choose the To Date-']"/></div>
<button class="testMe">Compare</button>
<br>
<textarea id="result" style="display: none"></textarea>
<%-- <textarea id="result1" style="display:none"></textarea> <textarea id ="result1" style="display:none"></textarea> --%>
</g:form>
</body>
</html>
这是我的控制器。根据索引页面中选择的值,然后单击比较按钮,我调用一个调用控制器的ajax函数。在控制器中,我传递选定的值并检查数据库是否相同,并根据响应我需要在index.gsp中显示消息
class JsonComparisonController {
def preparedStatementService
def index() {
//List eventsList = preparedStatementService.retrieveValuesFromDb()
def eventsList = ['2017-10-11 04.94.34', '2016-09-11 04.94.44', '2017-10-12 04.94.89']
render view: 'index', model: [eventsList: eventsList]
}
def compare() {
println "The Compare is called"
String firstParameter = params.firstText
String secondParameter = params.secondText
def returnValue
println "The first value is: " + firstParameter + "The second value is: " + secondParameter
if(firstParameter !=null && secondParameter !=null && firstParameter.length() > 0 && secondParameter.length() > 0){
println "Both the values are not null"
if(firstParameter.equals(secondParameter)){
println "First and second values are equal"
returnValue = "The Json are Equal and no MisMatch"
render status: 200, text: returnValue
}else{
println "The values are not equal"
String value1 = "The First Json values"
String value2 = "The Second Json Values"
render status: 200, model:[firstText:value1,secondText:value2]
}
}else{
render status: 200, text: "Please select the Time"
}
}
}
我如何从ajax函数中的控制器接收响应。并在index.gsp页面中显示结果
答案 0 :(得分:0)
请研究并了解gsp&amp ;;调节器 这是你的gsp修复:
<!DOCTYPE html>
<html>
<head>
<meta name="layout" content="main" />
<title>Json Compare</title>
<g:javascript plugin="jquery" library="jquery" src="jquery/jquery-1.7.2.js"/>
<script>
$(document).ready(function(){
$('.testMe').click(function(){
var URL="${createLink(controller:'jsonComparison',action:'compare')}";
alert(URL)
alert(firstText.value)
alert(secondText.value)
$.ajax({
url:URL,
data: {firstText:firstText.value,secondText:secondText.value},
success: function(data){
if (data.status===true) {
//notice .html since it is content of textArea
$('#result1').html(data.result)
//if this was <input type=text value="something"
//then result would be the value of the form field
//$('#result1').val(data.result)
} else { /// if (data===false ) {
$('#result1').html(data.value1).show()
$('#result2').html(data.value2).show()
}
}
});
});
});
</script>
</head>
<body>
<g:form>
<div></div><label>From Time</label><g:select name="firstText" from="${eventsList}" noSelection="['':'-Choose the From Date-']"/>
<label>To Time</label><g:select name="secondText" from="${eventsList}" noSelection="['':'-Choose the To Date-']"/></div>
<button class="testMe">Compare</button>
<br>
<textarea id="result" style="display: none"></textarea>
<%-- <textarea id="result1" style="display:none"></textarea> <textarea id ="result1" style="display:none"></textarea> --%>
</g:form>
</body>
</html>
这是您的控制器已修复
class JsonComparisonController {
def preparedStatementService
def index() {
//List eventsList = preparedStatementService.retrieveValuesFromDb()
def eventsList = ['2017-10-11 04.94.34', '2016-09-11 04.94.44', '2017-10-12 04.94.89']
render view: 'index', model: [eventsList: eventsList]
}
def compare() {
String firstParameter = params?.firstText //make it nullsafe not going to throw an exception with ?
String secondParameter = params?.secondText
def returnValue
//this is doing exactly what you were doing long winded
def reply
if(firstParameter && firstParameter) {
if (firstParameter == firstParameter ){
reply=[status:true, result:"The Json are Equal and no MisMatch"]
}else{
reply = [status:false, value1:"The First Json values ${firstParameter}", value2:"The Second Json Values ${secondParameter}"]
}
}else{
reply = [status:false, value1:"issue here", value2:"issue here"]
}
render status: 200, text:(reply as JSON).toString()
}
}
而不是点击我按钮就可以
$('#secondText').on('change', function() {
var val = $(this).val();
var other = $('#firstText').val();
if (val!='' && other!='') {
var URL="${createLink(controller:'jsonComparison',action:'compare')}";
alert(URL)
alert(val)
alert(other)
$.ajax({
url:URL,
data: {firstText:val,secondText:other},
success: function(data){
if (data.status===true) {
//notice .html since it is content of textArea
$('#result1').html(data.result)
//if this was <input type=text value="something"
//then result would be the value of the form field
//$('#result1').val(data.result)
} else { /// if (data===false ) {
$('#result1').html(data.value1).show()
$('#result2').html(data.value2).show()
}
}
});
}
})
然后在更改第二个字段时自动触发