Skip to content

Instantly share code, notes, and snippets.

@dpawluk
Created October 17, 2016 20:21
Show Gist options
  • Select an option

  • Save dpawluk/fd7f19d660a30a3924c9149342748191 to your computer and use it in GitHub Desktop.

Select an option

Save dpawluk/fd7f19d660a30a3924c9149342748191 to your computer and use it in GitHub Desktop.
Modified code provided by a customer to show some defects in the framework
<html>
<head>
<link href="https://cdn.jsdelivr.net/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<select id="selectId">
<option>111</option>
<option>222</option>
<option>333</option>
</select>
<script src="https://cdn.jsdelivr.net/g/[email protected],[email protected],[email protected]"></script>
<script type="text/javascript" src="https://assets.zendesk.com/apps/sdk/2.0/zaf_sdk.js"></script>
<script type="text/javascript">
$(function() {
var client = ZAFClient.init();
client.on('app.registered', function appRegistered(e) {
console.log('app.registered started!')
});
client.on('app.created', handlerAppCreated()); // currently does not work on the first load because this fires before the client connects. You can use app.registered, then remove the handler afterward.
client.on('app.activated', handlerAppActivated()); // same as the last except you can just use app.registered as activated does not fire on the first load, however registered fires every time the client makes and completes its connection to the framework.
client.on('app.deactivated', handlerAppDeactivated()); // not sure why this fires right away, will need to look into it
client.on('app.willDestroy', handlerAppWillDestroy()); // same as above
client.on('pane.created', handlerPaneCreated());
client.on('pane.activated', handlerPaneActivated());
client.on('pane.deactivated', handlerDeactivated()); // same as app.deactivated in that it probably shouldn't be firing right away
client.on('change #selectId', selectChanged()); // client.on is meant to listen to client events, but not events like the one here. Instead you just create/use your own event handler
$('#selectId').on('change', function(event){ // like this
console.log(event);
console.log('select item changed');
});
});
function handlerAppRegistered() { console.log('app.registered started!'); }
function handlerAppCreated() { console.log('app.created started!'); }
function handlerAppActivated() { console.log('app.activated started!'); }
function handlerAppDeactivated() { console.log('app.deactivated started!'); }
function handlerAppWillDestroy() { console.log('app.willDestroy started!'); }
function handlerPaneCreated() { console.log('pane.created started!'); }
function handlerPaneActivated() { console.log('pane.activated started!'); }
function handlerDeactivated() { console.log('pane.deactivated started!'); }
function selectChanged() { console.log('change #selectId'); }
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment