如何使用 jquery simple modal 插件在 zend 框架中编辑表单数据？答案

【问题标题】：How to use jquery simple modal plugin to edit form data in zend framework?如何使用 jquery simple modal 插件在 zend 框架中编辑表单数据？
【发布时间】：2012-07-29 15:07:25
【问题描述】：

我正在开发一个简单的学生信息应用程序。我的 index.phtml 中有学生列表，我可以在那里编辑学生信息表。它工作得很好，但我想使用模态来编辑学生信息。但我不知道该怎么做。下面我发布了我当前的代码：

/// indexController.php

public function editAction()
    {
        $modelStudents = new Application_Model_DbTable_Students();
        $id = (int) $this->_getParam('id');

        $student = $modelStudents->fetch($id);

        $form = new Application_Form_Student($student->email);
        $form->submit->setLabel('Save');
        $this->view->form = $form;
       if ($this->getRequest()->isPost()) {
            $formData = $this->getRequest()->getPost();
            if ($form->isValid($formData)) {
                $id = (int)$form->getValue('id');
                $name = $form->getValue('name');
                $email = $form->getValue('email');
                $phone = $form->getValue('phone');
                $students = new Application_Model_DbTable_Students();
                $students->updateStudent($id, $name, $email, $phone);

                $this->_helper->redirector('index');
            } else {
                $form->populate($formData);
            }
        } else {
            $id = $this->_getParam('id', 0);
            if ($id > 0) {

                $form->populate($modelStudents->getStudent($id));
            }
        }

    }

/// index.phtml

<html>
<head>
<style type="text/css" rel="stylesheet">
</style>
<script type="text/javascript" src="jQuery.js"> </script>
<script type ="text/javascript" src="jquery.simplemodal-1.4.2.js" ></script>
<script>

<?php         
echo "Student List";

?>
<p><a href="<?php echo $this->url(array('controller'=>'index', 
        'action'=>'add'));?>">Add new student</a></p>
<table border="1">
<tr>
    <th>Name</th>
    <th>Email</th>
    <th>Phone</th>

    <th>Action</th>

</tr>
<?php foreach($this->students as $student) : ?>
<tr>

    <td><?php echo $student->name;?></td>
    <td><?php echo $student->email;?></td>
    <td><?php echo $student->phone;?></td>

    <td>
        <a href="<?php echo $this->url(array('controller'=>'index', 
            'action'=>'edit', 'id'=>$student->id));?>">Edit</a>
        <a href="<?php echo $this->url(array('controller'=>'index', 
            'action'=>'delete', 'id'=>$student->id));?>">Delete</a>
        <p id="delete" > Delete </p>
    </td>
</tr>
<?php endforeach; ?>
</table>

</center>
</html>

////edit.phtml

<center>
<?php 

echo "Edit Student List ";
echo $this->form ;
?>
</center>

请让我知道如何使用 jQuery 简单模式插件来执行此任务。提前致谢

【问题讨论】：

这个问题有点模糊，涉及到相当多的编码。我建议您首先开始研究 AJAX 和 jQuery 教程。之后，如果您有一些具体问题，我会更乐意为您提供帮助。

标签： php jquery zend-framework simplemodal

【解决方案1】：

首先编辑您的 index.phtml 文件，将班级和学生 ID 添加到您的编辑链接中：

<a href="<?php echo $this->url(array('controller'=>'index', 
            'action'=>'edit', 'id'=>$student->id));?>" class="editBtn" studentId="<?=$student->id?>">Edit</a>

然后，在一个包含的 js 文件中：

$(document).ready(function() {

    $(function() {
        //Event triggered when clicking on the edit btn
        $('.editBtn').click(function(event) {
            event.preventDefault ? event.preventDefault() : event.returnValue = false;
            //Get the page and add it to the modal
            studentId = $(this).attr('studentId');
            var data={};
            data['id'] = studentId;
            url = "/index/edit/";
            $.get(url, data, function(resp) {
                $.modal(resp);
            });
        });
    });

});

这应该可以帮助您入门...

【讨论】：