新手: 下面的 代码 代表什么，看不懂

新手求助: 下面的 代码 代表什么，看不懂
刚从 C++ 转过来，看Jquery语法真费劲
 
<?php $this->beginWidget('zii.widgets.jui.CJuiDialog', array(
         'id' => 'dlg-add-X',
         'theme' => 'base',
         'htmlOptions' => array('style' => 'display:none'),
         'options' => array(
             'title' => 'X',
             'autoOpen' => false,
             'resizable' => false,
             'modal' => true,
             'width' => 680,
         ),
     ));
     echo '<div id="dialog-form"></div>';
     $this->endWidget('zii.widgets.jui.CJuiDialog');
 ?>
 <script type="text/javascript">
     $(document).ready(function(){
         function addX(event, add_X) {
             $("#dlg-add-X")
             .dialog("option", "buttons",[
                 {
                     text: lang.Save,
                     click: function() {
                     }
                 },
                 {
                     text: lang.Cancel,
                     click: function() {$(this).dialog("close");}
                 }
             ])
             .dialog("open");
             $("#dialog-form").load(getRootPath() + "/Y/z");
             event.stopImmediatePropagation();         }
         
         $(".add-X").click(function(event){addX(event, $(this))});
     });
 </script>     jQuery
------解决方案--------------------

就是一个弹出框，里面有一个保存按钮，一个取消按钮来关闭弹出框。
然后打开这个弹出框，接着给里面一个表单加载数据。
最后还来一句阻止事件冒泡
[解决办法]
给$("#dlg-add-X")创建的dialog对象添加两个按钮
[解决办法]
这是jquery的链式调用的语法,基本没有特殊返回值的时候都返回this的jquery对象,以便进行后续链式调用.

$("#dlg-add-X")
             .dialog("option", "buttons",[
                 {
                     text: lang.Save,
                     click: function() {
                     }
                 },
                 {
                     text: lang.Cancel,
                     click: function() {$(this).dialog("close");}
                 }
             ])
             .dialog("open");

$("#dialog-form").load(getRootPath() + "/Y/z");
             event.stopImmediatePropagation();