使用重命名在Uploadify中多次上传 - 如何发送scriptData?

时间:2011-12-22 13:41:49

标签: php jquery uploadify scriptdata

起初,抱歉我的英语不好。

我正在使用带有图像裁剪器的Uploadify来上传并选择你自己的拇指,但我需要进行多重上传,而不是单一。现在我试图在每次上传前发送 - onSelect scriptData到服务器,但它只发送一个名称,或者在某处重写:(我尝试更改参数名称,重置scriptData但没有效果。问题是,文件名称必须生成Javascript,将其发送到服务器(第二个选项是由ajax执行),因为Javascript然后显示拇指。

编辑链接不起作用,如果您想要上一个版本,请联系jaroslav.streit@gmail.com

测试正在此处http://nabytek-santy.cz/test/

的index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN">
<html>

    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <title>Test uploadcropperu</title>
        <meta name="description" content="">
        <meta name="keywords" content="">
        <meta name="robots" content="index,follow">
        <meta name="author" content="HS Computers - www.hscomputers.cz">
        <link rel="stylesheet" media="screen" type="text/css" href="uploadcropper/uploadcropper.css">
        <link href='uploadcropper/uploadify/uploadify.css' type='text/css' rel='stylesheet' />
        <script type='text/javascript' src='uploadcropper/uploadify/jquery-1.4.2.min.js'>

        </script>
        <script type='text/javascript' src='uploadcropper/uploadify/swfobject.js'></script>
        <script type='text/javascript' src='uploadcropper/uploadify/jquery.uploadify.js'></script>
        <script type='text/javascript'>
            <!--
            sdiak = "áäčďéěíĺľňóô öŕšťúů üýřžÁÄČĎÉĚÍĹĽŇÓÔ ÖŔŠŤÚŮ ÜÝŘŽ";
            bdiak = "aacdeeillnoo orstuu uyrzAACDEEILLNOO ORSTUU UYRZ";

            function bezdiak(text) {
                tx = Math.floor(Math.random() * 1111111) + " ";
                txt = text;
                for (p = 0; p < txt.length; p++) {
                    if (sdiak.indexOf(txt.charAt(p)) != -1) {
                        tx += bdiak.charAt(sdiak.indexOf(txt.charAt(p)));
                    } else tx += txt.charAt(p);
                }
                tx = tx.replace(/ /g, "_");
                return tx;
            }
            nazev = "";

            function generuj_nazev(i) {
                neco = bezdiak(i);
                set_nazev(neco);
                return neco;
            }

            function set_nazev(i) {
                nazev = i;
            }

            function vypis_nazev() {
                return nazev;
            }

            function smazat(i) {
                if (confirm("Opravdu odstranit?")) {
                    var d = document.getElementById('url');
                    var olddiv = document.getElementById("radek" + i);
                    oFormObject = document.forms['form'];
                    d.removeChild(olddiv);
                    oFormObject = document.forms['form'];
                    pocet_obrazku = oFormObject.elements["pocet_obrazku"].value;
                    i = parseInt(pocet_obrazku);
                    oFormObject.elements["pocet_obrazku"].value = --i;
                }
            }

            function uprava_nahledu(nazev, id) {
                var img = new Image();
                img.src = "temp/neorezane_" + nazev;

                var width = img.width;
                var height = img.height;

                windowWidth = width + 100;
                windowHeight = height + 100;
                var centerWidth = (window.screen.width - windowWidth) / 2;
                var centerHeight = (window.screen.height - windowHeight) / 2;

                window.open("uploadcropper/uprava_nahledu.php?nazev=" + nazev + "&width=" + width + "&    height=" + height + "&id=" + id, "blank", "scrollbars=yes,toolbar=no,width=" + windowWidth + "px,height=" + windowHeight + "px,left=" + centerWidth + "px,top=" + centerWidth + "px");

            }

            function zmenObrazek(nazev, id) {
                document.getElementById('neco' + id).innerHTML = "";
                var img = $("<img />").attr('src', 'temp/smaller_' + nazev)
                    .load(function() {

                    $("#neco" + id).append(img);

                });
            }
            id_obrazku = 0;
            jQuery(document).ready(function() {

                $('#file_upload').uploadify({
                    'uploader': 'uploadcropper/uploadify/uploadify.swf',
                        'script': 'uploadcropper/uploadify/uploadify.php',
                        'cancelImg': 'uploadcropper/uploadify/cancel.png',
                        'folder': 'temp',
                        'multi': true,
                        'buttonText': 'Vybrat fotografie',
                        'fileExt': '*.jpg;*.jpeg;*.JPG;*.JPEG;',
                        'fileDesc': 'Fotografie, Obrázky, pouze JPG, JPEG',
                        'auto': true,
                        'method': 'POST',
                        'onSelect': function(event, ID, fileObj) {
                        $('#file_upload').uploadifySettings("scriptData", {
                            "nazev": generuj_nazev(fileObj.name)
                        });
                    },
                        'onComplete': function(event, ID, fileObj, response, data) {
                        nazev_obrazku = vypis_nazev();
                        //Validace extension
                        var fileName = fileObj.name;
                        var fileNameExt = fileName.substr(fileName.lastIndexOf('.') + 1);
                        //var validExtensions = new Array('jpg','jpeg');
                        if (fileNameExt == "jpg" || fileNameExt == "jpeg" || fileNameExt == "JPEG" || fileNameExt == "JPG") {
                            oFormObject = document.forms['form'];
                            pocet_obrazku = oFormObject.elements["pocet_obrazku"].value;

                            i = id_obrazku;
                            ++id_obrazku;
                            oFormObject.elements["pocet_obrazku"].value = ++pocet_obrazku;
                            fce = "uprava_nahledu('" + nazev_obrazku + "','" + i + "')";
                            var html = '';

                            html = '<div id="radek' + i + '" class="radek"><span class="tabulka_smazat"><img src="uploadcropper/delete.gif" alt="smazat" border="0" onclick="smazat(' + i + ');"></span><span class="ramecek"><div id="neco' + i + '"><img src="uploadcropper/edit.gif" alt="Upravit náhled" border="0" onclick="' + fce + '" class="button_edit"><img src="temp/small_' + nazev_obrazku + '" class="imgsmall" id="nahled' + i + '" title="Náhled obrázku" ></div></span><span class="hidden"><img src="temp/neorezane_' + nazev_obrazku + '" id="' + nazev_obrazku + '">Popis:<input name="popis' + i + '" id="popis' + i + '" type="text"></span><input id="file' + i + '" name="file' + i + '" type="text" value="' + nazev_obrazku + '">' + nazev_obrazku + ', cislo: ' + i + '</div>'
                            document.getElementById('url').innerHTML += html;
                        } else {
                            window.alert("Nesprávný typ souboru!");
                        }

                    }
                });


            });
        </script>
    </head>

    <body>
        <form method="POST" action="?obsah=ulozit&naz=reference&id=" id="form">
            <fieldset>
                <legend>Nahrávání a úprava obrázků</legend>
                <div class="admin_obrazky" class="admin_obrazky"> <span class="">Po vybrání obrázku se nahraje a zobrazí se automaticky ořezaný náhled, pokud vám ořez nevyhovuje, kliknutím na <img src="uploadcropper/edit.gif" class="ikona_text"> jej můžete ořezat. Ořez můžete provést jen jednou.</span>

                    <input id="file_upload" name="file_upload" type="file" />
                    <input id="pocet_obrazku" name="pocet_obrazku" type="text" value="0" />
                    <div id="url"></div>
                </div>
            </fieldset>
            <input type="submit" value="Vložit novou referenci" onclick="return checkform();">
            </p>
            <script language="JavaScript" type="text/javascript">
                //<!--
                function checkform() {
                    oFormObject = document.forms['form'];
                    if (oFormObject.elements["nadpis"].value == "") {
                        window.alert("Vyplňte prosím nadpis.");
                        return false;
                    } else {
                        return true;
                    }
                }
                //-->
            </script>
        </form>
    </body>    
</html>

uploadify.php:

<?php
    include("resize.php");

    if (!empty($_FILES)) {
    $tempFile = $_FILES['Filedata']['tmp_name'];
    $targetPath = $_SERVER['DOCUMENT_ROOT'] . $_REQUEST['folder'] . '/';

    $nazev_souboru = $_POST["nazev"];

    $targetFile_neorezane =  str_replace('//','/',$targetPath) ."neorezane_".$nazev_souboru;
    $targetFile_small =  str_replace('//','/',$targetPath) . "small_" . $nazev_souboru;
    $targetFile =  str_replace('//','/',$targetPath) . $nazev_souboru;



     $fileTypes  = str_replace('*.','',$_REQUEST['fileext']);
     $fileTypes  = str_replace(';','|',$fileTypes);
     $typesArray = split('\|',$fileTypes);
     $fileParts  = pathinfo($_FILES['Filedata']['name']);

     if (in_array($fileParts['extension'],$typesArray)) {
        // ulozit do tempu a zmensit pro nahled
    Resizer_thumb($tempFile,$targetFile_small,166,124);
    // zjisti, zda je obrazek na vysku nebo na sirku
    list($OrigWidth, $OrigHeight) = getimagesize($tempFile);
    if($OrigWidth/$OrigHeight<=1.338){
    // na vysku
    Resizer($tempFile,$targetFile_neorezane,166,0);
    }
    else{
    // na sirku
    Resizer($tempFile,$targetFile_neorezane,0,124);
    }

    Resizer($tempFile,$targetFile,640,640);

     } else {
        echo 'Nevhodný typ souboru.';
     }

    chmod($targetFile, 0666);

    } 
?>

1 个答案:

答案 0 :(得分:1)

我解决了!我在onSelect中生成随机字符串并通过scriptData发送。然后所有文件(我假设它们有不同的文件名)在文件名之前有这个代码。如果有人想要代码,请给我发消息。