I have an application that uses asp.net C# and I need to create a page where I can upload files in different times.
The idea:
Step 1: Click on "add files" button, select one or more files, press ok.
Step 2: Click again on "add files" button, select one or more files, press ok.
Step 3: Click on "finish" to send the files and textfields.
The problem:
When I add a file or more a single time (step 1) they get posted to the back-end and I can save them normally. However when I do step 1 and step 2, the form overwrites the previsouly added files list. Is not that it saves the files deleting the others, this is pre-back-end.
I've checked a lot of tutorials but all I could find are showing how to upload multiple files (just an attribute of asp:FileUpload). Everytime I try to add files from different folders or in different times, they always send only the last ones I added.
Can anyone help me out?
Thank you.
Not sure if this is the best way to do it but it worked for me:
1- I created an "onChange" javascript event on the asp:FileUpload control.
2- For each file inside the fileupload.files I converted them to a Base64 string and passed them with their file names to a C# webmethod.
3- Inside the webmethod I stored the string and file names.
4- After clicking on "finish", other C# method is called to loop through the temporary files list and save them all.
Thanks
Related
I'm trying to make a website with a sort of survey where the user picks one of 2 buttons with different text values and the website saves what value he picked and reloads the website giving the user 2 new values on the buttons. I already made the system for rolling new button values and reloading when one of them is picked but I cant figure out how to save data.
This is the current code I have:
function b1() {
data = document.getElementById("b1").innerHTML;
alert(data);
location.reload();
}
This function is called when one of the buttons is pressed (there is another one for the other button) and the data variable is what value is on the button.
Instead of alerting the data variable I want to be able to add 1 to a variable in a database which counts how many times this value was picked.
I already tried using the google sheets api but it did not work and just stopped the code from working.
I tried adding a .txt file and use js to edit it but since js is ran client side it cant edit server side files.
You can use google forms for that.
Usually if you want a custom solution you would need PHP.
Using external software like with an API you can get an easy solution without too much effort.
At the end of google forms when you have made your form, you have the option to share, and there you should click the "<>" tab to copy the iframe into your HTML.
I know this question has been asked dozens of times but I can't seem to find a solution that will work for me.
I am trying to restrict the jQuery UI version of Blueimps jQuery File Upload to one file but with no success.
I have modified the input on the form to
<input type="file" name="file">
I have changed the following options:
maxNumberOfFiles: 1
singleFileUploads: false
limitMultiFileUploads: 1
Despite the settings above the script still allows the user to add multiple files and although it displays a message saying they have exceeded the upload limit, it still uploads all of the files.
Ideally I would like the list to clear whenever a new file is added so if a second file is added it simply replaces the existing file in the list.
I have tried adding $("table tbody.files").empty(); as a call back to the add function but all this does is remove the previous file from the visible list, when the user clicks upload it still uploads all the files the user has added.
Sorry for the slightly confusing title, but couldn't find anything online to help me with the issue I am facing. Essentially, I have three Javascript files and two different HTML pages. In the first HTML page, let's say first.html, I have two buttons, let's call them Button 1 and Button 2. When the user clicks on Button 1, it opens up a Javascript function in javascript1.js which makes a call to a REST API. It then passes this data to javascript2.js by passing it as a parameter. Essentially, this is how it looks like:
javascript1.js
function firstfunction() {
$.getJSON("http://website.com", function(data) {
newfunction(data);
}
}
Inside javascript2.js is
function newfunction(dataparameter) {
alert(dataparameter);
}
This so far is working perfectly. However, some complications arise with the second button in first.html. Essentially, after the user clicks on the first button a second button becomes available which leads the user to a new html page, in this case second.html. Now inside this HTML page, I want to display the same data that javascript1.js produces in a file called javascript3.js. I have tried many options, such as using cookies, or passing it in a parameter, etc. However, I have been unable to do successfully do it as I am a bit confused on how to include the Javascript files in the HTML page. In first.html, I am including javascript1.js and javascript2.js. In the second.html, should I be including all three javascript files? I could just try to make the get call again in the new HTML page but I'd prefer to find a more efficient way. Please let me know if I should provide more code/explanation; hopefully this question makes sense! Thanks for the help!
According to this section jQuery-File-Upload Basic plugin documentation, you can upload file upon a click of a button by using add. however, this causes an additional 'Upload' button to be added each time the user select a file, whereas my app only accepts a single upload.
see JS fiddle here
so how to achieve this: when user clicks Choose file the 2nd time, that file replaces the initial file and only one upload button is present at any moment.
Thanks!
It looks like a new button is getting added every time the 'Add' event fires with this line:
$('<button/>').text('Upload').appendTo(document.body)
You can prevent re-adding the button in multiple ways, here's a simple example:
if ($("button:contains('Upload')").length == 0) {
$('<button/>').text('Upload').appendTo(document.body)
}
You'll probably have to update the code to rebind the 'click' function with the new data being submitted.
When the user selects files to be uploaded I present one of two buttons to take action on the file(s) based on how many files there are. I get the number of files by including an onchange=getNumFiles(this) in the file input tag.
My problem is that I hide the button to take action on the files after the user clicks it, and if the user selects the same file(s) a second time the button is not "re-presented". This is happening because the file upload input never actually changed because the input is still holding the original file selection. How can I account for this?
Is there a way to clear the contents of the file upload input? I've tried setting the value to null to no avail. Or is there a different event other than onchange that I should be using? hope this makes sense....
"Is there a way to clear the contents of the file upload input"
Yes, call .reset() on the form.
$("#myform")[0].reset();
Now if the same file is selected again it will correctly trigger a change event since it changed from nothing to something again.