php - "Undefined property"尝试通过 php 将 javascript 表单数据保存到 mysql 数据库时

Question

我正在尝试将字段添加到组织中不同人员的个人资料表单中，但是，对于我的新字段，当我尝试保存时，出现“未定义的属性”错误。在下面的 javascript 中，字段 fname、lname、title、bio、photo 和owner 非常有用。但是，当我尝试保存时，所有权百分比、教育、技能、教授、奖项、社区、年份和补偿(所有这些都是我添加的)字段抛出“未定义的属性错误”。

(function($) {
if(typeof upsmart === "undefined") { upsmart = {} }
upsmart.people = {
    people: [],
    pcounter: 0,
    acceptFileTypes: ["image/png","image/jpeg","image/jpg","image/gif"],

    init: function() {
        $("#new").click(upsmart.people.showAddDialog);
        $("#team .person").live("click",upsmart.people.showEditDialog);
        $("#form").submit(upsmart.people.prepareSubmit);
    },

    prepareSubmit: function() {
        $("#form input[name=json]").attr("value",JSON.stringify(upsmart.people.people));
    },

    createForm: function(n) {
        item = $("<table> \
            <tr><th>Name</th><td class='twoinput'><input name='pfname' placeholder='Jane'/><input name='plname' placeholder='Smith'/></tr> \
            <tr><th>Title</th><td><input name='ptitle' placeholder='Chief Executive Officer'/></tr> \
            <tr><th>Short Bio</th><td><textarea name='pbio'/></textarea></td></tr> \
            <tr><th>Photo</th><td><input id='photo_upload' name='photo'/> <input type='button' id='photo_button' value='Open Media Library'/></tr> \
            <tr><td colspan='2'>(Optional) Upload a photo of <acronym title='Replace this with their first name?'>this person</acronym>. The bigger the better&mdash;don't worry, we'll scale this down for you.</td></tr> \
            </table>\
            <br/>\
            <table>\
            <tr><th>Education</th><td><textarea name='pedu'/></textarea></td></tr> \
            <tr><th>Relevant Skills</th><td><textarea name='pskills'/></textarea></td></tr> \
            <tr><th>Professional Experience</th><td><textarea name='pprof'/></textarea></td></tr> \
            <tr><th>Awards & Recognition</th><td><textarea name='pawards'/></textarea></td></tr> \
            <tr><th>Community Involvement</th><td><textarea name='pcommunity'/></textarea></td></tr> \
            <tr><th>Years with the Company</th><td><input type='text' size='2' maxlength='2' name='pyears'/>years</td></tr>\
            <tr><th>Compensation Details</th><td><textarea name='pcompensation'/></textarea></td></tr> \
            </table>\
            <br/>\
            <table>\
            <tr><td id='ownershipquestion' colspan='2'>Does this person have an ownership stake?</td><td id='ownershipbox'><input type='checkbox' id='part_owner' name='owner' value='1'/>Yes</td></tr>\
            <tr><td id='ownershipperquestion' colspan='2'>What percentage does this person hold?</td><td id='ownershipperanswer'><input type='text' size='3' maxlength='3' id='ownership_percentage' name='ownership_percentage'/>%</td></tr>\
        </table>");
        if(n < upsmart.people.people.length) {
            p = upsmart.people.people[n];
            item.find("input[name=pfname]").attr("value",p.fname);
            item.find("input[name=plname]").attr("value",p.lname);
            item.find("input[name=ptitle]").attr("value",p.title);
            item.find("textarea[name=pbio]").attr("value",p.bio);
            item.find("input[name=photo]").attr("value",p.photo);
            item.find("input[name=owner]").attr("value",p.owner);
            item.find("input[name=ownership_percentage]").attr("value",p.ownership_percentage);
            item.find("input[name=pedu]").attr("value",p.edu);
            item.find("input[name=pskills]").attr("value",p.skills);
            item.find("input[name=pprof]").attr("value",p.prof);
            item.find("input[name=pawards]").attr("value",p.awards);
            item.find("input[name=pcommunity]").attr("value",p.community);
            item.find("input[name=pyears]").attr("value",p.years);
            item.find("input[name=pcompensation]").attr("value",p.compensation);
        }
        return item;
    },

    showAddDialog: function() {
        $("#dialog").data("person",upsmart.people.pcounter);
        $("#dialog").html(upsmart.people.createForm(upsmart.people.pcounter));
        $("#photo_button").click(open_media_library);
        upsmart.people.pcounter++;
        $("#dialog").dialog({
            width: 600,
            modal: true,
            buttons: {
                "Add": upsmart.people.addPerson,
                "Cancel": function() {
                    $(this).dialog("close");
                }
            }
        });
    },
    showEditDialog: function() {
        pid = $(this).data("person");
        $("#dialog").data("person",pid);
        $("#dialog").html(upsmart.people.createForm(pid));
        $("#photo_button").click(open_media_library);
        $("#dialog").dialog({
            width: 600,
            modal: true,
            buttons: {
                "Save": upsmart.people.addPerson,
                "Cancel": function() {
                    $(this).dialog("close");
                }
            }
        });
    },

    addPerson: function() {
        //Create a json object for this person.


        var person = {
            id: $("#dialog").data("person"),
            fname: $("#dialog input[name=pfname]").attr("value"),
            lname: $("#dialog input[name=plname]").attr("value"),
            title: $("#dialog input[name=ptitle]").attr("value"),
            bio:   $("#dialog textarea[name=pbio]").attr("value"),
            photo: $("#dialog input[name=photo]").attr("value"),
            owner: $("#dialog input[name=owner]").attr("value"),
            ownership_percentage: $("#dialog input[name=ownership_percentage]").attr("value"),
            edu: $("#dialog input[name=pedu]").attr("value"),
            skills: $("#dialog input[name=pskills]").attr("value"),
            prof: $("#dialog input[name=pprof]").attr("value"),
            awards: $("#dialog input[name=pawards]").attr("value"),
            community: $("#dialog input[name=pcommunity]").attr("value"),
            years: $("#dialog input[name=pyears]").attr("value"),
            compensation: $("#dialog input[name=pcompensation]").attr("value"),
        }

        $(this).dialog("close");

        upsmart.people.finishAddPerson(person);
    },
    finishAddPerson: function(person) {
        upsmart.people.people[person.id] = person;
        if($("#person"+person.id).length == 0) {
            box = $("<div class='person'></div>").attr("id","person"+person.id);
            box.data("person",person.id);
            box.insertBefore($("#new"));
        } else {
            box = $("#person"+person.id);
            box.html("");
        }

        box.append($("<img/>").attr("src",person.photo));
        box.append($("<div/>").attr("class","label").html(person.fname+" "+person.lname));
    }
}

$(document).ready(upsmart.people.init);
}(jQuery));

上面的 javascript 嵌入到使用以下 php 函数创建的页面中:

function create_people_form() {
    global $wpdb;

    $people = $wpdb->get_results($wpdb->prepare("SELECT * FROM my_database WHERE wordpress_id=%d",get_current_user_id()),ARRAY_A);

    $out = '';

    if(count($people) > 0) {
        $out .= "<script type='text/javascript'>jQuery(document).ready(function() {\n";
        foreach($people as $i => $p) {
            $p['id'] = $i;
            unset($p['wordpress_id']);
            unset($p['person_id']);
            $out .= "upsmart.people.finishAddPerson(".json_encode($p).");\n";
        }
        $out .= "upsmart.people.pcounter = ".($i+1).";});</script>";
    }

    $media_url = admin_url("media-upload.php?type=image&amp;TB_iframe=true");
    $out .= <<<EOHTML
    <script type="text/javascript">
        media_input = "#photo_upload";
        function open_media_library() {
            tb_show("", "{$media_url}");
            window.send_to_editor = function(html) {
                imgurl = jQuery("img",html).attr("src");
                jQuery(media_input).val(imgurl);
                tb_remove();
            }
            return false;
        }
    </script>
    <style type="text/css">
        #TB_overlay {z-index: 2000 !important;}
        #TB_window {z-index: 2002 !important;}
    </style>
    <div id='team'>
    <div id='new'>+</div></div>
    <br/>
    <div id='dialog'></div>
    <form method='post' id="form">
        <input type='hidden' name='json'/>
        <input type='submit' value='Save'/>
    </form>
EOHTML;
    return $out;
}

并由以下php函数保存

function create_people_save() {
    global $wpdb;

    $data = json_decode(stripslashes($_POST['json']));

    $wpdb->query($wpdb->prepare("DELETE FROM my_database WHERE wordpress_id = %d",array(get_current_user_id())));

    foreach($data as $p) {
        if($p == null) continue;
        $result = $wpdb->query($wpdb->prepare("INSERT INTO my_database
                        (wordpress_id,fname,lname,title,bio,photo,owner,percent_owner,founder,edu,skills,prof,awards,community,years,compensation)
                        VALUES(%d,%s,%s,%s,%s,%s,%d,%d,%d,%s,%s,%s,%s,%s,%d,%s)",
                        array(
                            get_current_user_id(),
                            $p->fname,
                            $p->lname,
                            $p->title,
                            $p->bio,
                            $p->photo,
                            $p->owner,
                            $p->ownership_percentage,
                            $p->founder,
                            $p->edu,
                            $p->skills,
                            $p->prof,
                            $p->awards,
                            $p->community,
                            $p->years,
                            $p->compensation,
                        )
        ));
        echo mysql_error();

        if($result === false) return false;
    }
    return true;
}

非常感谢任何帮助。

感谢您提供的任何帮助

Answer 1

我注意到您正在脚本末尾调用 echo $_POST['jason']; ，我预计这会导致此错误 - 只是问题中的拼写错误？您之前已将其正确地定义为 'json'。

更新

好的 - 我想我看到了:

定义的补偿:

<textarea name='pcompensation'/></textarea>

阅读:

item.find("input[name=pcompensation]").attr("value",p.compensation);

应该是:

item.find("textarea[name=pcompensation]").attr("value",p.compensation);

其他 textarea 自定义字段也是如此。