Site:Frontend:Controllers
MetrixJustin (Talk | contribs) (→Instantiating) |
MetrixAdmin (Talk | contribs) (→Using registerProfileFunctions) |
||
| (2 intermediate revisions by 2 users not shown) | |||
| Line 1: | Line 1: | ||
= Introduction = | = Introduction = | ||
| − | A Controller is a javascript class | + | A Controller is a javascript class used to organize all javascript functionality within a particular page or module. A controller can hold other controllers, so you can imagine a site controller managing all of the page controllers. |
| − | + | This class is broken down by functionality and should only be instantiated when necessary. | |
| − | = | + | = Basic Site Controller = |
<script type="text/javascript"> | <script type="text/javascript"> | ||
| Line 50: | Line 50: | ||
}); | }); | ||
</script> | </script> | ||
| + | |||
| + | == Using registerProfileFunctions == | ||
| + | |||
| + | In the example above, we never called the registerProfileFunctions function, meaning the getUserState listener is never active. | ||
| + | |||
| + | Example | ||
| + | site.registerProfileFunctions(); | ||
| + | |||
| + | Once its active and getUserState is clicked, the script references myThis.urls['userStateUrl'] which was set earlier in the registerUrls function. | ||
Latest revision as of 11:16, 20 June 2012
Contents |
[edit] Introduction
A Controller is a javascript class used to organize all javascript functionality within a particular page or module. A controller can hold other controllers, so you can imagine a site controller managing all of the page controllers.
This class is broken down by functionality and should only be instantiated when necessary.
[edit] Basic Site Controller
<script type="text/javascript">
function siteController(authUser, publicUser, publicContentId) {
this.authUser = authUser;
this.publicUser = publicUser;
this.contentId = publicContentId;
this.urls = [];
}
siteController.prototype.registerUrls = function(urls) {
this.urls = urls;
};
siteController.prototype.registerProfileFunctions = function() {
var myThis = this;
$('#getUserState').click(function(e) {
e.preventDefault();
$.ajax({
type: 'get',
url: myThis.urls['userStateUrl'],
data: {
'user': myThis.publicUser
},
success: function(data) {
alert('This user is '+ data.state);
}
});
});
};
</script>
[edit] Instantiating
In the example controller, siteController is instantiated with the authenticated username, the public username, and the public contentId which are stored so they can be accessed throughout the class.
<script type="text/javascript">
var site = new siteController('Justin', 'Roy', '');
$(document).ready(function() {
site.registerUrls({
'userStateUrl' : 'http://example.com/userstate'
});
});
</script>
[edit] Using registerProfileFunctions
In the example above, we never called the registerProfileFunctions function, meaning the getUserState listener is never active.
Example
site.registerProfileFunctions();
Once its active and getUserState is clicked, the script references myThis.urls['userStateUrl'] which was set earlier in the registerUrls function.
