Supplying an onclick method with argument on echo in php

Question

Is there a better way to supply an onclick function assignment to something echoed in php? I'm trying to open a modal div once an <a> link or <button> is clicked.

<div id="modalBox" class="w3-modal">
    <div class="w3-modal-content">
        <div class="w3-container">
            <span onclick="document.getElementById('modalBox').style.display='none'" class="w3-button w3-display-topright">&times;</span>
            <p>Some text. Some text. Some text.</p>
            <p>Some text. Some text. Some text.</p>
        </div>
    </div>
</div>


<div class="record-container">
    <table class="table-record">
        <tr>
            <th>Title</th>
            <th>Date Created</th>
            <th>Control</th>
        </tr>

        <?php
        $announcementDaoImpl = new AnnouncementDaoImpl($pdo);
        $announcementList = $announcementDaoImpl->getAllAnnouncementByMostRecent();
        foreach ($announcementList as $key => $value) {
            $announcementTitle = $value->getTitle();
            $dateCreated = $value->getDateAdded();
            echo "<tr>";
            echo "<td>" . $announcementTitle . "</td>";
            echo "<td>" . $dateCreated . "</td>";
            echo "<td><button onclick='showEditModal()'>" . "Edit" . "</button></td>";
            echo "</tr>";
         }
         ?>
    </table>
</div>

This line,

echo "<td><a href='#' onclick='showEditModal()'>" . "Edit" . "</a></td>";

I assigned showEditModal() as method so that once the Edit button is clicked, it will call on this method to display the modal box. However, I'm having problems with double quotes and single quotes because the showEditModal() method expects an argument.

function showEditModal(modalDivId){
    var modalBox = document.getElementById(modalDivId);
    modalBox.style.display = "block";
}

I even tried this.

echo "<td><button onclick=\"showEditModal('modalBox')\">" . "Edit" . "</button></td>";

No luck. The modal box won't show. Even an alert() won't show.

How can I supply the argument on echo?

Thanks.

hcoat · Answer 1 · 2018-04-25T02:10:47.067

There are various ways to handle such problems, one option is PHPs alternative syntax;

<div class="record-container">
    <table class="table-record">
        <tr>
            <th>Title</th>
            <th>Date Created</th>
            <th>Control</th>
        </tr>

        <?php
        $announcementDaoImpl = new AnnouncementDaoImpl($pdo);
        $announcementList = $announcementDaoImpl->getAllAnnouncementByMostRecent();
        foreach($announcementList as $key => $value): ?>
        <tr>
            <td><?php echo $key->getTitle(); ?></td>
            <td><?php echo $value->getDateAdded(); ?></td>
            <td>
                <a href="#" onclick="showEditModal('modalBox')">Edit</a>
            </td>
        </tr>
     <?php endforeach; ?>
    </table>
</div>

Thanks for your answer. I didn't know about that alternative syntax but it looks neat. I'll surely use it. — heisenberg, Apr 25 '18 at 02:08

Karlo Kokkak · Accepted Answer · 2018-04-25T03:42:06.957

0

With proper handling of quotes characters in string, escaped " because string delimiter is the same.

Try:

echo "<td><a href='#' onclick=\"showEditModal('modal1')\">" . "Edit" . "</a></td>";

Just change the value of 'modal1' to the right element id.

edited Apr 25 '18 at 03:42

answered Apr 25 '18 at 01:54

Karlo Kokkak

3,674
4
18
33

score 0 · Answer 3 · answered Apr 25 '18 at 01:55

0

Try this link How to call a JavaScript function from PHP?

Or Call Javascript Function in PHP Echo

answered Apr 25 '18 at 01:55

Christian LSANGOLA

2,947
4
22
36

score 0 · Answer 4 · answered Apr 25 '18 at 02:10

Separate the html from the server language and it will be more readable

<div class="record-container">
    <table class="table-record">
        <tr>
            <th>Title</th>
            <th>Date Created</th>
            <th>Control</th>
        </tr>

        <?php
         $announcementDaoImpl = new AnnouncementDaoImpl($pdo);
         $announcementList = $announcementDaoImpl->getAllAnnouncementByMostRecent();
         foreach ($announcementList as $key => $value):
            $announcementTitle = $value->getTitle();
            $dateCreated = $value->getDateAdded();
            /* comment: "<?=$var?>" this is equal to "echo $var;" endcomment */ 
        ?>
            <tr>
              <td><?= $announcementTitle ?></td>
              <td><?= $dateCreated ?></td>";
              <td>
               <button onclick="showEditModal('<?=$your_variable?>')">
                Edit
               </button>
              </td>
            </tr>
         <?php 
          endforeach; 
         ?>

    </table>
</div>

Supplying an onclick method with argument on echo in php

4 Answers4