javascript - how to Select a Row in Oracle JET ojTable? -
in oracle jet quick basic example have table in dashboard.htm :
<table id="table" data-bind="ojcomponent: {component: 'ojtable', data: datasource, columns: [ {headertext: 'task number', field: 'number'}, {headertext: 'task title', field: 'title'}, {headertext: 'task priority', field: 'priority'}, {headertext: 'assigned date', field: 'assigneddate'}, {headertext: 'creator name', field: 'creatorname'}, {headertext: 'from user name', field: 'fromusername'}, {headertext: 'created date', field: 'createddate'}, {headertext: 'process name', field: 'processname'}, {headertemplate: 'oracle_link_hdr',template: 'oracle_link'}], rootattributes: {'style':'width: 100%;'}}"> </table>
what want when select row alert of number of selected row appear. have in dashboard.js file :
define(['ojs/ojcore', 'knockout','jquery','ojs/ojknockout', 'ojs/ojarraytabledatasource', 'ojs/ojoffcanvas','ojs/ojtable'], function (oj, ko,$) { function dashboardviewmodel() { var self = this; self.data = ko.observablearray(); $.ajax({ 'global': false, 'url': "aaaa", 'datatype': "json", 'beforesend': function (xhr) {xhr.setrequestheader ("authorization", "basic " + btoa("aaaa:aaaa"));}, 'success': function (taches) { $.each(taches.tasks, function () { self.data.push({ title: this.title, number: this.number, priority: this.priority, assigneddate: this.assigneddate, creatorname: this.creatorname, fromusername: this.fromusername, createddate: this.createddate, processname: this.processname, link: this.href }); }); } }); self.datasource = new oj.arraytabledatasource( self.data, {idattribute: 'number'} ); $('#table').on("ojbeforecurrentrow", currentrowlistener); } function taskflow (url) { var myjson = null; $.ajax({ 'async': false, 'global': false, 'url': url, 'datatype': "json", 'beforesend': function (xhr) {xhr.setrequestheader ("authorization", "basic " + btoa("aaaa:aaaa"));}, 'success': function (data) {myjson = data.detailsurl.href;} }); return myjson; }; function currentrowlistener (event, data) { if (data['option'] == 'selection') { var selectionobj = data['value']; var = 0; (i = 0; < selectionobj.length; i++) { var range = selectionobj[i]; var startkey = range.startkey; if (startkey != null && startkey.row != null) { alert (startkey.row ); $("a[href^='aaaa']") .each(function() { this.href = this.href.replace('aaaa', taskflow("aaaa/"+startkey.row)); }); }; } } }; return new dashboardviewmodel(); } );
i found blog not work should add somthing main.js or ? more information how files looks like:
thanks helping .
ameur,
place html om has provided, view of application. ie. dashboard.html
take "contents" of viewmodel om's solution , place dashboard.js (or whatever viewmodel using).
then take ojoptionchange handler line om has inside of $document.ready call, , place inside of handlebindingsapplied lifecycle method should in dashboard.js template.
finally, in define block, add end of arguments, reference these 2 modules:
'ojs/ojtable', 'ojs/ojarraytabledatasource'
save both view , viewmodel , let know how looks.
Comments
Post a Comment