【问题标题】:Multiple form inputs, how to submit them and save to mysql多个表单输入,如何提交并保存到mysql
【发布时间】:2012-09-16 13:29:51
【问题描述】:

我有一个照片上传系统,允许用户上传他们想要的任意数量的照片,然后我允许他们为每张照片添加描述,然后发布照片。我有这个,部分。我也用 jQuery 提交表单。现在我很难弄清楚如何做是将每个表单元素发送到我的 php 文件,然后更新每张照片以包含描述。

<form class="upload-results-form" rel="<?php echo $albumID?>" action="javascript:return false;">
<textarea class="description" name="photoID1"></textarea>
<textarea class="description" name="photoID2"></textarea>
</form>

现在这就是我如何设置它的想法,除了可能有一个 textarea 或其中的 20 个。

为了尝试保存和发布这些,我正在使用这样的 jQuery:

$("body").on("submit", ".upload-results-form", function(){

    $.ajax({
    type: "POST",
    url: "ajax/add/photos_publish.php",
    cache: false,
    success: function(html){


    }
    });



});

那么我怎样才能让我的 php 遍历每个 texarea 表单并保存该 photoID 的描述?

【问题讨论】:

    标签: php jquery mysql database forms


    【解决方案1】:

    问题在于 JQuery Ajax 不会自动为您构建 POST 数据。因此,您必须自己构建它。您可以创建一个 JSON 对象并提交它(然后在 PHP 中使用 json_decode),或者您可以创建 urlencoded 表单数据并在 PHP 中获取常规的 _POST 数组。

    var _photoID1 = $('#my_form_id').find('input[name="photoID1"]').val();
    var _photoID2 = $('#my_form_id').find('input[name="photoID2"]').val();
    

    JSON 方法:

    var data = { photoID1 : _photoID1, photoID2 : _photoID2 };
    
    $("body").on("submit", ".upload-results-form", function(){
       $.ajax({
         type: "POST",
         data: data,
         url: "ajax/add/photos_publish.php",
         cache: false,
         success: function(html){  }
       });
    });
    

    对于此方法,您可能需要添加一个标头以将Content-Type 设置为application/json

    表单POST方法:

    var post_data = "photoID=" + encodeURIComponent(_photoID1)
                    + "&photoID2=" + encodeURIComponent(_photoID2);
    
    $("body").on("submit", ".upload-results-form", function(){
       $.ajax({
         type: "POST",
         data: post_data,
         url: "ajax/add/photos_publish.php",
         cache: false,
         success: function(html){  }
       });
    });
    

    这两种方式都会将您的数据发送到服务器。

    (以上代码未完全调试,但基本正确。)

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2013-07-01
      • 2012-07-01
      • 1970-01-01
      • 2019-01-02
      • 1970-01-01
      • 2019-04-06
      • 1970-01-01
      • 2012-05-11
      相关资源
      最近更新 更多