Add checkbox in Preview page and handle in details table List

PHPMaker General Discussion (PHPMaker)
1

Hi, I have master/details table that is displayed on a page with a Details Preview extension, I want to add a Checkbox column to the each rows of the detail table and manage it with a function , but it didn't work with "Custom action to send selected records by Ajax" so I added a Checkbox column to the details rows, now I want to put an button on top of the details table list to select the ID of the checked rows, but how can I do this in any way?

2

The Preview page does not support custom row action.

However, if the detail table is set up with custom row action and you send similar data to the List page (not Preview page) of the detail table, then it may mimics request from the List page.

There is no server event to add a button at the top of the detail table, but you may try to use the "preview.ew" event to add the button by JavaScript, e.g.

$(document).on("preview.ew", yourHandlerToAddButton);

The "click" handler of your button should submit to the List page of the detail table and mimic request from the List page. Set up your custom row action in the List page first, trigger the action and check the submitted data in the request, then try to simulate the action by sending the data in the same format by your button.

1 Like
3 
 $(document).on("preview.ew", function(e) {
     var $tabs = e.$tabpane
     var addTaskBtn = '<button type="button" id="addTaskBtn" class="btn btn-sm ew-add-edit ew-add btn-primary data-caption="adding"><i class="fa-solid fa-plus ew-icon"></i></button>'
     $tabs.find(".ew-preview-upper-panel").append(addTaskBtn);
   });
$('#addTaskBtn').on('click', function() {
            // Your logic here
            alert('Add Task button clicked!');
            // You can add more functionality as needed
        });

at first i try to do that but it doesn't handle click, finally want to read each details checked rows and store as comma separated string in column "Tasklist" in master table so i write this line in preview page_load to store $tasklist

$this->CustomActions['addTaskBtn'] = new ListAction('addTaskList', 'addTaskBtn', IsLoggedIn(), ACTION_AJAX, ACTION_MULTIPLE, 'add to list', 'far fa-file-word ew-icon',"",  
fn($row) => $TaskList.= strval($row["ID"]), );

so it doesn't work at all how can i do this?

4

Your click handler of your button did not post anything by Ajax.

As explained:

So you need to use the List page:

1 Like
5

indeed i want to select each row in details table list in preview then send collected id to master listpage ,
this is a row sample in preview list

<input type="checkbox" data-table="pmcodetask" class="form-check-input" id="key_m_416" name="key_m[]" data-index="416/">

so i add a button to preview header as this in startup script

var addtaskbtn = "<a href=\"\" id ='addtaskbtn' class=\"btn btn-sm ew-add-edit ew-add btn-primary\" onclick=\"return ew.submitAction(event, {action: 'addtasklist', method: 'ajax', msg: 'Add star?', key: '      '});\"><i class=\"fa-solid fa-plus ew-icon\"></i></a>";
    
if ($tabs.find(".ew-preview-upper-panel #addtaskbtn").length === 0) {
         $tabs.find(".ew-preview-upper-panel").append(addtaskbtn);
       }

and define custom action row in page_load as :

 $this->CustomActions['addtasklist'] = new ListAction('addtasklist', 'addtaskbtn', IsLoggedIn(), ACTION_AJAX, ACTION_MULTIPLE, 'Add to List', 'far fa-file-word ew-icon']));

i have list with checkbox column and i can select each preview row and i want to know how to send key to row action and how to get in list page ?

6

Since you use ACTION_AJAX, the click handler of your button should send the selected rows' primary key values by AJAX (e.g. by $.ajax() or ew.fetch()). However, your checkbox with name="key_m[]" does not have the value attribute that contains the primary key value of the row.

Again, you should: