CODEWITHSUNDEEP
jquery-mobile
paul cheung
paul cheung

Reputation: 768

how to transfer data from <a> tag to popup dialog in jquery mobile?

i dynamically generate this html code to delete an item with an id=3 for example:

"<a href='javascript:delete('" + item.id + "')>";

when i click this, it will execute delete('3');i change it as:

<a href='#delete' data-rel='popup' data-position-to='window' data-transition='pop'>

and add a dialog for this tag:

<div data-role='popup' id='delete'>
    <a href='javascript:delete(item.id)' data-role='button'>delete</a>
</div>

how to transfer the item's id to this popup dialog's tag, any suggestion?

Upvotes: 1

Views: 1610

Answers (1)

krishwader
krishwader

Reputation: 11381

I feel like you might be going through the wrong way to achieve this. Some things to change :

  1. delete is a JavaScript keyword. You cant use it as a function.
  2. Don't use the onclick attribute. It results in duplication. Instead, you could use a click event for repetitive actions.
  3. You seem to have gotten the idea to create multiple popups (one for each click of the anchor tag). I think one would do.

Now, in correlation with whatever I've just put down, here's some sample code.

HTML

<a href='#' class='delete' data-num='" + i + "'>Delete me</a>

(Note the data-num attribute in the HTML, the addition of class attribute and the removal of onclick in your code)

It could be replaced by JS which looks like this :

$(this).on("click", ".delete", function (e) {
        //prevent default action
        e.preventDefault();
        //take the id value
        var id = $(this).data("num");
        //send that value to the popup
        $("#delete").find("span").html(id).end().popup("open");
});

A demo fiddle for you to look at : http://jsfiddle.net/hungerpain/AxGde/2/

Upvotes: 1

Related Questions