使用grails和ajax的bootstrap popover

只是试图在BS popover中使用ajax formRemote。一种简单形式的作品，但Ajax实现不：使用grails和ajax的bootstrap popover

1）GSP代码

<div id="addfolder"> 
      <a href="#" class="btn" id="nrfolder" rel="popover"> 
      <i class="icon-folder-close icon-large"></i></a><%--<g:message code="folder" args="[entityName]" default="New Folder"/>--%></a> 
     </div> 
     <div id="newRootFolder" style="display:none;"> 
     <form class="form-inline" style="width:280px;"> 
     <g:formRemote name="createRootFolder" url="[controller:'folders',action:'create']" onLoading="showModalSpinnerNewFolder();" onComplete="hideModalSpinnerNewFolder();" onSuccess="doResponseNewFolder(data);" > 
       <g:textField name="folderName" class="input-small" type="text" placeholder="New folder"/> 
       <input type="submit" value="Create" class="btn btn-info" /> 
       <a href="#" class="btn" onclick="$('#nrfolder').popover('hide')"/>Cancel</a> 
     </g:formRemote> 
</g:formRemote> 
    </form> 
    </div>

2）酥料饼的呼叫使用jQuery

$('#nrfolder').popover({placement:'right',title:'New Root Folder',html:true,content: function() { return $('#newRootFolder').html();} });

3）jQuery的成功事件：doResponseNewFolder功能

function doResponseNewFolder(data) { 
     alert('toto' + data.success); 
     if (data.success == 'true') { 
      var msg = data.msg; 
      // reload tree view 
      $('#tree').dynatree('getTree').reload(); 
     } else { 
      var msg = $('<ul class="errors">'); 
      for (var i = 0; i < data.errorList.length; i++) { 
       msg.append('<li>' + data.errorList[i] + "</li>"); 
      } 
     } 
     $('#new_folder_msg').html(msg); 
     $('#new_folder_msg').show(); 
    }

任何想法？

来源

2013-04-04 ludo_rj

请问您可以发布'doResponseNewFolder（data）'的内容吗？另外，你的'＃newRootFolder''div'是否意外地没有关闭，或者你是否忽略了粘贴它的结尾？ – blint 2013-04-04 21:23:53

感谢合作，div已关闭（编辑和修改） – 2013-04-04 21:34:51

不客气，但试着更准确地表达您的代码：您粘贴的HTML不是有效的XML，并且这是首先要检查的内容测试。请记住，良好的缩进是最佳实践，这将帮助您避免XML语法错误！ – blint 2013-04-04 21:50:38

看起来你搞乱了表单，让我解释一下：Grails的g:formRemote是制作ajax网页表单的助手，所以如果你看看生成的HTML，会有一个在调用中生成的表单。

事实是，您已经打开了一个表单，这是一种无效的HTML语法。第一种形式不应该存在。你可以尽管你g:formRemote给它的属性和Grails将它们传递到您的生成form：

<g:formRemote class="form-inline" style="width:280px;" name="createRootFolder" url="[controller:'folders',action:'create']" onLoading="showModalSpinnerNewFolder();" onComplete="hideModalSpinnerNewFolder();" onSuccess="doResponseNewFolder(data);" > 
     <g:textField name="folderName" class="input-small" type="text" placeholder="New folder"/> 
     <input type="submit" value="Create" class="btn btn-info" /> 
     <a href="#" class="btn" onclick="$('#nrfolder').popover('hide')"/>Cancel</a> 
</g:formRemote>

这一点，没有其他形式的叠瓦状，也就足够了。

来源

2013-04-04 21:47:18 blint

无论如何，我仍然不明白你所说的'popover'在哪里，我不太明白你想要什么：呼叫形式？（这是'＃newRootFolder'的内容） – blint 2013-04-04 21:48:19

在$（document）.ready（function（）{... – 2013-04-04 21:57:45

popover'content'参数是'bool | string' [根据它的文档] （http://daveyijzermans.nl/jquery/popover/demo.html#parameters_content），所以你应该使它成为一个字符串。当你调用'popover'时，popover将被加载，除非'trigger'的值是'none' '你真的想要什么：表单提交弹出窗口？ – blint 2013-04-04 22:07:06

使用grails和ajax的bootstrap popover

回答

相关问题