Jump to:

23490 Posts in 18996 Topics by 2878 members

General Questions

SilverStripe Forums » General Questions » JQUERY JTABLE

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

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

Page: 1 2 3 4
Go to End
Author Topic: 8070 Views
  • sergieboy
    Avatar
    Community Member
    33 Posts

    JQUERY JTABLE Link to this post

    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'));
       }
    }

  • MarcusDalgren
    Avatar
    Community Member
    288 Posts

    Re: JQUERY JTABLE Link to this post

    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.

  • MarcusDalgren
    Avatar
    Community Member
    288 Posts

    Re: JQUERY JTABLE Link to this post

    Use the JSONDataFormatter for conversion.

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

  • MarcusDalgren
    Avatar
    Community Member
    288 Posts

    Re: JQUERY JTABLE Link to this post

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

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

  • sergieboy
    Avatar
    Community Member
    33 Posts

    Re: JQUERY JTABLE Link to this post

    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'));
       }

  • MarcusDalgren
    Avatar
    Community Member
    288 Posts

    Re: JQUERY JTABLE Link to this post

    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

  • sergieboy
    Avatar
    Community Member
    33 Posts

    Re: JQUERY JTABLE Link to this post

    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 ?

  • MarcusDalgren
    Avatar
    Community Member
    288 Posts

    Re: JQUERY JTABLE Link to this post

    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.

    8070 Views
Page: 1 2 3 4
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.