Pass Variable to JQM Dialog, from link click

Question

I call my Dialog with a link

<li><a href='#refPerson' data-transition='pop' id=" + id + ">" + text + "</a></li>;

Is there away I can pass a variable which is also the id, to the refPerson beforeshow function? I am trying to not have to make a phony hidden element. I have tried a bunch of different ways but nothing seems to pass the var.

    $(document).on('pagebeforeshow','#refPerson', function(){

    });

I have changed how the dialog is called to making the onclick of the link a function that dynamically opens the dialog but I couldnt get that to correctly pass the param either. I just need to get the clicked links ID to the beforeshow function, or somehow pass a variable to it

Answer 1

You can consider using html5 data-* attribute.

refer to this

Using .attr() to retrieve the value from the attribute. Refer to api

Answer 2

As mentioned before, you can use .attr(), here's an example:

<li><a href='#' onclick='getId(this);' data-transition='pop' id='someId'>Some Text</a></li>

<script>
function getId(e){
 var myId = $(e).attr("id");  
 console.log(myId);
 //yourcode...and then redirect...
 $.mobile.navigate( "#refPerson" );
}
</script>

You can also assign a global javascript variable and retrieve it on your dialog, like this:

function getId(e){
 window.myId= $(e).attr("id");  
 console.log(window.myId);
 //yourcode...and then redirect...
 $.mobile.navigate( "#refPerson" );
}

I personally use the sweet-alert plugin to handle dialogs and messages.

Answer 3

I just changed the onclick of the link to a function and passed the param. Then dynamically opened the new dialog. It just seems like the easiest solution to my problem