Hooking panel.js close and update MarkupAdminDataTable

[Mr. NiceGuy]

I am developing a custom Backendmodule where submissions can be managed. 

I am using MarkupAdminDataTable to display the pages with Edit button, then upon click a custom page opens in a panel and then the parent of the page is modified. 

The page should then disappear from the table, so I wanted to reload the table with ajax. 

$out  = "<div id='all_sub'>";
$table = $this->modules->get("MarkupAdminDataTable");
$table->setEncodeEntities(false);
$table->id = 'submissionstable';
$table->headerRow(array(
				$this->_('Name'),
				$this->_('Mail'),
				$this->_('Title'),
				$this->_('Submission date'),
				$this->_('Actions')));

$drafts = $this->pages->find('template=talk|poster,parent="/contributions/saved/",limit=10,sort=-created');

foreach($drafts as $draft) {

				$button = $this->modules->get('InputfieldButton');
				$button->value = 'Approve';
				$button->attr('data-href', './edit/?id='.$draft->id);
				$button->addClass('pw-panel');

				 $table->row(array(
					 $draft->speaker->name => "edit/?id={$draft->id}",
					 $draft->speaker->email,
					 $draft->title,
					 date($this->config->dateFormat,$draft->created),
					 $button->render()
				));
			}
			$out .= $table->render();
			$pager = $drafts->getTotal() > count($drafts) ? $drafts->renderPager() : '';
			$out .= $pager;
}
  $out .="</div>";

When I implement a function like the one described in @bernhard great tutorial on custom backend pages however the panels don't open anymore. 

Precisely they stop opening after the first poll. I couldn't find any state specific variables on the markuptable. Did I miss one ?

$out .='<script>
		$(document).ready(function() {
			function poll() {
			  $.get("./ #all_sub", function(data) {
				$("#all_sub").replaceWith(data);
				
		   });
			}
			setTimeout(poll, 10000);
		  });
  </script>';

 

 

What is the best way to update my markuptable after the panel is closed?

[bernhard]

You need to init() the panels again. This is usually done when the dom is first loaded. So panel-links don't work on ajax loaded markup. See this request + workaround: https://github.com/processwire/processwire-requests/issues/176

[Mr. NiceGuy]

Thanks bernhard!  

For reference i did this: 

	$(document).ready(function() {
			function poll() {
			  $.get("./ #all_sub", function(data) {
				$("#all_sub").replaceWith(data);
				pwPanels.init();
		   });
			}
			setTimeout(poll, 15000);
		  });

 

[Ralf]

Hello @bernhard,

I'm trying to do exactly the same thing as Mr. NiceGuy and I think I understand what you are trying to tell us with this statement.

On 5/20/2020 at 11:02 PM, bernhard said:

You need to init() the panels again. This is usually done when the dom is first loaded. So panel-links don't work on ajax loaded markup. See this request + workaround: https://github.com/processwire/processwire-requests/issues/176

However, I do not understand how I have to implement your workaround - from the two issues on Github - if I have in a module a "MarkupAdminDataTable" with many pw-panel links and then after editing a panel it updates the MarkupAdminDataTable automatically? Could you possibly help me here?

[bernhard]

Where exactly do you need help? What did you already achieve on your own? What works? What does not?