使用远程 link gsp 时如何将一个字段的值设置为参数
How to set value of one field as param while using remote link gsp
我是第一次使用 gsp,我需要在单击按钮时更新值。为此,我正在使用远程 link.
我有以下 id 为 update_${test.id}
的文本区域
<g:textArea name="test" id="update_${test.id}" value="${test?.number}" disabled="${readonly ? true : false}" />
我需要能够将参数 required
的值设置为 textArea 内的值。
<g:remoteLink action="updateTest" params="{required:$('#update_${test.id}').val()}" update="updateOnClick" class="btn btn-default"><span class="icon-save"></span></g:remoteLink>
这显然是一种错误的做法。有人可以帮我解决这个问题吗?
以下示例使用 ajax 使用序列化将所有表单字段传递给控制器,您可以像我们在下面所做的那样通过打印文本区域的值来选择您想要的操作.
然后我们渲染一些文本,在屏幕上更新 div。
控制器
class TestStuffController {
def index(){}
def myAction() {
println params.myTextArea
render 'Updated'
}
}
index.gsp
<!DOCTYPE html>
<html>
<head>
<meta name="layout" content="main">
<script type="text/javascript">
$( document ).ready( function() {
$( '#myButton' ).on( 'click' , function (event) {
$.ajax({
url: "${g.createLink( controller: 'testStuff', action: 'myAction')}",
type: "POST",
data: $( "form" ).serialize(),
success: function ( data ) {
$( '#myDiv' ).html( data );
},
error: function( j, status, eThrown ) { console.log( 'Error ' + eThrown ) }
});
});
});
</script>
</head>
<body>
<div>
<div id="myDiv"></div>
<g:form id="myForm">
<g:textArea name="myTextArea" id="myTextArea" />
<button type="button" name="myButton" id="myButton">Update</button>
</g:form>
</div>
</body>
</html>
这是一个 g:link 传递单个名称值对的示例。要添加多个,只需在方括号内添加一个逗号和第二个名称值对。
<g:link role="button" class="btn btn-success" action="details" params="${['folderNumber' : instance.fileFolderNumber]}" title="Details">Details</g:link>
请注意 g:remoteLink 已弃用 我已改用 JQuery 进行 Ajax 调用。
感谢您提出的所有建议。这就是所需要的。我可以根据你的建议找到我的解决方案。
<g:javascript>
function updateMethod(testId) {
$.ajax({url: "${g.createLink( controller: 'testHandler',
action: 'testOnChange')}",
type: "POST",
data: {'id': testId},
success: function ( data ) {
$("#rowUpdated").show().delay(2500).fadeOut();
$("#updateFailed").hide();
},
error: function( j, status, eThrown ) {
$("#updateFailed").show().delay(2500).fadeOut();
$("#rowUpdated").hide();
console.log( 'Error ' + eThrown )
}
});
}
</g:javascript>
<a href="javascript:void(0)" onclick="updateMethod('${test.id}');return false;" class="btn btn-default"><span class="icon-save"></span></a>
我是第一次使用 gsp,我需要在单击按钮时更新值。为此,我正在使用远程 link.
我有以下 id 为 update_${test.id}
<g:textArea name="test" id="update_${test.id}" value="${test?.number}" disabled="${readonly ? true : false}" />
我需要能够将参数 required
的值设置为 textArea 内的值。
<g:remoteLink action="updateTest" params="{required:$('#update_${test.id}').val()}" update="updateOnClick" class="btn btn-default"><span class="icon-save"></span></g:remoteLink>
这显然是一种错误的做法。有人可以帮我解决这个问题吗?
以下示例使用 ajax 使用序列化将所有表单字段传递给控制器,您可以像我们在下面所做的那样通过打印文本区域的值来选择您想要的操作.
然后我们渲染一些文本,在屏幕上更新 div。
控制器
class TestStuffController {
def index(){}
def myAction() {
println params.myTextArea
render 'Updated'
}
}
index.gsp
<!DOCTYPE html>
<html>
<head>
<meta name="layout" content="main">
<script type="text/javascript">
$( document ).ready( function() {
$( '#myButton' ).on( 'click' , function (event) {
$.ajax({
url: "${g.createLink( controller: 'testStuff', action: 'myAction')}",
type: "POST",
data: $( "form" ).serialize(),
success: function ( data ) {
$( '#myDiv' ).html( data );
},
error: function( j, status, eThrown ) { console.log( 'Error ' + eThrown ) }
});
});
});
</script>
</head>
<body>
<div>
<div id="myDiv"></div>
<g:form id="myForm">
<g:textArea name="myTextArea" id="myTextArea" />
<button type="button" name="myButton" id="myButton">Update</button>
</g:form>
</div>
</body>
</html>
这是一个 g:link 传递单个名称值对的示例。要添加多个,只需在方括号内添加一个逗号和第二个名称值对。
<g:link role="button" class="btn btn-success" action="details" params="${['folderNumber' : instance.fileFolderNumber]}" title="Details">Details</g:link>
请注意 g:remoteLink 已弃用 我已改用 JQuery 进行 Ajax 调用。
感谢您提出的所有建议。这就是所需要的。我可以根据你的建议找到我的解决方案。
<g:javascript>
function updateMethod(testId) {
$.ajax({url: "${g.createLink( controller: 'testHandler',
action: 'testOnChange')}",
type: "POST",
data: {'id': testId},
success: function ( data ) {
$("#rowUpdated").show().delay(2500).fadeOut();
$("#updateFailed").hide();
},
error: function( j, status, eThrown ) {
$("#updateFailed").show().delay(2500).fadeOut();
$("#rowUpdated").hide();
console.log( 'Error ' + eThrown )
}
});
}
</g:javascript>
<a href="javascript:void(0)" onclick="updateMethod('${test.id}');return false;" class="btn btn-default"><span class="icon-save"></span></a>