jQuery UI Widgets › Forums › Navigation › Expander › Expanding started
Tagged: ajax, expander, expanding, load on demand
This topic contains 1 reply, has 2 voices, and was last updated by Minko 13 years, 7 months ago.
Hello,
I’m currently using jqxExpander for my personal web page. I want to load data when the user click on expander’s header (i.e. when the expanding process have been started). Can you give me an advice how can I do this?
Greetings,
Alex.
Hello Alex,
Yes you can do this by catching the “expanding” event. In the following code snippet you can see working example.
In your main page you’re initializing an expander:
<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <title>test</title> <link rel="stylesheet" href="js/css/jqx.css" type="text/css"/> <script type="text/javascript" src="Scripts/jquery-1.6.1.js"></script> <script type="text/javascript" src="js/jqxCore.js"></script> <script type="text/javascript" src="js/jqxExpander.js"></script> <script type="text/javascript"> $(document).ready(function () { $('#expander').jqxExpander({ expanded: false }); $('#expander').bind('expanding', function (event) { $.ajax({ url: 'myData.txt', type: 'get', success: function (data) { $('#expander').jqxExpander('setContent', data); } }); }); }); </script></head><body> <div id="expander"> <div>Expander</div> <div></div> </div></body></html>
The file myData.txt for example is the content you wish to load.
Some text.
Best regards!
You must be logged in to reply to this topic.
