2

我正在使用 Zend 框架(php),我正在尝试使用 ajax/jquery 提交一个。

这是.phtml:

<form id="find">
    <input type="text" name="name">
    <input type="submit" id="submit" value="Submit">
</form>

这是 ajax/jquery 部分:

$(document).ready(function() {
    $("#submit").click(function(){
        $.ajax({
            type:'POST',
            url: "<?php echo SITE_URL;?>Training/test", 
            data:$('#find').val(), 
            success: function(response) {
                alert (response);
            }
        });
    });
});

这里,“Training”是控制器,“test”是控制器内部的动作。该操作只有 1 行代码,即 echo “hello”。用户在框中键入一个数字并单击“提交”后,控件必须转到控制器,因此在成功时显示“你好”。但是,当我单击它时,什么也没有发生。请帮我。提前致谢。

4

3 回答 3

2

你没有在 Ajax 调用中命名参数

data:$('#find').val(), 

将其更改为

data:{'param': $('#find').val()}, 

关于 Zend,它是否是 zend 并不重要。您只需提供正确的 URL 即可处理请求。您可以通过方法访问paramZend 中的值。$this->getParam('param')

此外,您不会阻止默认提交操作。将您的功能更改为:

$("#submit").click(function(ev){ 
          ev.preventDefault();

或在函数末尾使用return false;

于 2013-07-15T11:47:02.620 回答
0
  1. 我没有测试你的 jQuery。但请注意,您需要说明event.preventDefault以确保您没有正常的表单提交操作。
  2. 主要问题出在您的 zend 控制器上,因为您需要一个特殊的响应。我想你有一个控制器来执行请求逻辑。我将它命名为 AjaxController 并将动作命名为 ajaxrecuestAction 以说明如何发送正确的响应。

    <?php
    // Filename: yourProject/module/ModuleName/src/Controller/AjaxController.php
    namespace ModuleName\Controller;
    
    use Zend\Mvc\Controller\AbstractActionController;
    use Zend\View\Model\ViewModel;
    
    class AjaxController extends AbstractActionController {
    public function ajaxrecuestAction(){
      // This function is called by zend to procces your ayax request
      // you must test if it's an xmlHttpRequest
      $request = $this->getRequest();
      $is_xmlHttpRequest = ($request->isXmlHttpRequest()) ? 1 : 0;
      if(!$is_xmlHttpRequest){
        // If not you must return a normal page, a message page
        // perhaps a forgiven message page, etc. It depends on your site
        // logics
      }else{
        // The solution's KEY
        // You must disable the zend's normal output
        $viewmodel = new ViewModel();
        $viewmodel->setTerminal($is_xmlhttprequest);
        // Proccess the input and prepare your output
        $output = CallTheLogicsToPrepareIt($request->getContent());
        // send your response
        $response = $this->getResponse();
        $response->setContent($output);
        return $response;
      }
    }
    
于 2017-03-05T23:45:03.987 回答
-1

**编辑:刚刚注意到,在您的 HTML 中,您没有为“查找”字段提供 ID 属性。因此 $('#find').val() 会给你一个错误,比如“找不到未定义的方法 val()。将 id=find 标签添加到你的,它应该可以工作。

** 其他编辑:很抱歉造成混乱。您的表单具有 id=find 但您想要发送到服务器(我相信)的是字段的值。所以给你的输入一个 ID=name 然后使用:

var data = {find: $('#name').val()};

您应该首先使用控制台查看是否触发了事件。就像是:

<script>
$(document).ready(function() {
    $("#submit").click(function(e){
        e.preventDefault ? e.preventDefault() : e.returnValue = false;  //This will prevent the regular submit
        console.log('Hello');
    });
});
</script>

(您确实使用 Fire bug 或 Chrome 开发工具,对吧)?如果没有,请看这篇文章的结尾。如果您可以在控制台中看到 Hello,则说明您走在正确的道路上。然后尝试在变量中设置您的 url 并尝试在控制台中检查它:

<script>
var url = "<?php echo SITE_URL;?>Training/test";
$(document).ready(function() {
    $("#submit").click(function(e){
        e.preventDefault ? e.preventDefault() : e.returnValue = false;  //This will prevent the regular submit
        console.log(url);
    });
});
</script>

然后你应该在控制台中看到 url,这意味着你仍然做得很好。

如果可行,请尝试设置数据并以相同的方式检查输出:

<script>
var url = "<?php echo SITE_URL;?>Training/test";
var data = {
    find: $('#find').val()
};
$(document).ready(function() {
    $("#submit").click(function(e){
        e.preventDefault ? e.preventDefault() : e.returnValue = false;  //This will prevent the regular submit
        console.log(data);
    });
});
</script>

希望一切仍然有效(您看到了数据),然后尝试实际的完整代码,看看您是否有错误或其他什么。此外,请确保在您的 ajax 调用中包含错误函数,以便在服务器出现问题时得到响应。

<script>
var url = "<?php echo SITE_URL;?>Training/test";
$(document).ready(function() {
    $("#submit").click(function(e){
        e.preventDefault ? e.preventDefault() : e.returnValue = false;  //This will prevent the regular submit
        var url = "<?php echo SITE_URL;?>Training/test";
        var data = {
            find: $('#find').val()
        };
        $.ajax({
            type:'POST',
            url: url, 
            data: data, 
            success: function(response) {
                alert (response);
            },
            error: function(resp) {
                alert(resp.responseText);
            }
        });
    });
});
</script>

一些可以帮助您的工具:

如果您使用的是 FireFox,请使用 FireBug 进行调试:https ://addons.mozilla.org/fr/firefox/addon/firebug/

如果您使用的是 Chrome(我个人最喜欢的),请进一步了解 Chrome 开发人员工具:https ://developers.google.com/chrome-developer-tools/?hl=fr

如果您使用的是 IE,请切换到其他用于开发目的,然后在 IE 中尝试以确保您的代码兼容(很可能不会,但之后会更容易找出它为什么不起作用) .

至于 e.preventDefault...... 行,请查看此 SO 帖子以获取更多详细信息:https ://stackoverflow.com/a/15913969/1483513

希望这可以帮助 !

于 2013-07-15T13:09:32.937 回答