Здравствуйте, помогите с формой загрузки файла. Пробую сделать магазин на joomla и virtuemart. Появилась необходимость сделать загрузку файла в модуле товара virtuemart, нашел похожий урок на просторах нета "Загрузка файлов на сервер без перезагрузки страницы". Сделал как там описано, но дело доходит только до этапа "Идет загрузка файла" и на этом все стоит. Что я делаю не так? код страницы: Код (Text): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html prefix="og: http://ogp.me/ns#" xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru-ru" lang="ru-ru" dir="ltr"> <head> <base href="http://localhost/lambite/index.php/zakaz/shag-2/shag-3-pechat-ooo" /> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta name="title" content="Печать ООО" /> <meta name="description" content="Выберите пожалуйста наиболее подходящий для Вас образец оттиска. " /> <meta name="generator" content="Joomla! - Open Source Content Management" /> <title>Печать ООО</title> <link href="/lambite/index.php/zakaz/shag-2/shag-3-pechat-ooo" rel="canonical" /> <link rel="stylesheet" href="/lambite/components/com_k2/css/k2.css" type="text/css" /> <link rel="stylesheet" href="/lambite/components/com_virtuemart/assets/css/vmsite-ltr.css" type="text/css" /> <link rel="stylesheet" href="/lambite/media/system/css/modal.css" type="text/css" /> <link rel="stylesheet" href="http://localhost/lambite/libraries/cegcore/assets/bootstrap/css/bootstrap.css" type="text/css" /> <link rel="stylesheet" href="http://localhost/lambite/libraries/cegcore/assets/bootstrap/css/bootstrap-theme.css" type="text/css" /> <link rel="stylesheet" href="http://localhost/lambite/libraries/cegcore/assets/bootstrap/css/bootstrap-gcore.css" type="text/css" /> <link rel="stylesheet" href="http://localhost/lambite/libraries/cegcore/assets/font_awesome/css/font-awesome.css" type="text/css" /> <link rel="stylesheet" href="http://localhost/lambite/libraries/cegcore/assets/gplugins/gtooltip/gtooltip.css" type="text/css" /> <link rel="stylesheet" href="http://localhost/lambite/libraries/cegcore/assets/gplugins/gvalidation/gvalidation.css" type="text/css" /> <script src="/lambite/media/system/js/mootools-core.js" type="text/javascript"></script> <script src="/lambite/media/system/js/core.js" type="text/javascript"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js" type="text/javascript"></script> <script src="/lambite/components/com_k2/js/k2.js?v2.6.8&sitepath=/lambite/" type="text/javascript"></script> <script src="/lambite/components/com_virtuemart/assets/js/jquery.min.js" type="text/javascript"></script> <script src="/lambite/components/com_virtuemart/assets/js/jquery.noconflict.js" type="text/javascript"></script> <script src="/lambite/components/com_virtuemart/assets/js/vmsite.js" type="text/javascript"></script> <script src="/lambite/components/com_virtuemart/assets/js/vmprices.js" type="text/javascript"></script> <script src="/lambite/media/system/js/modal.js" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ vmSiteurl = 'http://localhost/lambite/' ; vmLang = ""; //]]> window.addEvent('domready', function() { SqueezeBox.initialize({}); SqueezeBox.assign($$('a.modal'), { parse: 'rel' }); }); jQuery(document).ready(function () { jQuery('.orderlistcontainer').hover( function() { jQuery(this).find('.orderlist').stop().show()}, function() { jQuery(this).find('.orderlist').stop().hide()} ) }); </script> <link rel="stylesheet" href="/lambite/templates/system/css/system.css" type="text/css" /> <link rel="stylesheet" href="/lambite/templates/system/css/general.css" type="text/css" /> <link rel="stylesheet" type="text/css" href="/lambite/templates/shoptmpl/css/template.css" media="screen" /> <!--[if IE 6]><link rel="stylesheet" href="/lambite/templates/shoptmpl/css/template.ie6.css" type="text/css" media="screen" /><![endif]--> <!--[if IE 7]><link rel="stylesheet" href="/lambite/templates/shoptmpl/css/template.ie7.css" type="text/css" media="screen" /><![endif]--> <script type="text/javascript">if ('undefined' != typeof jQuery) document._artxJQueryBackup = jQuery;</script> <script type="text/javascript" src="/lambite/templates/shoptmpl/jquery.js"></script> <script type="text/javascript">jQuery.noConflict();</script> <script type="text/javascript" src="/lambite/templates/shoptmpl/script.js"></script> <script type="text/javascript">if (document._artxJQueryBackup) jQuery = document._artxJQueryBackup;</script> <script type="text/javascript" src="/lambite/templates/shoptmpl/script/main.js"></script> <script> jQuery(document).ready(function ($) { screenshotPreview(); window.onload = function () { document.querySelector("input.quantity-plus-js").click(); } jQuery( init ); function init() { //var divdiv = document.getElementById("ddd"); //var trtr = document.getElementById("sku01"); // ���������� �������� �� #myDiv1 � #myDiv2 jQuery('#osnas1').append( jQuery('.sku01')); jQuery('#osnas2').append( jQuery('.sku02')); jQuery('#osnas3').append( jQuery('.sku03')); } }); </script> </head> <body>...... ......<div class="art-nostyle vm_prod_upload"> <h3>Шаг 3 (печать ООО)</h3> <div class="vmgroup vm_prod_upload"> <ul class="vmproduct vm_prod_upload productdetails"> <li class=" width20 floatleft"> <a href="/lambite/index.php/zakaz/shag-2/shag-3-pechat-ooo/образец-1/оснастка/оттиск-30х30мм-detail" title="Оттиск 30х30мм"><img src="http://localhost/lambite/components/com_virtuemart/assets/images/vmgeneral/noimage.gif" alt="Не настроено изображение " id="vm_display_image" /></a><div class="clear"></div> <a href="/lambite/index.php/zakaz/shag-2/shag-3-pechat-ooo/образец-1/оснастка/оттиск-30х30мм-detail">Оттиск 30х30мм</a> <div class="clear"></div> <script type="text/javascript"> function hideBtn(){ jQuery('#upload').hide(); jQuery('#res').html("Идет загрузка файла"); } function handleResponse(mes) { jQuery('#upload').show(); if (mes.errors != null) { jQuery('#res').html("Возникли ошибки во время загрузки файла: " + mes.errors); } else { jQuery('#res').html("Файл " + mes.name + " загружен"); } } </script> <form action="upload.php" method="post" target="hiddenframe" enctype="multipart/form-data" onsubmit="hideBtn();"> <input type="file" id="userfile" name="userfile" /> <input type="submit" name="upload" id="upload" value="Загрузить" /> </form> <div id="res"></div> <iframe id="hiddenframe" name="hiddenframe" style="width:0px; height:0px; border:0px"></iframe> <div class="product-price"><div class="PricesalesPrice" style="display : block;" ><span class="PricesalesPrice" >450 р.</span></div></div> <div class="addtocart-area"> <form method="post" class="product" action="index.php"> <div class="addtocart-bar"> <!-- <label for="quantity69" class="quantity_box">Кол-во: </label> --> <span class="quantity-box"> <input type="text" class="quantity-input" name="quantity[]" value="1"/> </span> <span class="quantity-controls"> <input type="button" class="quantity-controls quantity-plus" /> <input type="button" class="quantity-controls quantity-minus" /> </span> <span class="addtocart-button"> <input type="submit" name="addtocart" class="addtocart-button" value="Добавить в корзину" title="Добавить в корзину" /> </span> <div class="clear"></div> </div> <input type="hidden" class="pname" value="Оттиск 30х30мм"/> <input type="hidden" name="option" value="com_virtuemart"/> <input type="hidden" name="view" value="cart"/> <noscript><input type="hidden" name="task" value="add"/></noscript> <input type="hidden" name="virtuemart_product_id[]" value="69"/> <input type="hidden" name="virtuemart_category_id[]" value="39"/> </form> <div class="clear"></div> </div> </li> </ul> <div class="clear"></div> </div></div>..... upload.php создал в каталоге с default.php модуля virtuemart. код upload.php: Код (Text): <?php if(isset($_POST['upload'])){ $whitelist = array(".gif", ".jpeg", ".png"); $data = array(); $error = true; foreach ($whitelist as $item) { if(preg_match("/$item\$/i",$_FILES['userfile']['name'])) $error = false; } if(!$error) { $folder = 'test/'; $uploadedFile = $folder.basename($_FILES['userfile']['name']); if(is_uploaded_file($_FILES['userfile']['tmp_name'])){ if(move_uploaded_file($_FILES['userfile']['tmp_name'],$uploadedFile)){ $data = $_FILES['userfile']; } else { $data['errors'] = "Во время загрузки файла произошла ошибка"; } } else { $data['errors'] = "Файл не загружен"; } } else{ $data['errors'] = 'Вы загружаете запрещенный тип файла'; } $res = '<script type="text/javascript">'; $res .= "var data = new Object;"; foreach($data as $key => $value){ $res .= 'data.'.$key.' = "'.$value.'";'; } $res .= 'window.parent.handleResponse(data);'; $res .= "</script>"; echo $res; } else{ die("ERROR"); } ?>
Через firebug или любой другой подобный инструмент смотрите, что вернул ajax. Может, там ошибка, а вы и не знаете
в том то и дело что смотрел, были ошибки связанные с $ и jQuery, не менялось вообще ничего при добавлении файла, их исправил теперь вроде без ошибок и пропадает кнопка загрузить и появляется надпись "Идет загрузка файла", но дальше стопор...(((
Надо проверить не только клиентскую часть, но и серверную. Возможно, там скрипт выдал ошибку, а клиентская часть не готова обработать вместо ожидаемого JSON (или что там у вас) выведенный текст ошибки.
извени, пока не настолько разбираюсь во всей этой кухне (учусь пока), сайт на локальном сервере собираю, и как посмотреть ошибки на серверной части?
В Firebug откройте вкладку Console, там отображаются все запросы - что передано, что вернулось. В других браузерах есть похожие встроенные инструменты (хотя на мой вкус, не такие удобные)
сервер у меня denver, но если я правильно понял "работает" он на апаче (звиняюсь за возможные ляпы, я пока только учусь). нашел я там логи, но ошибок там нет. что может быть еще?
Помимо ошибок там ещё можно посмотреть, в консоли или на вкладке "сеть", какие запросы отправляются на сервер, и что с сервера приходит. Это - основной инструмент отладки ajax-сайтов. Хыиуду об этом говорит
Ага, это очень сложно найти во вкладке вызов своего скрипта (там имена файлов, к которым обращаются на сервере), а потом посмотреть, какой Response. Вот пример этого окна с моего проекта (правда, не в Firefox, а в Chrome - мне наоборот он удобнее): http://clip2net.com/s/iZ4iDZ
Так там же фильтр есть. Добавлено спустя 2 минуты 48 секунд: и чистить можно а че там так много с одинаовыми именами?
Запрос регулярно идёт. Но мы не мою задачу обсуждаем, а проблему ТС. Просто первое что в голову пришло, то и выложил, чтоб показать, как эту вкладку можно использовать.
извиняюсь, но да в этом нагромождении я пока разобраться не могу, я конечно галочку себе поставил что этот вопросик обязательно проработать надо, но сайтик просто завис а хотелось бы его доделать... вот скрин: http://joxi.ru/N38mVIwyTJBWebOT3dM
вот скопировал с вкладки ответ: Код (Text): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html prefix="og: http://ogp.me/ns#" xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru-ru" lang="ru-ru" dir="ltr"> <head> <base href="http://localhost/lambite/index.php/zakaz/shag-2/upload.php" /> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta name="title" content="ÐеÑаÑÑ" /> <meta name="description" content="ÐакÑÑ? ÐеÑаÑÑ Ð¸Ð½Ð´Ð¸Ð²Ð¸Ð´ÑалÑного пÑедпÑинимаÑелÑ? ÐбÑеÑÑва Ñ Ð¾Ð³ÑаниÑенной оÑвеÑÑÑвенноÑÑÑÑ, или дÑÑгÑÑ?" /> <meta name="generator" content="Joomla! - Open Source Content Management" /> <title>ÐеÑаÑÑ</title> <link href="/lambite/index.php/zakaz/shag-2" rel="canonical" /> <link rel="stylesheet" href="/lambite/components/com_k2/css/k2.css" type="text/css" /> <link rel="stylesheet" href="/lambite/components/com_virtuemart/assets/css/vmsite-ltr.css" type="text/css" /> <link rel="stylesheet" href="/lambite/media/system/css/modal.css" type="text/css" /> <script src="/lambite/media/system/js/mootools-core.js" type="text/javascript"></script> <script src="/lambite/media/system/js/core.js" type="text/javascript"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js" type="text/javascript"></script> <script src="/lambite/components/com_k2/js/k2.js?v2.6.8&sitepath=/lambite/" type="text/javascript"></script> <script src="/lambite/components/com_virtuemart/assets/js/jquery.min.js" type="text/javascript"></script> <script src="/lambite/components/com_virtuemart/assets/js/jquery.noconflict.js" type="text/javascript"></script> <script src="/lambite/components/com_virtuemart/assets/js/vmsite.js" type="text/javascript"></script> <script src="/lambite/components/com_virtuemart/assets/js/vmprices.js" type="text/javascript"></script> <script src="/lambite/media/system/js/modal.js" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ vmSiteurl = 'http://localhost/lambite/' ; vmLang = ""; //]]> window.addEvent('domready', function() { SqueezeBox.initialize({}); SqueezeBox.assign($$('a.modal'), { parse: 'rel' }); }); jQuery(document).ready(function () { jQuery('.orderlistcontainer').hover( function() { jQuery(this).find('.orderlist').stop().show()}, function() { jQuery(this).find('.orderlist').stop().hide()} ) }); </script> <link rel="stylesheet" href="/lambite/templates/system/css/system.css" type="text/css" /> <link rel="stylesheet" href="/lambite/templates/system/css/general.css" type="text/css" /> <link rel="stylesheet" type="text/css" href="/lambite/templates/shoptmpl/css/template.css" media="screen" /> <!--[if IE 6]><link rel="stylesheet" href="/lambite/templates/shoptmpl/css/template.ie6.css" type="text/css" media="screen" /><![endif]--> <!--[if IE 7]><link rel="stylesheet" href="/lambite/templates/shoptmpl/css/template.ie7.css" type="text/css" media="screen" /><![endif]--> <script type="text/javascript">if ('undefined' != typeof jQuery) document._artxJQueryBackup = jQuery;</script> <script type="text/javascript" src="/lambite/templates/shoptmpl/jquery.js"></script> <script type="text/javascript">jQuery.noConflict();</script> <script type="text/javascript" src="/lambite/templates/shoptmpl/script.js"></script> <script type="text/javascript">if (document._artxJQueryBackup) jQuery = document._artxJQueryBackup;</script> <script type="text/javascript" src="/lambite/templates/shoptmpl/script/main.js"></script> <script> jQuery(document).ready(function ($) { screenshotPreview(); window.onload = function () { document.querySelector("input.quantity-plus-js").click(); } jQuery( init ); function init() { //var divdiv = document.getElementById("ddd"); //var trtr = document.getElementById("sku01"); // Ïåðåìåùàåì ïàðàãðàô èç #myDiv1 â #myDiv2 jQuery('#osnas1').append( jQuery('.sku01')); jQuery('#osnas2').append( jQuery('.sku02')); jQuery('#osnas3').append( jQuery('.sku03')); } }); </script> </head> <body> <div id="art-page-background-glare-wrapper"> <div id="art-page-background-glare"></div> </div> <div id="art-main"> <div class="cleared reset-box"></div> <div id="art-hmenu-bg" class="art-bar art-nav"> </div> <div class="cleared reset-box"></div> <div class="art-box art-sheet"> <div class="art-box-body art-sheet-body"> <div class="art-bar art-nav"> <div class="art-nav-outer"> <div class="art-hmenu-extra1"><ul class="menu" id="logo"><li class="item-126"><a href="/lambite/">ÐÐ ÐÐÐÐÐУЮ</a></li></ul></div> </div> </div> <div class="cleared reset-box"></div> <div class="art-nostyle"> <div class="random-image"> <img src="/lambite/images/header/header1.png" alt="header1.png" width="100" height="25" /></div> </div> <div class="art-content-layout"><div class="art-content-layout-row"><div class="art-layout-cell art-layout-sidebar-bg" style="width: 100%;"> <div class="art-box art-block"> <div class="art-box-body art-block-body"> <div class="art-box art-blockcontent"> <div class="art-box-body art-blockcontent-body"> <ul class="menu"><li class="item-126"><a href="/lambite/">ÐÐ ÐÐÐÐÐУЮ</a></li></ul> <div class="cleared"></div> </div> </div> <div class="cleared"></div> </div> </div> </div></div></div><div class="art-layout-wrapper"> <div class="art-content-layout"> <div class="art-content-layout-row"> <div class="art-layout-cell art-content"> <div class="art-nostyle"> <div class="krizalys_breadcrumb"> <span itemscope itemtype=""><a href="/lambite/index.php/zakaz" itemprop="url" class="pathway"><span itemprop="title">Шаг 1</span></a><span itemprop="child" itemscope itemtype=""> <img src="/lambite/media/system/images/arrow.png" alt="" /> <div class="brlast"><span itemprop="title"><div class="brhead">Шаг 2</div></span></div></span></span></div> </div> <div class="art-box art-post"> <div class="art-box-body art-post-body"> <div class="art-post-inner"> <div class="art-postcontent"> <div class="category_all"> <!-- <div class="category_description"> </div> ---> <div class="category-view category-cattop1"> <div class="cattop1"> <div class="cattop_meta">ÐакÑÑ? ÐеÑаÑÑ Ð¸Ð½Ð´Ð¸Ð²Ð¸Ð´ÑалÑного пÑедпÑинимаÑелÑ? ÐбÑеÑÑва Ñ Ð¾Ð³ÑаниÑенной оÑвеÑÑÑвенноÑÑÑÑ, или дÑÑгÑÑ?</div> </div> <div class="category_border"> <div class="row"> <div class="category floatleft width100 vircatid8"> <div class="spacer"> <h2> <a href="/lambite/index.php/zakaz/shag-2/shag-3-pechat-ip" title="ÐеÑаÑÑ ÐÐ"> ÐеÑаÑÑ ÐÐ <br/> <img src="http://localhost/lambite/components/com_virtuemart/assets/images/vmgeneral/noimage.gif" alt="Ðе наÑÑÑоено изобÑажение " /> </a> <div class="category_descript"> <h3>ÐеÑаÑÑ ÐÐÐÐÐÐÐУÐÐЬÐÐÐÐ ÐÐ ÐÐÐÐ ÐÐÐÐÐТÐÐЯ</h3> <p> </p> <p>ÐÐµÐ¾Ð±Ñ Ð¾Ð´Ð¸Ð¼Ñе докÑменÑÑ:</p> <p>1 - ÐÐ¾Ð¿Ð¸Ñ Ð¡ÐÐÐÐТÐÐЬСТÐРо поÑÑановке на ÑÑÐµÑ Ñиз. лиÑа в налоговом оÑгане.</p> <p>2 - ÐÐ¾Ð¿Ð¸Ñ Ð¡ÐÐÐÐТÐÐЬСТÐРо гоÑÑдаÑÑÑвенной ÑегиÑÑÑаÑии ÑизиÑеÑкого лиÑа в каÑеÑÑве индивидÑалÑного пÑедпÑинимаÑелÑ. Ðибо ÐºÐ¾Ð¿Ð¸Ñ ÐЫÐÐСÐРиз единого ÑееÑÑÑа ÐÐ.</p> </div> </h2> </div> </div> <div class="clear"></div> </div> <div class="horizontal-separator"></div> <div class="row"> <div class="category floatleft width100 vircatid9"> <div class="spacer"> <h2> <a href="/lambite/index.php/zakaz/shag-2/shag-3-pechat-ooo" title="ÐеÑаÑÑ ÐÐÐ"> ÐеÑаÑÑ ÐÐÐ <br/> <img src="http://localhost/lambite/components/com_virtuemart/assets/images/vmgeneral/noimage.gif" alt="Ðе наÑÑÑоено изобÑажение " /> </a> <div class="category_descript"> <h3>ÐеÑаÑÑ ÐÐЩÐСТÐРС ÐÐÐ ÐÐÐЧÐÐÐÐÐ OТÐÐТСТÐÐÐÐÐСТЬЮ</h3> <p> </p> <p>ÐÐµÐ¾Ð±Ñ Ð¾Ð´Ð¸Ð¼Ñе докÑменÑÑ:<br />1 - ÐÐ¾Ð¿Ð¸Ñ ÑвидеÑелÑÑÑва о гоÑÑдаÑÑÑвенной ÑегиÑÑÑаÑии.</p> <p>Ðибо ÐºÐ¾Ð¿Ð¸Ñ ÐЫÐÐСÐРиз единого ÑееÑÑÑа.</p> </div> </h2> </div> </div> <div class="clear"></div> </div> </div> </div> <div class="browse-view"> <div class="category-view-prod"> <div class="cattop_meta">ÐакÑÑ? ÐеÑаÑÑ Ð¸Ð½Ð´Ð¸Ð²Ð¸Ð´ÑалÑного пÑедпÑинимаÑелÑ? ÐбÑеÑÑва Ñ Ð¾Ð³ÑаниÑенной оÑвеÑÑÑвенноÑÑÑÑ, или дÑÑгÑÑ?</div> </div> <input type="button" onclick="history.back();" value="Ðазад"/> </div> </div><!-- end browse-view --> </div> </div> <div class="cleared"></div> </div> <div class="cleared"></div> </div> </div> <div class="cleared"></div> </div> </div> </div> </div> <div class="cleared"></div> <div class="cleared"></div> </div> </div> <div class="art-footer"> <div class="art-footer-body"> <div class="art-footer-center"> <div class="art-footer-wrapper"> <div class="art-footer-text"> <p><br /></p> <div class="cleared"></div> <p class="art-page-footer"><a href="http://www.artisteer.com/?p=joomla_templates" target="_blank">Joomla template</a> created with Artisteer.</p> </div> </div> </div> <div class="cleared"></div> </div> </div> <div class="cleared"></div> </div> </body> </html>
Ну вот, вы же видите, что тот ответ, который вы показали, не соответствует показанному вами же скрипту загрузки фото. Судя по всему, что-то не так с путями, и Joomla даёт свою стандартную 404-ю. Разбирайтесь, по какому пути у вас доступен upload.php. Поставьте в начала этого файла die("1") (временно), и добейтесь прямым вызовом из адресной строки браузера, чтоб вы увидели эту единицу. Потом поправьте путь в action. Ну это ради эксперимента. А вообще в action формы укажите полный путь к upload.php, начиная от корня сайта. Должно получится что-то вроде Код (Text): <form action='/folder1/folder2/upload.php' method="post" enctype="multipart/form-data"> .... </form> При этом yoursite.ru/folder1/folder2/upload.php должен вызывать данный скрипт
to mkramer Огромное спасибо, дело наконец сдвинулось, и немного теперь понял как там что в этих "ответах", еще раз сяп, буду грызть дальше...