Agile Toolkit - Grid is not reloading - what am I missing?

Question

I had grid reloading working after form submit in a popup, but now I've changed stuff around and for some reason it stopped working and can't figure out why...

EDIT: See comment below...

Basically, the 'details' page used to not be a subpage of this page but a separate .php file, I prefer the subpage approach, but I must have screwed up somewhere in the transition... I've edited out some stuff that would only make this harder to read.

Does anyone see what I'm missing or where I'm going wrong?

class page_liststuff extends Page {
    function initMainPage(){
    // parent::init();

    $grid = $this->add('Grid');
    $this->js('reload_grid',$grid->js()->reload());

$grid->addColumn('button','edit');
$grid->addButton('Refresh')->js('click', $grid->js()->reload());

if($_GET['edit']){
    $this->js()->univ()->frameURL('Edit',$this->api->url('details'))->execute();
}

}

function defaultTemplate(){
    return array('page/detail');
}

function page_details(){

    $m = $this->setModel('Stuff');
$f1 = $stap1->add('Form');
$f1->addSubmit('Save');

if ($f1->isSubmitted()){
    try {
            $f1->update();
    $f1->js()->univ()
    ->successMessage('Success!')
    //->closeDialog()
    ->getjQuery()->trigger('reload_grid')
    ->execute();

        } catch(Exeception $e) {
            $f1->js()->univ()->alert('Fail!')->execute();
        }
}
  }

}

It looks like the ->closeDialog() that I commented out triggers this behaviour and in a way, that makes sense. Except that in this case on the page that pops up there are a couple of tabs and I want my users to be able to change stuff on another tab after hitting 'Save' and not have to reopen the page to do so... How can I accomplish this? — Niek Klein Kromhof, Aug 02 '13 at 10:38
I partially solved the problem by adding a 'Close' button - which I suppose it needed anyway - but now there's still the 'X' in the top right corner that a user could use to close the popup. Can I... (a) get rid of it, OR, (b) add some kind of 'onClose' hook to trigger my reload when the popup closes, no matter what the reason is? — Niek Klein Kromhof, Aug 02 '13 at 10:49
1. I don't understand how you pass $_GET[edit] (ID) from grid to your details page. Isn't it missing somewhere there? — DarkSide, Aug 02 '13 at 22:27
2. In initMainPage you should never call parent::init(). That's correct. — DarkSide, Aug 02 '13 at 22:28
3. There is many things missing in your example code snippet. Can you please fix it to be more correct? For example, no model for grid, no model and form association in page_details like $f1->setModel($m); — DarkSide, Aug 02 '13 at 22:42

DarkSide · Accepted Answer · 2013-08-06T16:47:00.967

1

You can use any jQuery UI Dialog widget options to your advantage like so:

$options = array(
    'closeOnEscape' => false, // http://api.jqueryui.com/dialog/#option-closeOnEscape
    'dialogClass' => 'no-close',
);

$this->js()->univ()
    ->frameURL('Edit', $this->api->url('./details'), $options, $callback)
    ->execute();

Just to hide close button it's much more easier to use CSS for that as described here: http://api.jqueryui.com/dialog/#entry-longdesc in paragraph "Hiding the close button".

In some cases, you may want to hide the close button, for instance, if you have a close button in the button pane. The best way to accomplish this is via CSS. As an example, you can define a simple rule, such as:

.no-close .ui-dialog-titlebar-close {
  display: none;
}

Then, you can simply add the no-close class to any dialog in order to hide its close button:

$( "#dialog" ).dialog({
  dialogClass: "no-close",
  buttons: [{
    text: "OK",
    click: function() {
      $( this ).dialog( "close" );
    }
  }]
});

edited Aug 06 '13 at 16:47

answered Aug 02 '13 at 22:51

DarkSide

3,670
1
26
34

I admit, I didn't test this, but something along these lines should work. Also you can define JS callback functions to use for example on dialog close. Use $this->js()->univ()->doSomething()->ENCLOSE() method in $options array to define enclosed JS function as callback function – DarkSide Aug 02 '13 at 22:53
Setting $options like you suggested did the trick, only thing I changed was that I called it like this: $grid->js()->univ()->frameURL('Edit',$this->api->url('./details'),$options)->execute(); (note the $options go in a different spot :) ) – Niek Klein Kromhof Aug 05 '13 at 06:48
Yeah, you're right. $options is 3rd parameter of frameURL, not api->url. I edited my answer above. – DarkSide Aug 06 '13 at 16:46

Agile Toolkit - Grid is not reloading - what am I missing?

1 Answers1