Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie

allow image preview before upload

Options
  • 28-09-2010 1:33pm
    #1
    Ginkgo
    Registered Users Posts: 64 ✭✭


    Has anyone tried this? It's a requirement for a web app. (asp.net 3.5). Is javascript my best/only option? I won't be happy with an IE specific solution. Any ideas?


Comments

  • Options
    #2
    plenderj
    Registered Users Posts: 431 ✭✭plenderj


    I think you'll need to use an ActiveX control (or a Java applet? or silverlight?), and the user would probably get a security warning, to be allowed to load a file directly off the drive


  • Options
    #3
    Ginkgo
    Registered Users Posts: 64 ✭✭Ginkgo


    I found this solution that works in Internet explorer (tested in IE 8). I haven't found a solution that works for all browsers which is what I would obviously prefer. I had to add site to trusted sites list for this to work.

    http://forums.asp.net/p/1437099/3249950.aspx

    Any other ideas are welcome.


  • Options
    #4
    Tillotson
    Registered Users Posts: 218 ✭✭Tillotson


    HTML5 has a ondrop event. 
       function urlDropped(url) {
        var img = document.createElement('img');
        img.onload = function(e) {
                document.body.appendChild(this);
        }
        img.src = url;
    }

    function drop(tgt, e) {
        var dt = e.dataTransfer;
        var file = dt.files[0];
        var reader = new FileReader();
        reader.onload = function(e) {
            urlDropped(e.target.result);
        };
    }
...
<body ondrop="drop(this, event)" ondragover="return false">
    Cross browser? All I can say is that it works for me in Chrome


Advertisement