php - Jquery 关闭事件在弹出窗口后将不起作用

Question

请帮助我解决我的问题，我的问题是我创建了一个表，其中包含项目信息以及添加、编辑和删除。例如，如果我单击“添加”按钮，它将弹出一个对话框，其中包含来自其他页面的 PHP 表单。我为此使用了 load() 函数。在表单内有我的文本框等...下面是确定和取消按钮。但是当我单击取消时，它不会关闭对话框。我尝试了不同的方法，但都不起作用。

这是我在 VIEW 部分的代码(我使用的是 Codeigniter)

 my button for add
 <input class="classname1"  type="button" value="ADD" name="add_item"/>
 .
 .
 .
 my div tag
 <div id="popup" style="display: none;"></div>
 .
 .
 .
 my jquery function

    /* FOR ADD PAGE */    

    $(".hero-unit input[name=add_item]").on('click',function(){
        $('#popup').load("<?php echo site_url("item_controller/addNewItem/"); ?>").dialog({
            title: "Add New Item",
            autoOpen: true,
            width: 450,
            modal:true,
            open: function (event, ui) { window.setTimeout(function () {
                jQuery(document).unbind('mousedown.dialog-overlay').unbind('mouseup.dialog-overlay'); }, 100);
            },
            //if i include the close function it doesn't closing

        });
    });

点击按钮后的表单

<div>
  <?php $attr = array('class'=>'form-signin','id'=>'addForm'); ?>
  <?php echo form_open('item_controller/insertNewItem',$attr); ?>

    <h2 class="form-signin-heading"></h2>
        <h5 style="font-weight: normal;">Category Name</h5>
        <?php
            echo "<select name='categoryname' required='required'  autofocus='autofocus' >";
                echo "<option value=''>----------</option>";
                    foreach($category as $row){
                        echo "<option value='{$row['salescatname']}'>{$row['salescatname']}</option>";
                    }
            echo "</select>";
        ?>

        <h5 style="font-weight: normal;">Brand</h5>
        <input type="text" class="input-block-level" placeholder="Item Brand" required="required" name="brand" value="<?php echo set_value('description'); ?>" />
            <label style="color: red;"><?php echo form_error('brand'); ?></label>   


        <h5 style="font-weight: normal;">Name</h5>
        <input type="text" class="input-block-level" placeholder="Item Name" required="required" name="name" value="<?php echo set_value('description'); ?>" />
            <label style="color: red;"><?php echo form_error('name'); ?></label>

        <h5 style="font-weight: normal;">Description</h5>
        <input type="text" class="input-block-level" placeholder="Description" required="required" name="description" value="<?php echo set_value('description'); ?>" />
            <label style="color: red;"><?php echo form_error('description'); ?></label>

        <h5 style="font-weight: normal;">Unit</h5>
        <input type="text" class="input-block-level" size="10" placeholder="Item Unit" required="required" name="unit" value="<?php echo set_value('description'); ?>" />
            <label style="color: red;"><?php echo form_error('unit'); ?></label>


        <h5 style="font-weight: normal;">Code:</h5>
        <input type="text" class="input-block-level" placeholder="Item Code" required="required" name="code" value="<?php echo set_value('name'); ?>"/>
            <label style="color: red;"><?php echo form_error('code'); ?></label>

        <br />
        <div align="right">
            <input type="submit" value="OK" class="btn btn-large btn-primary" />
            <input type="button" value="CANCEL" class="btn btn-large btn-primary" name='cancel' />//HERE'S THE BUTTON CANCEL. WHAT SHOULD I DO TO CLOSE THIS DIALOG?

        </div>
  <?php echo form_close(); ?>

这就是所有的人希望你能帮助我。谢谢。

Answer 1

jQuery Dialog 有一种提供内置按钮的机制；你不应该需要在你的 php 文件中手动添加它们。只需将 buttons 属性添加到您的对话框:

    buttons: {
        Ok: function() {
          // submit your form here
          $( this ).dialog( "close" );
        },
        Cancel: function() {
          // close handler
          $( this ).dialog( "close" );
        }
      }

这是一个使用“关闭”功能的示例:http://jsfiddle.net/ccamarat/E6ej9/5/