Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 387
  • Last Modified:

Jquery Dialog empty

Hi again,
I have set up a dialog box for updating or creating a new record which opens by a link click
<a href="javascript:getAddRemark()">Add Remark</a>

Open in new window

which calls my script
 function getAddRemark() {
            $.ajax({
                type:"GET",
                url:"/Remarks/Create/" + TreeId,
                success: function(content) {
                    $("#rinput").dialog({modal: true, width:425, resizable: false, title: "Add Remark", dialogClass: "mydialog" });                    
                    $("#irinput").html(content);                   
                    $(".date").datepicker();           

                }                              
            });            
        }

Open in new window


About 8/10 times everything runs perfect but every once in a while the dialog opens and is empty (No labels, textboxes or dropdowns).

I have no idea what is causing it so any help would be highly appreciated.

Thanks
0
Niall292
Asked:
Niall292
  • 3
1 Solution
 
Ioannis ParaskevopoulosCommented:
Have you tried using
$( document ).ready

Open in new window


$( document ).ready( function getAddRemark() {
            $.ajax({
                type:"GET",
                url:"/Remarks/Create/" + TreeId,
                success: function(content) {
                    $("#rinput").dialog({modal: true, width:425, resizable: false, title: "Add Remark", dialogClass: "mydialog" });                    
                    $("#irinput").html(content);                   
                    $(".date").datepicker();           

                }                              
            });            
        });

Open in new window

0
 
Niall292Author Commented:
I could be wrong but I don't think $(document).ready comes into this issue as it is a named function and is being called by a button click.

I will try it anyway
0
 
Niall292Author Commented:
When I put in $(document).ready it treats it like I'm trying to call it when the page opens and then fails because there are no parameters yet
0
 
Chris StanyonCommented:
Can't see a specific problem in your code, although there are a couple of things to improve it.

Firstly, make sure your function returns false, which will prevent the link from being followed.

Assuming the AJAX request grabs the content for the dialog, try populating the dialog before calling it:

$("#irinput").html(content);                   
$(".date").datepicker();           
$("#rinput").dialog({modal: true, width:425, resizable: false, title: "Add Remark", dialogClass: "mydialog" });

Open in new window

When the dialog appears and is empty, check the content that is being returned from your script - if that's empty, then the problem is with your server-side script - not your jQuery. If you're using FireFox/Firebug then you can see exactly what the AJAX call is doing (parameters being passed / response from the server etc.).

You may also want to add an error handler to your AJAX call (although if the dialog is showing then an error isn't being fired!)
0
 
Niall292Author Commented:
Chris,
Thanks again, that seems to have done the trick swapping the lines. So far I tried it about 8 times and it was populated every time.

Thanks
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now