Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    Regular Coder
    Join Date
    Mar 2007
    Posts
    157
    Thanks
    6
    Thanked 4 Times in 4 Posts

    Print the ID of a link when clicked?

    Hi everyone! I need a little help with something. I have a page with several links that when clicked open a modal window. The same window for each link, with a form. However inside the form I need to print the id of the link that was clicked. Like so:

    <a href="#" id="1">Link 1</a>
    <a href="#" id="2">Link 2</a>
    <a href="#" id="3">Link 3</a>

    <form>
    ....somehow print/echo the id of the link...
    </form>

    Is this possible? Does anyone know how to do that? I'd appreciate any help!

  • #2
    Regular Coder
    Join Date
    Jul 2010
    Posts
    149
    Thanks
    0
    Thanked 5 Times in 5 Posts

    It is easily possible with Jquery.

    Are you familier with JQuery ?
    It is easily possible with Jquery.

    $('a').click(function() {
    alert($(this).attr('id'));
    });

  • #3
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,398
    Thanks
    12
    Thanked 570 Times in 563 Posts
    No, he was actually talking about a new window (with a new document) which has been opened and he wanted to show the id inside that window.

    My question would be: Is it a "real" window complete with normal handles or is it a "pseudo" window DIV or something that just looks like a window?

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,079
    Thanks
    203
    Thanked 2,542 Times in 2,520 Posts
    Code:
    <form>
    <a href="#" id="1" onclick = "show(this.id)">Link 1</a>
    <a href="#" id="2" onclick = "show(this.id)">Link 2</a>
    <a href="#" id="3" onclick = "show(this.id)">Link 3</a>
    </form>
    
    <script type = "text/javascript">
    function show(which) {
    alert (which);
    // then pass the id to the next page using a query string or a cookie
    }
    </script>

  • #5
    Regular Coder
    Join Date
    Mar 2007
    Posts
    157
    Thanks
    6
    Thanked 4 Times in 4 Posts
    Thank you for the replies! I am familiar with jquery and in fact the modal window is a jquery colorbox one. However I'm not great with javascript. The content for the modal window is coming from a hidden div, inline HTML, and I don't need to pass the value from the form to another page. Just into the hidden div, which is on the same page. When the user submits the form I need to know which link they clicked to open it, so in theory I'd like to print the link ID into the form which I can then send with the rest of the info.

  • #6
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,398
    Thanks
    12
    Thanked 570 Times in 563 Posts
    If you want this information to be sent together with all the other information of the form you should make it part of the form. So you would need to create an input element (of type="hidden" if you prefer) inside the form.

    To accomplish that you will need to have at least the name of the form ... with this name you can do something like that:
    Code:
    function show(which) {
       var theInput = document.createElement('input');
       theInput.type = 'hidden';
       theInput.name = 'NAMEOFYOURCHOICE';
       theInput.value = which;
       document.FORMNAME.appendChild(theInput);
    }
    But this information is very vague because you did not provide enough HTML

  • #7
    Regular Coder
    Join Date
    Mar 2007
    Posts
    157
    Thanks
    6
    Thanked 4 Times in 4 Posts
    Yep, the input was what I was planning on. Ok example HTML:

    jquery that opens the modal windows
    Code:
    jQuery(document).ready(function($) {
    		$(".example8").colorbox({width:"360px", inline:true, href:"#inline_example1"});
        });

    Code:
    <a href="#" id="1" class="example8"> Link 1 </a>
    <a href="#" id="2" class="example8"> Link 2 </a>
    <a href="#" id="3" class="example8"> Link 3 </a>
    
    <!-- hidden div for the modal window -->
    <div style='display:none'>
    <div id='inline_example1'>
    	
    <form action="#">
    
    <input id="" name="" value="" />
    
    </form>
    	
    </div>
    </div>
    I haven't actually built the form yet but that's not a big deal. I'm just trying to work out how to print/echo the ID of the clicked on link into the form, or probably value of the input.

  • #8
    Regular Coder
    Join Date
    Mar 2007
    Posts
    157
    Thanks
    6
    Thanked 4 Times in 4 Posts
    Got it.
    Code:
    <div style="display:none;">
        <input id="select1" type="text" value="1" />
        <input id="select2" type="text" value="2" />
        <input id="select3" type="text" value="3" />
    </div>
    
    <a href="#" onclick="$('#selected').val( $('#select1').val() )"> 1 </a><br />
        <a href="#" onclick="$('#selected').val( $('#select2').val() )"> 2 </a><br />
        <a href="#" onclick="$('#selected').val( $('#select3').val() )"> 3 </a><br />
        
    <input id="selected" type="text" />


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •