Question

hola a todos tengo un problema estoy usando este plugin para subir imagenes
http://develoteca.com/bootstrap-file-input-archivos-utilizando-html5/

y funciona bien, antes de usarlo mi textarea, me permitía arrastrar imágenes y me escribía el link, pero con este plugin ya no y me di cuenta que era por esté archivo js

https://github.com/kartik-v/bootstrap-fileinput/blob/master/js/fileinput.min.js

alguien sabe que parte de esté código esta provocando que no me deje arrastrar las imágenes y se escriba en automático el link??

de antemano gracias

Comments

Tienes que publicar tu código como lo tienes y poner el error que te da.

La verdad es que poner dos enlaces y decir que alguien vaya, baje todos los scripts, haga una web, pruebe, vea los errores, regrese y te ponga el código ya terminado, digamos que no es la mejor opción y no creo que alguien lo haga...

Estas usando un plugin, pero quien sabe como lo estés usando, quien sabe como lo estas implementando, quien sabe como tienes tu estructura...

Quien sabe como es tu textarea que te dejaba arrastrar, quien sabe porque ya no te deja porque no mencionas que no te deja, cual es el error, ni nada.

Entonces a ver si llega un alma caritativa y crea todo desde cero y te lo da hecho imaginando que es lo que quieres, o bien, edita tu pregunta, quita los enlaces y pon el código como tal, mencionando los errores.

Saludos.

---

yo nunca dije que me daba algún error, y si puse el enlace es porq tu foro me pone el código como si fuera código html y ademas nunca publica mi respuesta... yo no pretendo que alguien adivine como estoy implementando mi plugin, simplemente creí que tal vez alguien vería el js que uso y si sabia de alguna propiedad que provocará esto me lo hicieran saber.

---

El problema es que sin ver tu código completo y el error que tiene en este caso que es que ya no arrastra. ¿Como alguien viendo un archivo externo va a saber donde esta el problema?

Hay que ver ambas partes para poder identificar el conflicto, si no es imposible.

Y entonces al no poner nada más que un enlace, no hay otra opción más que bajar archivos, crear una pagina (adivinando y diferente a la tuya), con otra estructura, hacer pruebas a ciegas y decirte después que hacer...

Por esa razón necesitas poner tu código entero tal y como lo tienes tu.

En cuanto al código:
Pega tu código, lo seleccionas y le das click al botón de código. Con eso te sale perfectamente, tal y como esta en todas las preguntas del sitio.

En cuanto a que no publica las cosas:
Llegan a moderación, porque en todas ellas pones mas de un enlace y es una prevención de spam, pero como puedes ver son aprobadas y si aparecen.

Saludos.

---

/*!
 * @copyright Copyright © Kartik Visweswaran, Krajee.com, 2014 - 2015
 * @version 4.2.4
 *
 * File input styled for Bootstrap 3.0 that utilizes HTML5 File Input's advanced 
 * features including the FileReader API. 
 * 
 * The plugin drastically enhances the HTML file input to preview multiple files on the client before
 * upload. In addition it provides the ability to preview content of images, text, videos, audio, html, 
 * flash and other objects. It also offers the ability to upload and delete files using AJAX, and add 
 * files in batches (i.e. preview, append, or remove before upload).
 * 
 * Author: Kartik Visweswaran
 * Copyright: 2015, Kartik Visweswaran, Krajee.com
 * For more JQuery plugins visit http://plugins.krajee.com
 * For more Yii related demos visit http://demos.krajee.com
 */

!function(e){"use strict";e.fn.fileinputLocales={},String.prototype.repl=function(e,i){return this.split(e).join(i)};
var i=function(e){var i,t=document.createElement("div");return t.innerHTML="<!--[if IE "+e+"]><i></i><![endif]-->",i=1===t.getElementsByTagName("i").length,document.body.appendChild(t),t.parentNode.removeChild(t),i},t=function(e,i,t,a){var n=a?i:i+".fileinput";e.off(n).on(n,t)},a={data:{},init:function(e){var i=e.initialPreview,t=e.id;i.length>0&&!M(i)&&(i=i.split(e.initialPreviewDelimiter)),a.data[t]={content:i,config:e.initialPreviewConfig,tags:e.initialPreviewThumbTags,delimiter:e.initialPreviewDelimiter,template:e.previewGenericTemplate,msg:function(i){return e.getMsgSelected(i)},initId:e.previewInitId,footer:e.getLayoutTemplate("footer"),isDelete:e.initialPreviewShowDelete,caption:e.initialCaption,actions:function(i,t,a,n,r){return e.renderFileActions(i,t,a,n,r)}}},fetch:function(e){return a.data[e].content.filter(function(e){return null!==e})},count:function(e,i){return a.data[e]&&a.data[e].content?i?a.data[e].content.length:a.fetch(e).length:0},get:function(i,t,n){var r,l,o="init_"+t,s=a.data[i],d=s.config[t],c=s.initId+"-"+o,p=" file-preview-initial";return n=void 0===n?!0:n,null===s.content[t]?"":(z(d)||z(d.frameClass)||(p+=" "+d.frameClass),r=s.template.repl("{previewId}",c).repl("{frameClass}",p).repl("{fileindex}",o).repl("{content}",s.content[t]).repl("{footer}",a.footer(i,t,n)),s.tags.length&&s.tags[t]&&(r=W(r,s.tags[t])),z(d)||z(d.frameAttr)||(l=e(document.createElement("div")).html(r),l.find(".file-preview-initial").attr(d.frameAttr),r=l.html(),l.remove()),r)},add:function(i,t,n,r,l){var o,s=e.extend(!0,{},a.data[i]);return M(t)||(t=t.split(s.delimiter)),l?(o=s.content.push(t)-1,s.config[o]=n,s.tags[o]=r):(o=t.length,s.content=t,s.config=n,s.tags=r),a.data[i]=s,o},set:function(i,t,n,r,l){var o,s=e.extend(!0,{},a.data[i]);if(M(t)||(t=t.split(s.delimiter)),l){for(o=0;o<t.length;o++)s.content.push(t[o]);for(o=0;o<n.length;o++)s.config.push(n[o]);for(o=0;o<r.length;o++)s.tags.push(r[o])}else s.content=t,s.config=n,s.tags=r;a.data[i]=s},unset:function(e,i){var t=a.count(e);if(t){if(1===t)return a.data[e].content=[],void(a.data[e].config=[]);a.data[e].content[i]=null,a.data[e].config[i]=null}},out:function(e){var i,t="",n=a.data[e],r=a.count(e,!0);if(0===r)return{content:"",caption:""};for(var l=0;r>l;l++)t+=a.get(e,l);return i=n.msg(a.count(e)),{content:t,caption:i}},footer:function(e,i,t){var n=a.data[e];if(t=void 0===t?!0:t,0===n.config.length||z(n.config[i]))return"";var r=n.config[i],l=N("caption",r)?r.caption:"",o=N("width",r)?r.width:"auto",s=N("url",r)?r.url:!1,d=N("key",r)?r.key:null,c=s===!1&&t,p=n.isDelete?n.actions(!1,!0,c,s,d):"",u=n.footer.repl("{actions}",p);return u.repl("{caption}",l).repl("{width}",o).repl("{indicator}","").repl("{indicatorTitle}","")}},n=function(e,i){return i=i||0,"number"==typeof e?e:("string"==typeof e&&(e=parseFloat(e)),isNaN(e)?i:e)},r=function(){return window.File&&window.FileReader},l=function(){var e=document.createElement("div");return!i(9)&&(void 0!==e.draggable||void 0!==e.ondragstart&&void 0!==e.ondrop)},o=function(){return r()&&window.FormData},s=function(e,i){e.removeClass(i).addClass(i)},d='style="width:{width};height:{height};"',c='      <param name="controller" value="true" >\n      <param name="allowFullScreen" value="true" >\n      <param name="allowScriptAccess" value="always" >\n      <param name="autoPlay" value="false" >\n      <param name="autoStart" value="false" >\n      <param name="quality" value="high" >\n',p='<div class="file-preview-other">\n       {previewFileIcon}\n   </div>',u={removeIcon:'<i class="glyphicon glyphicon-trash text-danger"></i>',removeClass:"btn btn-xs btn-default",removeTitle:"Remove file",uploadIcon:'<i class="glyphicon glyphicon-upload text-info"></i>',uploadClass:"btn btn-xs btn-default",uploadTitle:"Upload file",indicatorNew:'<i class="glyphicon glyphicon-hand-down text-warning"></i>',indicatorSuccess:'<i class="glyphicon glyphicon-ok-sign file-icon-large text-success"></i>',indicatorError:'<i class="glyphicon glyphicon-exclamation-sign text-danger"></i>',indicatorLoading:'<i class="glyphicon glyphicon-hand-up text-muted"></i>',indicatorNewTitle:"Not uploaded yet",indicatorSuccessTitle:"Uploaded",indicatorErrorTitle:"Upload Error",indicatorLoadingTitle:"Uploading ..."},f='{preview}\n<div class="kv-upload-progress hide"></div>\n<div class="input-group {class}">\n   {caption}\n   <div class="input-group-btn">\n       {remove}\n       {cancel}\n       {upload}\n       {browse}\n   </div>\n</div>',v='{preview}\n<div class="kv-upload-progress hide"></div>\n{remove}\n{cancel}\n{upload}\n{browse}\n',h='<div class="file-preview {class}">\n    <div class="close fileinput-remove">×</div>\n    <div class="{dropClass}">\n    <div class="file-preview-thumbnails">\n    </div>\n    <div class="clearfix"></div>    <div class="file-preview-status text-center text-success"></div>\n    <div class="kv-fileinput-error"></div>\n    </div>\n</div>',m='<span class="glyphicon glyphicon-file kv-caption-icon"></span>',g='<div tabindex="-1" class="form-control file-caption {class}">\n   <span class="file-caption-ellipsis">…</span>\n   <div class="file-caption-name"></div>\n</div>',w='<div id="{id}" class="modal fade">\n  <div class="modal-dialog modal-lg">\n    <div class="modal-content">\n      <div class="modal-header">\n        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>\n        <h3 class="modal-title">Detailed Preview <small>{title}</small></h3>\n      </div>\n      <div class="modal-body">\n        <textarea class="form-control" height: {height}px;">{body}

no se agregó el codigo como lo puse

---

Acabo de editarlo. Solo tienes que seleccionar todo y apretar el botón de código, nada más.

De cualquier forma pegar el js es lo mismo que poner un enlace a el, lo que hace falta ver es tú codigo, no el js como tal.

Algo así:

<!doctype html>
<html class="no-js" lang="">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <link rel="apple-touch-icon" href="apple-touch-icon.png">
        <!-- Place favicon.ico in the root directory -->

        <link rel="stylesheet" href="css/normalize.css">
        <link rel="stylesheet" href="css/main.css">
        <script src="js/vendor/modernizr-2.8.3.min.js"></script>
    </head>
    <body>
        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->

        <p>Este es mi documento.</p>

<div id="midiv">En este div carga</div>

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.3.min.js"><\/script>')</script>
        <script src="js/plugins.js"></script>
        <script src="js/main.js"></script>

    </body>
</html>

De esa forma se ve que scripts agregas, que código tienes y que estas haciendo.

Saludos.

---

Como dice @Peter, necesitaríamos ver el HTML de tu página para ver qué tipo de llamada estás haciendo al plugin y cómo modificarla para conseguir lo que necesitas.

Si te fijas en su página de documentación hay varios ejemplos que permiten el drag and drop de ficheros, así que no creo que necesites modificar el código del plugin sino el uso que le das.

Por otro lado, ¿pretendes que leamos el código fuente de ese plugin minificado?

---

hola @carlossevi ya logré hacer lo que necesitaba, muchas gracias,

solo cambie esta linea del archivo fileinput.min.js

initDragDrop:function(){var i=this,a=i.$container.find(".file-drop-zone"),n="";t(a,"dragenter.fileinput dragover.fileinput",
``` y eso me permitió arrastar las imágenes y que se viera el enlace
gracias!

Answer 1

hola @carlossevi ya logré hacer lo que necesitaba, muchas gracias,

solo cambie esta linea del archivo fileinput.min.js

initDragDrop:function(){var i=this,a=i.$container.find(".file-drop-zone"),n="";t(a,"dragenter.fileinput dragover.fileinput",

y eso me permitió arrastar las imágenes y que se viera el enlace
gracias!