jQuery Dialog Box - Passing variable value from PHP to jQuery function

Question

Need someone to help me on the jQuery Dialog plugin by Eric Martin - Simple Model

I have a PHP page that contains the link that I want to pass a value to another page. Thus, I need help on how to pass the value to the jQuery script that contain the var for the page URL below?

Profile.php

<div id='basic-modal'>
       <a href='#' class='basic'>Jquery Dialog Demo</a>
</div>

Note: When I click on the link, it will call the jQuery basic-model div from Basic.js

Basic.js

jQuery(function ($) {

    // Load dialog on click
    $('#basic-modal .basic').click(function (e) {

    // Display an external page using an iframe
var src = "http://365.ericmmartin.com/";
$.modal('<iframe src="' + src + '" height="450" width="830" style="border:0">', {
    closeHTML:"",
    containerCss:{
        backgroundColor:"#fff",
        borderColor:"#fff",
        height:450,
        padding:0,
        width:830
    },
    overlayClose:true
});

        return false;
    });
});

Note: On the above, I want the var src contain variable value that I should pass it from the Profile.php instead. How should I do this?

Answer 1

Change Profile.php slightly:

<div id='basic-modal'>
       <a href='http://localhost/Poll.php?id=1&validate=yes' class='basic'>Jquery Dialog Demo</a>
</div>

Change Basic.js like so:

    jQuery(function ($) {

        // Load dialog on click
        $('#basic-modal .basic').click(function (e) {
        e.preventDefault();

        // Display an external page using an iframe
        var src = $(this).attr('href');
        $.modal('<iframe src="' + src + '" height="450" width="830" style="border:0">', {
            closeHTML:"",
            containerCss:{
                backgroundColor:"#fff",
                borderColor:"#fff",
                height:450,
                padding:0,
                width:830
            },
            overlayClose:true
        });


            return false; // not sure why you're doing this
        }); // end of click handler




    });  // end of document.ready

Answer 2

e.preventDefault();
var src = $(e.target).attr("href");