Question

Having some difficulty using a variable within an ajax() function. I know it is because the variable is not in the scope of the ajax() call but not sure how to fix this. I’ve read a bit about closures and callbacks for things like this but not really sure how to actually apply that to my code.

Code summary: on click() I get user_notes via ajax, and on that success I pop up a dialog box displaying the user_notes (all this works so far). Where it breaks down is when I then try and do another ajax call when the “Save” button is pressed. In that second ajax call user_notes is undefined within that scope.

How can I use user_notes within that second ajax call?

 $(".editSaved").click(function() {
            save_id = $(this).attr('id');
            var user_notes;

            //GET USER NOTES
            $.ajax ({
                url:"journal-util.php",
                data:"q=0&f=user_notes&save_id="+save_id,
                success: function(user_notes){

                    //BUILD SAVE DIALOG
                    div="<div><textarea rows=15 cols=27 id='RowSave'>"+user_notes+"</textarea></div>";
//AT THIS POINT USER_NOTES HAS A VALUE
                    success="<div>Updated!</div>";
                    $(div).dialog({ 
                        buttons: { 
                            "Save": function() { 
                                var that = this;
                                var un = user_notes; //tried this, didn't work
                                $.ajax ({
                                    url:"journal-util.php",
                                    data:"q=0&f=update&user_notes="+un, //un is empty
                                    success: function(result){
                                        alert(result);
                                        $(that).dialog("close");
                                        //$(success).dialog();
                                    }
                                })
                            },
                            "Cancel": function() { 
                                $(this).dialog("close");
                            } 
                        },
                        modal: true,
                        title: 'Delete',
                        resizable: false
                    });
                }
            });
        });

Answer 1

Try this solution

un = $('#RowSave').val();

Hope this solves your problem