JQuery的发帖不工作动态jQuery的元素 [英] JQuery post not working on dynamic jQuery elements

问题描述

注：这个问题是从后一个分裂：<一href="http://stackoverflow.com/questions/16116173/jquery-not-working-on-elements-created-by-jquery">jQuery不工作的jQuery创建的元素

NOTE: This question is a split from the post: jQuery not working on elements created by jQuery

我通过动态地被称为每秒Ajax调用添加列表项到jQuery的列表。

I am dynamically adding list items to a list in jQuery through an ajax call that is called every second.

下面是code的Ajax调用。

Below is the code for the ajax call.

$.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调用code以上）后返回错误意外令牌LT;

when I try to send the form data for the checkboxes (referencing line $('#delete-group-list').blah...blah in the ajax call code above) the post returns the error unexpected token <

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

What am I doing wrong? I think the two problems are related as I am creating the list items that are used dynamically.

下面是关于这个问题额外的code

Here is extra code relating to the problem

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 code

JS Code

$('#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

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 ['团体']; specfically的$ _ POST ['团体']，因为当我用$ GROUP_ codeS =测试取代它; （只用于调试），在code正常工作。

I think the root of the SECOND problem is the line $group_codes = $_POST['groups']; specfically the $_POST['groups'] because when I replace it with $group_codes = 'test'; (just for debugging purposes) , the code works as expected.

推荐答案

确定，previously我想用PHP文件的内容类型头中的错误，还是它的存在（你需要指定头类型来分析与jQuery的JSON）。却发现多了一个错误，我想这个问题的原因。

ok, previously i thought the mistake with the content type header of php file, still its there (you need to specify the header type to parse with jQuery JSON). But found one more mistake which i suppose the cause of the problem.

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

和你想序列化的形式为

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

您可以看到在编号的区别。这将返回一个空的对象，凡在PHP文件，预计该指数名为集团从未存在。因此，它会返回一个未定义的索引错误，因为它开头的HTML内容类型＆LT; HTML＆GT; ，与JSON解析器返回一个错误与意外令牌LT;

You can see the difference in IDs. This will return an empty object, where in php file it expects the index called groups which never exists. Therefore it'll return an undefined index error as an html content type which starts with <html>, with that JSON parser return an error with unexpected token <

希望这有助于

这篇关于JQuery的发帖不工作动态jQuery的元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！