Zend FR

Consultez la FAQ sur le ZF avant de poster une question

Vous n'êtes pas identifié.

#1 23-01-2015 10:51:33

Lechanceux
Nouveau membre
Date d'inscription: 03-04-2014
Messages: 3

Uploader,afficher instantanément une image et l'enregistrer sur MYSQL

Bonsoir tout le monde,
J’ai un problème depuis un certain temps. J’ai regardé beaucoup de tutoriel mais je n’ai pas vu un tutoriel pour mon cas. Pourriez-vous m’aider ?
Je souhaite uploader et afficher instantanément une image. Puis par la suite, s’il valide le formulaire, je veux copy l’image uploadé dans le dossier /public/photos/real. Actuellement j’arrive à uploader et à afficher instantanément une image. Mais la deuxième partie à savoir copy l’image uploadé dans le dossier /public/photos/real ne marche pas car il n’arrive pas à voir le fichier .tmp par défaut. S’il vous plait pouvez-vous m’aider ? D’avance merci
Ma vue

<script type="text/javascript">
    $('#input01').filestyle({
        input: false,
        icon: false,
        buttonText: 'Choisir une image'
    });
    $('#input02').filestyle({
        input: false,
        icon: false,
        buttonText: 'Choisir une image'
    });
    $('#input03').filestyle({
        input: false,
        icon: false,
        buttonText: 'Choisir une image'
    });
    $('#input04').filestyle({
        input: false,
        icon: false,
        buttonText: 'Choisir une image'
    });
    $('#input05').filestyle({
        input: false,
        icon: false,
        buttonText: 'Choisir une image'
    });
</script>
<style type="text/css">
    .badge{
        display: none;
    }
    .row{
        width: 690px;
        height: 155px;
        margin-left: 2px;
    }
    .preview1,.preview2,.preview3,.preview4,.preview5{
        height: 110px;
        width: 125px;
        border: 1px solid #000;
        cursor: pointer;
    }
    .col-xs-6{
        width: 135px;
        margin: 2;
        padding-right: 2;
    }
    #input01,#input02,#input03,#input04,#input05
    {
        opacity: 0;
    }
    .bloc_ajouter{
    width: 750px;
    height: 250px;
    padding-left: 25px;
    padding-top: 15px;
    box-shadow: 0px 0px 5px 10px rgba(0,0,0,0.25);
}
</style>
<div class="ab">
    <div class="conbas">
        <div id="dialogue">

        </div>
        <div class="bloc_ajouter">
            <form name="form_photo" enctype="multipart/form-data" method="POST" action="<?php echo $this->baseUrl();?>/listeliee/picture/">
                <br class="clear"/>
                <div class="row">
                    <div class="col-xs-6">
                        <div class="form-group">
                            <img class="preview1" src="<?php echo $this->baseUrl(); ?>/images/photo_upload.png" alt="Preview" title="Preview" />
                            <input type="file" id="input01" tabindex="-1" name="input01" style="position: absolute; clip: rect(0px, 0px, 0px, 0px);" onchange="readURL(this, 1)" />
                            <input type="hidden" id="nb_image" value="1"/>
                        </div>
                        <div class="bootstrap-filestyle input-group">
                            <span tabindex="0" class="group-span-filestyle ">
                                <label class="btn btn-default ">
                                    <label for="input01" id="label_upload">Choisir une image</label>
                                    <span class="badge">1</span>
                                </label>
                            </span>
                        </div>
                    </div>
                    <div class="col-xs-6">
                        <div class="form-group">
                            <img class="preview2" src="<?php echo $this->baseUrl(); ?>/images/photo_upload.png" alt="Preview" title="Preview" />
                            <input type="file" id="input02" name="input02" onchange="readURL(this, 2)" />
                        </div>
                        <div class="bootstrap-filestyle input-group">
                            <span tabindex="0" class="group-span-filestyle" id="label_upload2">
                                <label class="btn btn-default">
                                    <label for="input02" id="label_upload">Choisir une image</label>
                                    <span class="badge">1</span>
                                </label>
                            </span>
                        </div>
                    </div>
                    <div class="col-xs-6">
                        <div class="form-group">
                            <img class="preview3" src="<?php echo $this->baseUrl(); ?>/images/photo_upload.png" alt="Preview" title="Preview" />
                            <input type="file" id="input03" name="input03" onchange="readURL(this, 3)" />
                        </div>
                        <div class="bootstrap-filestyle input-group">
                            <span tabindex="0" class="group-span-filestyle" id="label_upload2">
                                <label class="btn btn-default">
                                    <label for="input03" name="input03" id="label_upload">Choisir une image</label>
                                    <span class="badge">1</span>
                                </label>
                            </span>
                        </div>
                    </div>
                    <div class="col-xs-6">
                        <div class="form-group">
                            <img class="preview4" src="<?php echo $this->baseUrl(); ?>/images/photo_upload.png" alt="Preview" title="Preview" />
                            <input type="file" id="input04" name="input04" onchange="readURL(this, 4)" />
                        </div>
                        <div class="bootstrap-filestyle input-group">
                            <span tabindex="0" class="group-span-filestyle" id="label_upload2">
                                <label class="btn btn-default">
                                    <label for="input04" id="label_upload">Choisir une image</label>
                                    <span class="badge">1</span>
                                </label>
                            </span>
                        </div>
                    </div>
                    <div class="col-xs-6">
                        <div class="form-group">
                            <img class="preview5" src="<?php echo $this->baseUrl(); ?>/images/photo_upload.png" alt="Preview" title="Preview" />
                            <input type="file" id="input05" name="input05" onchange="readURL(this, 5)" />
                        </div>
                        <div class="bootstrap-filestyle input-group">
                            <span tabindex="0" class="group-span-filestyle" id="label_upload2">
                                <label class="btn btn-default">
                                    <label for="input05" id="label_upload">Choisir une image</label>
                                    <span class="badge">1</span>
                                </label>
                            </span>
                        </div>
                    </div>
                </div>
                <br class="clear"/>
                <div style="position: relative; float: left; left: 278px;">
                    <input type="submit" value="Valider"/>
                </div>
            </form>
        </div>
    </div>
</div>

Mon controller

public function pictureAction()
{
$input = array();
        $principale = 1;
        $id_annonce=1;
        for ($i = 1; $i <= 5; $i++) {
            if (isset($_FILES['input0' . $i]) && !empty($_FILES['input0' . $i]['name']) && file_exists($_FILES['input0' . $i]['tmp_name'])) {
                $input[$i] = $_FILES['input0' . $i]['name'];

                $uploaddir = '../photos/real/';
                $uploadfile = $uploaddir . $id_annonce . '_' . $i . '_' . $_FILES['input0' . $i]['name'];
                if (move_uploaded_file($_FILES['input0' . $i]['tmp_name'], $uploadfile)) {
                    echo "Fichier envoyé";
                } else {
                    echo "Fichier non envoyé";
                }

                $dataPhoto = array(
                    'id_annonce' => $id_annonce,
                    'fichier' => $input[$i],
                    'photo_principale' => $principale,
                    'del' => 0
                );
                $principale = 0;
                $img = new Application_Model_DbTable_TPhoto();
                $id_photo = $img->ajouterPhoto($dataPhoto);
            }
        }
        if ($id_photo) {
            $this->view->id_moto = 'OK';
            $this->view->msg = "<div id='succes'><label>L'enregistrement de votre annonce est validé avec succ&egrave;s!!</label></div>";
        }
}

Mon script

function readURL(input, nb) {
    if (input.files && input.files[0]) {
        if (input.files[0].size > 2097152)
        {
            alert("Le fichier est trop lourd!! Veuillez charger une photo de moins de 2mgo");
            input.name = "";
            $('.preview' + nb).attr('src', '/images/photo_upload.png');
        }
        else
        {
            var reader = new FileReader();
            reader.onload = function (e) {
                $('.preview' + nb).attr('src', e.target.result);
            };
            reader.readAsDataURL(input.files[0]);
        }
    }
}

Hors ligne

 

Pied de page des forums

Propulsé par PunBB
© Copyright 2002–2005 Rickard Andersson
Traduction par punbb.fr

Graphisme réalisé par l'agence Rodolphe Eveilleau
Développement par Kitpages