我有一个带有两个选择下拉菜单的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>
这是我的 Controller 。基于在索引页面中选择的值并单击比较按钮，我正在调用ajax函数，该函数调用 Controller 。在 Controller 中，我正在传递选定的值，并从数据库中检查它们是否相同，并且基于响应，我需要在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函数中的 Controller 接收响应。并在index.gsp页面中显示结果
最佳答案
请研究并了解gsp和 Controller 中的修复程序
这是您的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>
这是您的 Controller 固定的
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()
}
}
});
}
})
然后在第二个字段更改时自动触发
关于javascript - 在GSP页面文本区域中显示数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42089898/