Sending an ID with JavaScript

Question

On my webpage I have this link:

<\a onclick="#" class="compose"></a>

By clicking the link, this script gets activated:

$(function(){
    $('.compose').click(function() { // Button which will activate our modal
        $('#popup_bestanden_edit_name').reveal({ // The item which will be opened with reveal 
            animation: 'fade',  // fade, fadeAndPop, none
            animationspeed: 600,                // how fast animtions are
            closeonbackgroundclick: true,   // if you click background will modal close?
            dismissmodalclass: 'close'  // the class of a button or element that will close an open modal
        });
        return false;
    });
});

The script above will make this DIV visible, wich is a popup:

<div id="popup_bestanden_edit_name">
<div id="popupheading">
    Naam wijzigen
</div>

<div id="popupcontent">
    <p><form action="" method="post" name="naamwijzigen"><input name="naam" type="text"></form></p>

    <a href="#" class="popupbutton green close"><img src="<?php echo $domein.'/images/confirm_popup/tick.png'; ?>">Ja, wijzigen</a>

    <a href="#" class="popupbutton red close"><img src="<?php echo $domein.'/images/confirm_popup/cross.png'; ?>">Nee, annuleren</a>
</div>

The popup that opens gives people the opportunity to edit a name of a document on the website. So when the link <\a onclick="#" class="compose"></a> is clicked, it has to send an id ($fetch_row['id']) to the popup, so I can use this in the further scripting.

Does anyone know how to do this?

Amir Hoseinian · Accepted Answer · 2013-09-29 11:59:55Z

1

Add the id to your a tag like this

<a onclick="#" class="compose" data-id="<?php echo $fetch_row['id']?>"></a>

Then fetch the id and send it to your popup with Jquery:

id = $(this).attr("data-id");

Now use this id wherever you want.

answered Sep 29, 2013 at 11:59

Amir Hoseinian

2,3622 gold badges24 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Rick A. Over a year ago

Well, i need to admit i'm not that good with jquery. How do i use the id combined with PHP if i do it this way?

MD SHAHIDUL ISLAM · Accepted Answer · 2013-09-29 15:09:58Z

0

jQuery reveal plugin has many callback functions in which opened callback function that triggers 'after' the modal is opened. See docs at foundation.zurb.com

echo "<a onclick='#' class='compose' id='".$fetch_row['id']."'></a>";

$(function(){
    $('.compose').click(function() { 

        var id = $(this).attr('id'); //getting id from clicked anchor tag

        $('#popup_bestanden_edit_name').reveal({ 
            animation: 'fade',  
            animationspeed: 600,               
            closeonbackgroundclick: true,   
            dismissmodalclass: 'close',//missing comma (,) added

            opened: function(id) { 
               $("#popup_bestanden_edit_name").append("<input type='hidden' name='myid' id='myid' value='"+id+"'>");
            }

        });
        return false;
    });
});

Your id will set in myid element in popup get this from here.

edited Sep 29, 2013 at 15:09

answered Sep 29, 2013 at 12:39

MD SHAHIDUL ISLAM

14.5k6 gold badges84 silver badges93 bronze badges

6 Comments

Rick A. Over a year ago

This one i understand, but when i replace my script with yours and then click the link, the popup will not open anymore.

Rick A. Over a year ago

Update: When i put OPENED above dismissModalClass, the popup appears, but i can't close it anymore by clicking the cancel button. Then nothing happends.

MD SHAHIDUL ISLAM Over a year ago

There was a mistake, a comma was missing before opened. it iss corrected.

Rick A. Over a year ago

Hi Salim, i added that one already, sorry, forgot to post it here. That made everything work correctly except the Close button. dismissmodalclass does not make the div invisible after clicking the cancel button.

MD SHAHIDUL ISLAM Over a year ago

a js error makes not to work another , so I have to say another thing, writing mistake was in opened (oppened)

|

Sunil Verma · Accepted Answer · 2013-09-29 12:01:47Z

0

add id to the anchor tag only i.e

<a id = '2' class='compose' ></a>

then you can get it like jQuery('.compose').attr('id');

answered Sep 29, 2013 at 12:01

Sunil Verma

2,5001 gold badge17 silver badges15 bronze badges

Comments

Rick A. · Accepted Answer · 2013-09-29 22:04:46Z

now everything is working i have one more question. This is the code i use now:

echo "<a onclick='#' class='compose' id='".$fetch_row['id']."'></a>";

$(function(){
$('.compose').click(function() { 

    var id = $(this).attr('id'); //getting id from clicked anchor tag

    $('#popup_bestanden_edit_name').reveal({ 
        animation: 'fade',  
        animationspeed: 600,               
        closeonbackgroundclick: true,   
        dismissmodalclass: 'close',//missing comma (,) added

        opened: function(id) { 
           $("#popup_bestanden_edit_name").append("<input type='hidden' name='myid' id='myid' value='"+id+"'>");
        }

    });
    return false;
});
});

But when the link is clicked while people are on the bottom of the page, the popup will open on the top of the page. But people need to scroll back to the top to see this.

How can i automatically send the user back to the top where the popup is being showed?

Collectives™ on Stack Overflow

Sending an ID with JavaScript

4 Answers 4

1 Comment

6 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

6 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related