jQuery UI Dialog pass on variables

Question

Hi, I'm creating a Web interface for a table in Mysql and want to use jQuery dialog for input and edit. I have the following code to start from:

    $("#content_new").dialog({
    autoOpen: false,
    height: 350,
    width: 300,
    modal: true,
    buttons: {
        'Create an account': function() {
            alert('add this product');
        },
        Cancel: function() {
            $(this).dialog('close');
            $.validationEngine.closePrompt(".formError",true);
        }
    },
    closeText: "Sluiten",
    title: "Voeg een nieuw product toe",
    open: function(ev, ui) { /* get the id and fill in the boxes */ },
    close: function(ev, ui) { $.validationEngine.closePrompt(".formError",true); }
});
$("#newproduct").click(function(){
    $("#content_new").dialog('open');
});
$(".editproduct").click(function(){
    var test = this.id;
    alert("id = " + test);
});

So when a link with the class 'editproduct' is clicked it gets the id from that product and I want it to get to the open function of my dialog.

Am I on the right track and can someone help me getting that variable there.

Thanks in advance.

Answer 1

Set a variable eg the_id on top of everything in your script and try this code:

$("#newproduct").click(function(){
    $("#" + the_id).dialog('open');
});
$(".editproduct").click(function(){
    the_id = this.id;
});

Answer 2

Thanks Sarfraz you were right about the variable. For others interest the full code is now:

$(document).ready(function() {
var id = 0;
$("#content_new").dialog({
    autoOpen: false,
    height: 350,
    width: 300,
    modal: true,
    buttons: {
        'Create an account': function() {
            alert('add this product');
        },
        Cancel: function() {
            $(this).dialog('close');
            $.validationEngine.closePrompt(".formError",true);
        }
    },
    closeText: "Sluiten",
    title: "Voeg een nieuw product toe",
    open: function(ev, ui) { alert(id); },
    close: function(ev, ui) { $.validationEngine.closePrompt(".formError",true); }
});
$("#newproduct").click(function(){
    $("#content_new").dialog('open');
});
$(".editproduct").click(function(){
    id = this.id;
    $("#content_new").dialog('open');
});
$("#new").validationEngine();});

And on the opening of the modal dialog box i get the correct ID.