CODEWITHSUNDEEP
grailsgrails-plugin
Mike
Mike

Reputation: 113

Grails UI(plugin) dialog not firing the controller action

Happy new year to all,

I am working on a project where I have to show the details of each record in the "list" in a dialog (modal window) window while the user click the link on each record in the list. I am trying to accomplish this using the GrailUI plugin. Here is my code:

<gui:dialog width="300px" 
           controller="tag" 
           action="showTags" 
           params=" [id:userInstance.userId]" 
           update="dialogData" 
           draggable="true" 
           triggers="[show:[type:'link', text:'Show Tags', on:'click']]" 
           modal="true">
   <div id='dialogData'>This will be updated by the controller action....</div>

For some reason the dialog tag is not firing the controller action. It opens the dialog window, but shows just this message "This will be updated by the controller action....". It's not showing the controller action rendered output(view). Could someone help me to understand what I am doing wrong?

Jquery and jquery-ui are the other plugins I am using in my project.

Appreciate your help.

Edit

     def test(Integer max) {
        ....
        ....
        userInstanceList = User.list(params)
        render (view: "test", model: [userInstanceList: userInstanceList, userInstanceTotal: User.count()])

}           

def showTags () {
    def user = User.findByUserId(params.id)
        def tagInstanceList = user.tags
    render(view: "test", model: [tagInstanceList: tagInstanceList])
}

Upvotes: 1

Views: 617

Answers (1)

coderLMN
coderLMN

Reputation: 3076

If you want something be submit to remote you need to set form="true". Then any form elements can be placed inside the dialog tag without defining a form. When form="true", the dialog creates its own form.

Here is a example I have tested:

test.gsp:

    <html>
        <head>
            ....
            <r:require modules="grailsui-dialog"/>    
        </head>
        <body class="yui-skin-sam">            
            <gui:dialog width="300px" 
               controller="test" 
               action="showTags" 
               params=" [id:userInstance.userId]" 
               form="true"                        <!-- the key to remote submit -->
               update="dialogData" 
               draggable="true" 
               triggers="[show:[type:'link', text:'Show Tags', on:'click']]" 
               modal="true" >    
               <!-- You can put any input element here, which will be submitted in the form-->
               <div id='dialogData'>This will be updated by the controller action....</div>   
           </gui:dialog>
       </body>
   </html>

TestController:

class TestController {

    def test() { 
        .........
    }

    def showTags() {
        def user = User.findByUserId(params.id)
        def tagInstanceList = user.tags
        render(template: "ajaxResponse", model: [tagInstanceList: tagInstanceList, user:user])          //render a template, not a view
    }

For an Ajax request, you can not render a view, which will replace the original page. Instead, you should send back a template with the tags you want to show in the dialog:

_ajaxResponse.gsp

<h3>Tag List of user ${user.username}</h3>
<g:each in="${tagInstanceList}" var="tag">
    <p>${tag}</p>
</g:each>

Upvotes: 2

Related Questions