个人中心
gpt4 book ai didi

javascript - 如何使 Fine Uploader 不忽略文本区域？

转载 作者：行者123 更新时间：2023-12-03 12:39:29 26 4
gpt4 key购买 nike

我学会了将 Fine Uploader 与表单一起使用。但是，我无法使 Fine Uploader 不忽略表单中的文本区域。 JS 库会将输入字段数据传递到 PHP 端点，但不会对文本区域执行任何操作。

这是一个现场演示: http://www.digioppikirja.fi/v3/fineuploader2.html

如果您填写表单并查看 $_REQUEST 的内容，您将看到除文本区域内容之外的所有内容: http://www.digioppikirja.fi/v3/dump_textarea.txt

要做什么？

HTML:

<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="http://www.digioppikirja.fi/v3/custom.fineuploader-4.4.0/custom.fineuploader-4.4.0.min.js"></script>
    <link href="fineuploader.css">
    <script type="text/template" id="qq-template">
        <div class="qq-uploader-selector qq-uploader">
            <div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
                <span>Drop files here to upload</span>
            </div>
            <div class="qq-upload-button-selector qq-upload-button">
                <div>Select Files</div>
            </div>
            <span class="qq-drop-processing-selector qq-drop-processing">
                <span>Processing dropped files...</span>
                <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
            </span>
            <ul class="qq-upload-list-selector qq-upload-list">
                <li>
                    <div class="qq-progress-bar-container-selector">
                        <div class="qq-progress-bar-selector qq-progress-bar"></div>
                    </div>
                    <span class="qq-upload-spinner-selector qq-upload-spinner"></span>
                    <span class="qq-upload-file-selector qq-upload-file"></span>
                    <span class="qq-upload-size-selector qq-upload-size"></span>
                    <a class="qq-upload-cancel-selector qq-upload-cancel" href="#">Cancel</a>
                    <span class="qq-upload-status-text-selector qq-upload-status-text"></span>
                </li>
            </ul>
        </div>
    </script>
<head>

<body>
    <form action="endpoint2.php" method="post" enctype="multipart/form-data" id="qq-form">
        <label>Enter your name</label>
        <input type="text" name="user_name" required>
        <label>Enter your email</label>
        <input type="email" name="user_email" required>
        <br /><br />
        <label>The very best thing in travelling</label><br />
        <textarea cols="50" rows="10" name="travelling"></textarea>
        <input type="submit" value="Done">
    </form>

    <div id="my-uploader"></div>

    <script>
        $("#my-uploader").fineUploader();
    </script>
</body>

PHP:

    require_once "handler.php";
require_once "../cfg/digikirjat.cfg.php";

$uploader = new UploadHandler();

// Specify the list of valid extensions, ex. array("jpeg", "xml", "bmp")
$uploader->allowedExtensions = array(); // all files types allowed by default

// Specify max file size in bytes.
$uploader->sizeLimit = 10 * 1024 * 1024; // default is 10 MiB

// Specify the input name set in the javascript.
$uploader->inputName = "qqfile"; // matches Fine Uploader's default inputName value by default

// If you want to use the chunking/resume feature, specify the folder to temporarily save parts.
$uploader->chunksFolder = "chunks";

$method = $_SERVER["REQUEST_METHOD"];
if ($method == "POST") {
    header("Content-Type: text/plain");

    // Call handleUpload() with the name of the folder, relative to PHP's getcwd()
    $result = $uploader->handleUpload($_dirs['temp'].'/upload/');

    // To return a name used for uploaded file you can use the following line.
    $result["uploadName"] = $uploader->getUploadName();


    echo json_encode($result);

    $a = print_r($_REQUEST, true);
    file_put_contents(getcwd().'/dump_textarea.txt', $a);

}
else {
    header("HTTP/1.0 405 Method Not Allowed");
}

最佳答案

看起来表单字段解析器当前未处理 <textarea>元素。我有opened up a case并将作为 Fine Uploader 5.0 的一部分修复该问题。

在该问题得到解决之前，您可以通过解析 <textarea> 轻松解决此问题。在 onUploader (或任何其他所需的)回调处理程序，并通过 setParams 将其添加为参数。例如:

callbacks: {
    onUpload: function(id) {
        var textAreaContent = document.getElementsByName("travelling")[0].value;
        this.setParams({travelling: textAreaContent}, id);
    }
}

注意:我尚未测试上述代码，如果您遇到任何问题，请告诉我，但它应该可以工作。

关于javascript - 如何使 Fine Uploader 不忽略文本区域？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23581703/

26 4 0
文章推荐： javascript - 使用内联javascript将html属性分配给php变量
文章推荐： xcode4 - iPhone模拟器沙箱在Xcode 4中的位置
文章推荐： Maven 在存储库中找不到 httpcomponents-client
文章推荐： javascript - AngularJS:解析中的 var 未注入(inject) Controller (未知提供者)
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com