Assign html attribute to php variable using inline javascript

Question

I'm trying to use the id attribute of a html link as a php variable. I am trying to do this using javascript as below:

<a data-toggle="modal" data-target="#profileModal" id="<?php echo $id; ?>" onclick="<?php $profile_id='<script> function(){ var pid = $(this).attr(\"id\")}; document.write(pid);  }<\/script>';?>"><?php echo $first_name; ?></a>

I can document.write static text out of that function but there is no output when I add:

var id = $(this).attr(\"id\");

and try output that.

The links are on the first name in a table that will open a modal. How can I make this happen?

Answer 1

For inline event handlers, don't use <script> tags.

onclick="var pid = $(this).attr(\"id\")}; document.write(pid);"

Note document.write() overwrites the whole page content.

Unless you're just calling a function, inline handlers get ugly, as your code shows, so consider using unobtrusive JavaScript to assign the event handlers.

For example if you give the links a class:

$(function(){
    $('.myClass').click(function(){
        console.log( this.id );
    });
});