Get the url parameters and display it on jquery dialog box

Question

Good Day

I usually do things with PHP and when I have come into this jquery ui which is a good feature I had bump into some issues. I am fairly new to the javascript and jquery environment and still coping up with how it works.

My goal is to pass the parameter from a link into jquery dialog box and display that detail there.

HTML ANCHOR TAG

 <td><a href="#?ID=<?php echo $row ['ID']; ?>" id="showdialog"><?php if ($row ['AFFILIATION'] == FALSE) { echo "D"; } else { echo $row ['AFFILIATION']; } ?></a></td>

JQUERY DIALOG BOX

 <script>
     $(function() {
        $( "#dialog" ).dialog({
            autoOpen: false,
            modal: true,
            resizable: false,
            height: 380,
            width: 280
        });

      $("a#showdialog").click(function(){
            $("#dialog").dialog("open");
        });
 </scipt>

I have been reading a lot of threads all over the net but since I am still a novice at js I am not sure which one to use nor how I will put it in my dialog box.

Your suggestions is highly appreciated.

Answer 1

You can use $(this).attr('href'); to get href or link address

<script>
     $(function() {
        $( "#dialog" ).dialog({
            autoOpen: false,
            modal: true,
            resizable: false,
            height: 380,
            width: 280
        });

      $("a#showdialog").click(function(){
            // Use this to get href
            var href = $(this).attr('href');
            $("#dialog").append(href)
            $("#dialog").dialog("open");
        });
 </scipt>

Answer 2

if you only want to show the id then you need to split your href

$('a').on('click', function(e) {  
  e.preventDefault();
  var href = $(this).attr('href');
  href = href.substring(2,href.length);
  var items = href.split('=');
  console.log(items);
});

items[1] will contain only the number.

jsfiddle