0

I have a page what contains a long running Ajax request on loading one of its element (a 3rd party grid component). This Ajax request delays the firing of the ready event on the document. I use jQuery UI plugins (button, dilog). I used to apply them on elements inside the $(document).ready handler, but now in this case until the Ajax process finishes, I see lots of pure, unformatted ugly elements. The request could take up to 4-5 seconds, so it is quite annoying. What could be a good solution for this scenario?

I could probably hide the corresponding elements until the request finishes, and then show them, but I would prefer some more generic technique if there is any.

In addition, unfortunately I don't have too much control over this component, so I cannot control when and how it is loading its data.

EDIT: The request delaying the ready event is of course not an Ajax request, it is the long processing of the component's MVC partial view. But the problem still exists, because the other parts of the page ("above" this area) loads earlier.

EDIT: I'm working in ASP.NET MVC3, probably some output buffering technique would help, which would prevent flushing any content until the whole request is processed (something like ob_XXX functions in PHP).

Zoltán Tamási
  • 10,479
  • 3
  • 51
  • 73
  • Make your ajax request asynchronous, otherwise there really isn't a whole lot you can do about it aside from pre-formatting the jquery ui widgets by adding the classes to the elements manually. – Kevin B Feb 07 '13 at 19:38
  • 1
    the (first) a in ajax means asynchronous, how can it delay the method? – efkah Feb 07 '13 at 19:43
  • @efkah, you are right, I double checked it, and of course it's not an ajax request, just a pure long running first load of the component's MVC partial view. I'm gonna update my question, however the problem still exists. – Zoltán Tamási Feb 07 '13 at 19:47
  • I clarified the environment in the question, it's ASP.NET MVC3, and perhpas some output buffering control would lhelp in such situations. – Zoltán Tamási Feb 07 '13 at 19:54
  • would love to see some code. which view engine do you use, aspx or razor? – efkah Feb 12 '13 at 14:29

2 Answers2

0

What about starting your ajax request after dom is ready and the UI is created?

mika
  • 1,401
  • 1
  • 11
  • 23
0

Until I find a more appropriate technique probably in server-side, I added a special CSS class to these elements with a name "hidden-until-ready", which defines "display: none". In document ready event I do a one line jQuery to show them just before applying the plugins. Thanks for the responses.

Zoltán Tamási
  • 10,479
  • 3
  • 51
  • 73