Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

General Questions /

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

JQUERY JTABLE


Go to End


29 Posts   35680 Views

Avatar
sergieboy

Community Member, 33 Posts

2 January 2012 at 8:26pm

I'm very interested in integrating a new and fascinating JQUERY plugin called JTABLE.
This is a new plugin developed by Halil İbrahim Kalkan (http://www.jtable.org/).
I have a question in this context. In the pagecontroller, there is a custom script with the JQuery code.
At a certain point, you have to pass the action parameters, these are the controllers who will perform the
action with the db. For this example I just have the list action. In my controller, there is a function defined, showdata(),
which will rely upon the sapphire framework for collecting the data out of the dataobjects and return it in JSON format.
Might be a simple question for all the specialists on this forum, but how do I address this function (showdata() ) from my
customscript ? Apparently, 'window.location.href.showdata' wont work.

<?php
class JTableExample extends Page{

static $has_one = array (
'People' => 'People'
);
}

class JTableExample_Controller extends Page_Controller{
public function init(){
parent::init();
Requirements::javascript("mysite/jtable/jquery.jtable.js");
Requirements::javascript("mysite/jtable/jquery.jtable.min.js");
Requirements::javascript("sapphire/thirdparty/jquery/jquery.js");
Requirements::javascript("sapphire/thirdparty/jquery/jquery-ui/jquery-ui-1.8rc3.custom.js");
Requirements::customScript("
$(document).ready(function () {
$('#PersonTableContainer').jtable({
title: 'Table of people',
actions: {
listAction: 'window.location.href.showdata'
},
fields: {
PersonId: {
key: true,
create: false,
edit: false,
list: false
},
Name: {
title: 'Author Name',
width: '40%'
},
Age: {
title: 'Age',
width: '20%'
},
RecordDate: {
title: 'Record date',
width: '30%',
type: 'date',
create: false,
edit: false
}
}
});
$('#PersonTableContainer').jtable('load');
}) (jQuery);

");

}

function showdata(){
return json_encode(DataObject::get('People'));
}
}

Avatar
MarcusDalgren

Community Member, 288 Posts

2 January 2012 at 10:28pm

showdata is not a method on window.location.href. window.location.href is a string which corresponds to the current URL and if you set it to something else you will actually switch pages which probably isn't what you want. Try

actions: { 
  listAction: window.location.href+'showdata' 
},

Although I would recommend logging that to make sure it's actually the URL you want and not something else.
Also I don't think your json_encode is going to work right out of the box. json_encode expects an array as far as I know and DataObject::get() returns a DataObjectSet.

Avatar
MarcusDalgren

Community Member, 288 Posts

2 January 2012 at 10:33pm

Use the JSONDataFormatter for conversion.

function showdata(){ 
      $formatter = new JSONDataFormatter();
      return formatter->convertDataObjectSet(DataObject::get('People')); 
} 

Avatar
MarcusDalgren

Community Member, 288 Posts

2 January 2012 at 11:02pm

Yes I forgot the $-sign on the second row. It should say

return $formatter->convertDataObjectSet(DataObject::get('People')); 

Avatar
sergieboy

Community Member, 33 Posts

2 January 2012 at 11:14pm

I don't get connected from within the javascript to the external function in the controller.
from
actions: { listAction: window.location.href+'showdata' }
towards
showdata() function , which is defined further on in the controller.

For dummy test, I entered some echo statements in this function, which don't get executed.
function showdata(){

echo '<script type="text/javascript">';
echo '<!--';
echo 'alert("show me some candy");';
echo '//-->';
echo '</script>';

$formatter = new JSONDataFormatter();
return $formatter->convertDataObjectSet(DataObject::get('People'));
}

Avatar
MarcusDalgren

Community Member, 288 Posts

2 January 2012 at 11:21pm

It won't get executed since that's not how it works. What you need to do is to find out if window.location.href+'showdata' is the correct URL. I've been assuming that you've created a page on your site that you can visit of the JTableExample type? If you have then you should be able to just add showdata to the URL to run that method in the controller. If you run the method directly via the browser then the js output should work, however if it's an AJAX request it won't work.

IE if the URL of the JTableExample page is http://www.mysite.com/my-jtable-page/ then you can run the showdata method by inputting http://www.mysite.com/my-jtable-page/showdata

Avatar
sergieboy

Community Member, 33 Posts

2 January 2012 at 11:25pm

Edited: 02/01/2012 11:26pm

adding the function to the URL of the page results in a JSON object containing all the records of the table People.
But how to reach this function from within the javascript code ?

Avatar
MarcusDalgren

Community Member, 288 Posts

2 January 2012 at 11:30pm

You could just enter the URL directly in listAction so

actions: {
listAction: 'http://www.mysite.com/my-jtable-page/showdata'
},

However that might still not work since I bet that jTable wants the JSON data to be structured in a certain way and I don't know what those specs are. You're going to have to read them and figure out how to make the JSON data match properly otherwise it won't work.

Go to Top