Question

This is what I have in short.

I have a dynamic list. On-Click it will pop-up with a jQuery Dialog box, which all works great and dandy. BUT what I am trying to do is set it up, so when someone clicks and the dialog pop’s up it will show a form so they can UPDATE the result, instead of loading an entirely new page.

I have the dialog opening up, but I can’t pass a variable to the dialog box that will tell it which ID for the MySQL to pull the right ROW to update.

I hope this makes sense to someone. Any help would be greatly appreciated.

This is the code for my Dialog Box

<div id="dialogUpdateDealer" title="Update Dealer">
<?php

$dealerResult = $dealer->selectDealer($_SESSION['myId'], "[I NEED THIS ID]");
$oneDealer = mysql_fetch_array($dealerResult);

?>
<form class="formFill" id="dialogUpdateDealerForm" method="post" action="classes/class.Post.php?a=updateDealer">

  <label for="dealerName">Dealer Name</label><br />
  <input type="text" name="dealerName" value="<?php echo $oneDealer['dealerName']; ?>" /><br />

  <label for="cod1">cod1</label><br />
  <input type="text" name="cod1" value="<?php echo $oneDealer['code1']; ?>" /><br />

  <label for="code2">code2</label><br />
  <input type="text" name="code2" value="<?php echo $oneDealer['code2']; ?>" /><br />

</form>
</div>

Code for LINK to open the dialog box

<li id='<?php echo $dealerRow['dealerId']; ?>'> 
  <a href='classes/class.Post.php?a=updateDealer&dealerId="<?php echo $dealerRow['dealerId']; ?>' class='dialogForm' rel='dialogUpdateDealer'>
    <?php echo $dealerRow['dealerName']; ?>
  </a>
</li>

Code for Javascript dialog OnClick

$('.dialogForm').click(function(){
    var id = $(this).attr('rel');
    $('#'+id).dialog('open');

    return false;
});

Code for Javascript to display Dialog

$('#dialogUpdateDealer').dialog({
        autoOpen: false,
        width: 400,
        modal: true,
        buttons: {
            "Update": function() { 
                $("#dialogUpdateDealerForm").ajaxSubmit({
                        target: ".dealers",
                        dataType: 'json',
                        clearForm: true,
                        success: function(response) {
                            alert("Show Success");                          
                        },
                        error: function() {
                            alert("Sorry something went wrong");    
                        }
                });
                $(this).dialog("close"); 
            }, 
            "Cancel": function() { 
                $(this).dialog("close"); 
            } 
        }
    });

Answer 1

All I did was setup an external file to load when opening the dialog form which seemed to work for me. Not sure if it was an optimal setup or not.