Question

I am using Spring MVC and i would like when i insert a record into the database via a POST when the user is returned to the view i would like to show something like a Jquery dialog to the user that says the transaction was successful/display an error message to the use in the dialog.

I implemented the Jquery dialog but for some reason its not working the way i would like it to. I have created it like this :

jquery

 function ShowDialog() {
            $( "#dialog" ).dialog({
                modal: true,
                buttons: {
                    Ok: function() {
                        $( this ).dialog( "close" );
                    }
                }
            });
        }

I attached this to an element event when change:

$('#results').change(function()){

            if($('#results').val().length != 0){

                ShowDialog();


            }


        }    

However when the form loads i get a blank dialog popping up. The element ‘results‘ is empty and gets set form the server using model.addAttribute(“results”,”Record Was Updated”) and where the i created named ‘dialog’ is located i can see the dialog icon being displayed.

html

<div id="dialog" title="Server Response">
            <p>
                <span class="ui-icon ui-icon-info" style="float: left; margin: 0 7px 50px 0;"></span>
                <label id="results">${results}</label>
            </p>

</div>

Answer 1

In your change event change the second line to this:

if($('#results').html().length != 0){

The .val() only works for form elements (input, select and textarea), whereas #results is a normal html element.