Jump to content
  • разработка интернет магазинов на opencart
  • доработка интернет магазинов на opencart

777ufo777

Новичок
  
  • Posts

    2
  • Joined

  • Last visited

777ufo777's Achievements

Newbie

Newbie (1/14)

  • First Post
  • Conversation Starter
  • Week One Done
  • One Month Later
  • One Year In

Recent Badges

0

Reputation

  1. не совсем mysql_query ("INSERT INTO images (date,catalog,filename) VALUES (NOW(),'$catalog','$name')"); ик рилииет нормально, но когда дополнительный текст в поле кидаю, то им не грузит , хотя sql запрос в phpmyaadmin прошел успешно всё добавилось, fileriader с ним проблемы как мне кажется
  2. Здравствуйте! помогите кому не трудно )) проблема икая есть скрипт он грузит изображения на сервер и путь к ним прописывает бд mysql всё рилииет на технологией drag drop . Вот я решил прикрутить дополнительные записи к изображению с этим проблема он не грузит текст в бд вот код html <form enctype="multipart/form-data" > <input type="file" id="uploadbtn" > <input type="text" id="ptext"> </form> </div> <!-- Область предпросмотра --> <div id="uploaded-holder"> <div id="dropped-files"> <!-- Кнопки загрузить и удалить, а икже когдачество файлов --> <div id="upload-button"> <center> <span>0 Файлов</span> <a href="#" class="upload">Загрузить</a> <a href="#" class="delete">Удалить</a> <!-- Прогресс бар загрузки --> <div id="loading"> <div id="loading-bar"> <div class="loading-color"></div> </div> <div id="loading-content"></div> </div> </center> вот php извлекает данные $name = $_POST['name']; $catalog = $_POST['catalog']; $ptext = $_POST['ptext']; //var_dump($ptext); // Записываем данные изображения в БД mysql_query ("INSERT INTO images (date,catalog,filename,text) VALUES (NOW(),'$catalog','$name','$ptext')"); и вот js проблема var $ = jQuery.noConflict(); $(document).ready(function() { // В dataTransfer помещаются изображения которые переищили в область div jQuery.event.props.push('dataTransfer'); // Максимальное когдачество загружаемых изображений за одни раз var maxFiles = 6; // Оповеещёние по умолчанию var errMessage = 0; // Кнопка выпотому чтора файлов var defaultUploadBtn = $('#uploadbtn'); // Массив для всех изображений var dataArray = []; var ptext = []; // Область информер о загруженных изображениях - скрыи $('#uploaded-files').hide(); // Метод при пагдении файла в зону загрузки $('#drop-files').on('drop', function(e) { // Передаем в files все полученные изображения var files = e.dataTransfer.files; // Проверяем на максимальное когдачество файлов if (files.length <= maxFiles) { // Передаем массив с файлами в функцию загрузки на предпросмотр loadInView(files); } else { alert('Вы не можете загружать потому чтольше '+maxFiles+' изображений!'); files.length = 0; return; } }); // При нажатии на кнопку выпотому чтора файлов defaultUploadBtn.on('change', function() { // Заполняем массив выбранными изображениями var files = $(this)[0].files; // Проверяем на максимальное когдачество файлов if (files.length <= maxFiles) { // Передаем массив с файлами в функцию загрузки на предпросмотр loadInView(files); // Олищаем инпут файл путем сброса формы $('#frm').each(function(){ this.reset(); }); } else { alert('Вы не можете загружать потому чтольше '+maxFiles+' изображений!'); files.length = 0; } }); // Функция загрузки изображений на предросмотр function loadInView(files) { // Показываем обасть предпросмотра $('#uploaded-holder').show(); // Для каждого файла $.each(files, function(index, file) { // Несколько оповеещёний при попытке загрузить не изображение if (!files[index].type.match('image.*')) { if(errMessage == 0) { $('#drop-files p').html('Эй! только изображения!'); ++errMessage } else if(errMessage == 1) { $('#drop-files p').html('Стоп! Загружаются только изображения!'); ++errMessage } else if(errMessage == 2) { $('#drop-files p').html("Не умеешь лиить? Только изображения!"); ++errMessage } else if(errMessage == 3) { $('#drop-files p').html("Хорошо! Продолжай в том же духе"); errMessage = 0; } return false; } // Проверяем когдачество загружаемых элементов if((dataArray.length+files.length) <= maxFiles) { // показываем область с кнопками $('#upload-button').css({'display' : 'block'}); } else { alert('Вы не можете загружать потому чтольше '+maxFiles+' изображений!'); return; } // Создаем новый экземпляра FileReader var fileReader = new FileReader(); // Инициируем функцию FileReader fileReader.onload = (function(file) { return function(e) { // Помещаем URI изображения в массив dataArray.push({name : file.name, value : this.result}); addImage((dataArray.length-1)); }; })(files[index]); // Производим чтение картинки по URI fileReader.readAsDataURL(file); }); return false; } // Проэтодура добавления эскизов на страницу function addImage(ind) { // Если ингдекс отрицательный зналит выводим весь массив изображений if (ind < 0 ) { start = 0; end = dataArray.length; } else { // иначе только опрегделенное изображение start = ind; end = ind+1; } // Оповеещёния о загруженных файлах if(dataArray.length == 0) { // Если пустот массив скрываем кнопки и всю область $('#upload-button').hide(); $('#uploaded-holder').hide(); } else if (dataArray.length == 1) { $('#upload-button span').html("Был выбран 1 файл"); } else { $('#upload-button span').html(dataArray.length+" файлов были выбраны"); } // Цикл для каждого элемени массива for (i = start; i < end; i++) { // размещаем загруженные изображения if($('#dropped-files > .image').length <= maxFiles) { $('#dropped-files').append('<div id="img-'+i+'" class="image" style="background: url('+dataArray[i].value+'); background-size: cover;"> <a href="#" id="drop-'+i+'" class="drop-button">Удалить изображение</a></div>'); } } return false; } // Функция уднония всех изображений function restartFiles() { // Усиновим бар загрузки в значение по умолчанию $('#loading-bar .loading-color').css({'width' : '0%'}); $('#loading').css({'display' : 'none'}); $('#loading-content').html(' '); // Удаляем все изображения на страниэто и скрываем кнопки $('#upload-button').hide(); $('#dropped-files > .image').remove(); $('#uploaded-holder').hide(); // Олищаем массив dataArray.length = 0; return false; } // Удноние только выбранного изображения $("a[id^='drop']").live('click', function() { // получаем название id var elid = $(this).attr('id'); // создаем массив для разгделенных строк var temp = new Array(); // гделим строку id на 2 части temp = elid.split('-'); // получаем значение после тире тоесть ингдекс изображения в массиве dataArray.splice(temp[1],1); // Удаляем сирые эскизы $('#dropped-files > .image').remove(); // Обновляем эскизи в соответсвии с обновленным массивом addImage(-1); }); // Удалить все изображения кнопка $('#dropped-files #upload-button .delete').click(restartFiles); // Загрузка изображений на сервер $('#upload-button .upload').click(function() { // Показываем прогресс бар $("#loading").show(); // переменные для рилиты прогресс бара var totalPercent = 100 / dataArray.length; var x = 0; var str = ""; var newArray = []; var catalog = ""; var ptext = []; $('#loading-content').html('Загружен '+dataArray[0].name); // Для каждого файла $.each(dataArray, function(index, file) { // загружаем страницу и передаем значения, используя HTTP POST запрос $.post('upload.php', dataArray[index], function(data) { var fileName = dataArray[index].name; ++x; // Изменение бара загрузки $('#loading-bar .loading-color').css({'width' : totalPercent*(x)+'%'}); // Если загрузка законлилась if(totalPercent*(x) == 100) { // Загрузка завершена $('#loading-content').html('Загрузка завершена!'); // Вызываем функцию уднония всех изображений после загдержки 1 секунда setTimeout(restartFiles, 1000); // если еещё продолжается загрузка } else if(totalPercent*(x) < 100) { // Какой файл загружается $('#loading-content').html('Загружается '+fileName); } // Формируем в вигде списка все загруженные изображения // data формируется в upload.php var dataSplit = data.split(':'); // Организуем строку с именами каринок через запятую str = str + "," + dataSplit[0]; if (index == (dataArray.length-1)) { // Получаем каилог catalog = dataSplit[1]; // Удаляем первую запятую str = str.substr(1); // Помещаем в новый массив newArray.push({name : str, catalog : catalog }); dataArray.push({text : $("#ptext").val()}); // передаем этот массив в инчерт пхп $.post('insert.php', newArray[0], function() {}); } if(dataSplit[2] == 'загружен успешно') { $('#uploaded-files').append('<li><a href="images/'+dataSplit[0]+'">'+fileName+'</a> загружен успешно</li>'); } else { $('#uploaded-files').append('<li><a href="images/'+data+'. Имя файла: '+dataArray[index].name+'</li>'); } }); }); // Показываем список загруженных файлов $('#uploaded-files').show(); return false; }); // Простые стили для области переискивания $('#drop-files').on('dragenter', function() { $(this).css({'box-shadow' : 'inset 0px 0px 20px rgba(0, 0, 0, 0.1)', 'border' : '4px dashed #bb2b2b'}); return false; }); $('#drop-files').on('drop', function() { $(this).css({'box-shadow' : 'none', 'border' : '4px dashed rgba(0,0,0,0.2)'}); return false; }); });
×
×
  • Create New...

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.