0

在我的照片组合管理页面中,我构建了一个工具来为每张照片添加标题、关键字和功劳。到目前为止,我已经动态列出了多个表单,每个表单都包含一个提交按钮。页面上有 20 多张照片/表格,这可能是一项无聊的工作,希望在此基础上通过在页面底部添加一个按钮来提交所有内容。

我继续构建我认为的好方法,并逐个遍历所有表单,并使用 AJAX 将数据发布到 PHP 页面。这工作得很好,但就像我提到的,有 20 多张照片,它运行 20 个 AJAX 请求和 20 个 SQL 更新,现在觉得这是一个糟糕的努力。

我现在正在研究涉及循环遍历每个表单、创建数组或对象并在一个请求中发送它并使用一个漂亮的 SQL 查询来一次更新所有行的其他方法。

这就是我现在的位置。我正在努力将表单字段转换为可读且可用的对象,以供我的 PHP 读取。

我的表格结构

<form name="12344">
    <div class="input_wrap">
        <textarea id="12344_caption"></textarea>
    </div>
    <div class="input_wrap">
        <input type="text" id="12344_keywords" />
    </div>
    <div class="input_wrap">
        <input type="text" id="12344_credit" />
    </div>
    <div class="input_wrap">
        <input type="text" id="12344_credit_url" />
    </div>
</form>

<form name="12345">
    <div class="input_wrap">
        <textarea id="12345_caption"></textarea>
    </div>
    <div class="input_wrap">
        <input type="text" id="12345_keywords" />
    </div>
    <div class="input_wrap">
        <input type="text" id="12345_credit" />
    </div>
    <div class="input_wrap">
        <input type="text" id="12345_credit_url" />
    </div>
</form>

我的查询到目前为止

var photo_annotations = {};

$('form').each(function(i) {
    var id = $(this).attr('id');
    var caption = $('#'+id+'_caption').val();
    var keywords = $('#'+id+'_keywords').val();
    var credit = $('#'+id+'_credit').val();
    var credit_url = $('#'+id+'_credit_url').val();

    // create object to post
    photo_annotations[id].push({});
    (help)

}

$.ajax({
    type: 'POST',
    url: 'ajax/save-annotations.php',
    data: { json: JSON.stringify(photo_annotations) }
});

这是我想要构建的数据类型:

photo_annotations = {
    "12344": {
        "caption": "This is a caption for the photo ID 12344.",
        "keywords": "Keyword1, Keyword2, Keyword3",
        "credit": "John Doe",
        "credit_url": "http://www.johndoe.com"
    },
    "12345": {
        "caption": "This is a caption for the photo ID 12345.",
        "keywords": "Keyword4, Keyword5, Keyword6",
        "credit": "Joe Bloggs",
        "credit_url": "http://www.joebloggs.com"
    }   
}

我正在努力将我的表单字段以我在上面向您展示的格式正确转换为 JSON。我希望有人能告诉我如何实现这种格式。

4

2 回答 2

2
photo_annotations[id] = {
    caption: caption
    /* and so on */
};
于 2013-09-13T23:28:25.023 回答
1

您不需要推送或单独的变量。您可以像这样直接构建它:

photo_annotations[id] = {
  id: $(this).attr('id'),
  caption: $('#'+id+'_caption').val(),
  keywords: $('#'+id+'_keywords').val(),
  credit: $('#'+id+'_credit').val(),
  credit_url: $('#'+id+'_credit_url').val()
}
于 2013-09-13T23:29:21.737 回答