Pass object as parameter to jQuery dialog?

Question

This SO answer describes how to pass data to the dialog.

But if I need to pass an object to the dialog and display its properties in different fields, how is it done?

Answer 1

A javascript object? Then you can also pass one using .data('dataName') and get a property inside the dialog with $(this).data('dataName').myPropertyName. So, something like this maybe?

var car = {type:"Fiat", model:"500", color:"white"};//An object

$('#click').click(function (e){
  e.preventDefault();
  $("#dialog-confirm").data('aCar', car).dialog('open');
});

$("#dialog-confirm").dialog({
  autoOpen: false,
  title:'My dialog',
  open:function(){
    $('.myCar').append($(this).data('aCar').type);
    $('.myModel').append($(this).data('aCar').model);
    $('.myColor').append($(this).data('aCar').color);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0/jquery-ui.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<a:href="#3" id="click">click</a>
<div id="dialog-confirm">
  <p class="myCar">My car is a:</p>
  <p class="myModel">Model:</p>
  <p class="myColor">Color:</p>
</div>