Quantcast
Channel: ASP.NET AJAX + Ajax Control Toolkit (ACT)
Viewing all articles
Browse latest Browse all 5678

clear/reset xmlhttprequest and form data

$
0
0

Hi,

i use XMLHttpRequest to upload files. Below is all the code i use to upload from a modal window. 

<span><a href="#" id="modchart-d">Insert chart</a></span><script type="text/javascript">$(document).ready(function ()
    {

// modal charts //
(function (hpeduinvest, $, undefined) {$(function () {$('#modchart-d').bind('click', function () {$('#chart-d').css({
                'min-height': '500px',
                'left': '0px',
                'right': '0px',
                'top': '0px',
                'margin-left': 'auto',
                'margin-right': 'auto',
                'display': 'block'
            }).show();
        });
    });
}(window.hpeduinvest = window.hpeduinvest || {}, jQuery));
// end modal charts //

    // upload file

    function fileSelected()
    {
        var file = document.getElementById('fileToUpload').files[0];
        if (file && file.type == "image/png")
        {
            var fileSize = 0;
            if (file.size > 1024 * 1024)
                fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + 'MB';
            else
                fileSize = (Math.round(file.size * 100 / 1024) / 100).toString() + 'KB';
            document.getElementById('message').innerHTML = 'File name: ' + file.name + '<br>' + 'File size: ' + fileSize;
        }
        else
        {
            document.getElementById('message').innerHTML = "Please select .png files";
        }
    }

    function uploadFile()
    {
        var file = document.getElementById('fileToUpload').files[0];
        if (file && file.type == "image/png")
        {
            var fd = new FormData();
            fd.append("fileToUpload", file);
            var xhr = new XMLHttpRequest();
            xhr.upload.addEventListener("progress", uploadProgress, false);
            xhr.addEventListener("load", uploadComplete, false);
            xhr.addEventListener("error", uploadFailed, false);
            xhr.addEventListener("abort", uploadCanceled, false);
            xhr.open("POST", "/pages/ajax/upload");
            xhr.send(fd);
        }
    }

    function uploadProgress(evt)
    {
        if (evt.lengthComputable)
        {
            var percentComplete = Math.round(evt.loaded * 100 / evt.total);
            document.getElementById('progressNumber').innerHTML = percentComplete.toString() + '%';
            document.getElementById('progressn').value = percentComplete;
        }
        else
        {
            document.getElementById('progressNumber').innerHTML = 'unable to compute';
        }
    }

    function uploadComplete(evt)
    {

        $('#updata')[0].reset();$('#insertchart').show();$('#insertchart').click(function ()
        {
            var txt = $('#Content').val();
            var cur_pos = $('#Content').getCursorPosition();
            var htmlString = '<img src=\"/charts/' + evt.target.responseText.replace(/\r?\n|\r/g, "") + '\" alt="Chart">';
            if (cur_pos != 0)
            {$('#Content').val(txt.substring(0, cur_pos) + " " + htmlString + " " + txt.substring(cur_pos));
            }
            else
            {$('#Content').val(htmlString + " " + txt);
            }$('#chartname').val(evt.target.responseText.replace(/\r?\n|\r/g, ""));
            return false;
        });
    }

    function uploadFailed(evt)
    {
        alert("There was an error attempting to upload the file.");
    }
    function uploadCanceled(evt)
    {
        alert("The upload has been canceled by the user or the browser dropped the connection.");
    }</script><div id="chart-d">
        Upload chart <form enctype="multipart/form-data" method="post" action="" id="updata"><input type="file" id="fileToUpload" accept="image/png" onchange="fileSelected();"><a href="#" onclick="uploadFile()">Confirm upload</a></form><span id="progressNumber"></span><progress id="progressn" max="100" value="0"></progress> <div id="message"></div><a href="#" id="insertchart" onclick="$('#chart-d').hide();" style="display: none">Insert chart</a><a href="#" onclick="$('#chart-d').hide();">Exit</a></div>

I'm looking for a function to reset or clear the entire data (reset XMLHttpRequest) or open the new window as the page was first loaded if this links are clicked:

<a href="#" id="insertchart" onclick="$('#chart-d').hide();" style="display: none">Insert chart</a> 
<a href="#" onclick="$('#chart-d').hide();">Exit</a>


Viewing all articles
Browse latest Browse all 5678

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>