1

注意：这个问题是从帖子中分离出来的：jQuery not working on elements created by jQuery

我通过每秒调用的 ajax 调用将列表项动态添加到 jQuery 中的列表中。

下面是ajax调用的代码。

$.ajax({
    url: 'php/update_group_list.php',
    data: '', 
    dataType: 'json',
    success: function(data) {
        var id = data.instructor_id;
            group_cnt = data.group_cnt,
            group_name = data.group_name,
            group_code = data.group_code;

            for (i = current_row; i < group_cnt; i++)
            {
                //setInterval(function() { $('#group-list-div').load('php/group_list.php'); }, 5000);

                $('#group-list').append("<li><a href='#' data-role='button' class='view-group-btns' id='"+group_code[i]+"' value='"+id+"' text='"+group_name[i]+"'>"+group_name[i]+"</a></li>");
                $('#delete-group-list').append("<fieldset data-role='controlgroup data-iconpos='right'>" +
                                                    "<input id='"+group_code[i]+i+"' value='"+group_code[i]+"' type='checkbox' name='groups[]'>" +
                                                    "<label for='"+group_code[i]+i+"'>"+group_name[i]+"</label>" +
                                                "</fieldset>");
            }

            current_row = i; 

            $('#group-list').listview('refresh');
            $('#delete-group-list').trigger('create');
    }
});

当我尝试发送复选框的表单数据时（在上面的 ajax 调用代码中引用行 $('#delete-group-list').blah...blah），帖子返回错误意外令牌 <

我究竟做错了什么？我认为这两个问题是相关的，因为我正在创建动态使用的列表项。

这是与问题相关的额外代码

HTML：

<form id='delete-group-form' action='php/delete_groups.php' method='post'>
    <h3 style='text-align: center;'>Check the Box Beside the Groups you Would Like to Delete </h3>
    <div style='margin-top: 20px;'></div>
        <div id='delete-group-list'>
        </div>
    <div style='margin-top: 20px;'></div>
    <input type='submit' id='delete-groups-btn' data-theme='b' value='Delete Groups(s)'>                    
</form>

JS代码

$('#delete-group-form').submit(function(e) 
{
    e.preventDefault();

    alert($('#delete-group-form').serialize());

    if ($('#delete-group-form').serialize() == "") 
    {
        alert('No groups selected to be deleted.')
        return false;
    }
    else 
        if ($('#delete-groups-form').serialize() == null) 
        {
            alert('No groups selected to be deleted.')
            return false;
        } 
        else 
        {
            $.post('php/delete_groups.php',$('#delete-groups-form').serialize()).done(function(data) 
            {
                obj = jQuery.parseJSON(data);


                var group_codes = obj.group_list;

                alert(group_codes);

                alert("The selected groups have been deleted");
                window.setTimeout(2000);
                return false;
            });
        }
    return false;
});

delete_groups.php

<?php 
    $group_codes = $_POST['groups'];    
    $items = array('group_list'=>$group_codes); //creating an array of data to be sent back to js file
    echo json_encode($items); //sending data back through json encoding
?>

我认为第二个问题的根源是 $group_codes = $_POST['groups']; 特别是 $_POST['groups'] 因为当我用 $group_codes = 'test'; 替换它时 （仅出于调试目的），代码按预期工作。

4

2 回答 2

0

当您调用$_POST['groups'];（在您的 delete_groups.php 中）时，它会查找从带有属性的表单元素发送的内容name="groups"，但您的 delete-group-form 没有任何此类元素。

" error unexpected token <" 消息可能来自一个单独的问题。验证您的 HTML 可能会发现问题。

此外，我并不完全清楚您为什么要使用两个单独的函数（JS 中的 $.post 和 $.ajax）。除非我从您发布的代码中看不到其他事情，否则您只需使用一次 ajax 调用就可以大大简化它。把那个调用放在 的$('#delete-group-form').submit(function(e)地方，并使用调用的数据参数$.post传递你的groups变量。ajax修改 delete_groups.php 以返回必要的信息（当前从 update_group_list.php 返回）以更新页面上的显示。

于 2013-04-20T04:53:29.853 回答
0

好的，以前我认为 php 文件的内容类型标头的错误仍然存​​在（您需要指定标头类型以使用 jQuery JSON 解析）。但是又发现了一个错误，我认为这是问题的原因。

<form id='delete-group-form' action='php/delete_groups.php' method='post'>

您希望序列化的形式是

$('#delete-groups-form').serialize()

您可以看到 ID 的差异。这将返回一个空对象，在 php 文件中它期望调用的索引groups从不存在。因此，它将返回一个未定义的索引错误作为以 开头的 html 内容类型，<html>该 JSON 解析器返回一个错误unexpected token <

希望这可以帮助

于 2013-04-20T05:13:14.823 回答