How to upload a file to a website using HTML - html

I'm developing a website and I'd like the users be able to upload files to the server using a webpage.
The server side is .NET, but it's not ASP.NET. That means, I'm generating the html code myself instead using ASP.NET, and I'm working with the GET string and POST stream directly. It's a good exercise to learn what happens under the hood :D, specially nowadays when there is a framework for everything.
I've been trying to find information about this, but I found several approaches, some of them javascript (thing I want to avoid for the time being) and lots of premade controls. What I want is to do it myself, I don't care if there is a nice, nifty and well-proven ASP.NET control... what I want is understand how it do that with all its implications.
Cheers!

In the HTML you need a form with an input of type="file" and the enctype attribute of the form set to "multipart/form-data" rather than the default of "application/x-www-form-urlencoded".
Multipart/form-data is defined in RFC 2388, and will behave differently to the application/x-www-form-urlencoded you've been parsing with this experiment so far, though it's quite straight-forward. The RFC should give you all you need to know to replicate how the HttpRequest.Files property works in ASP.NET.
An extension of this, try sending streams from XMLHttpRequest in a page or HttpWebRequest in a .NET client application, using both POST and PUT (you may have to change IIS settings to allow the PUT through), as this the overlap of working on that along with your experiments here will cover some knowledge that has some real applicability even when you are using all the toolkits. Another extension is to try implementing both sides of both schemes in RFC2617 without any help from the framework (sometimes the server side of this is genuinely useful).
Kudos for experimenting with this, it should bring real experience to back up what you can learn from reading RFC 2616 (though that's still absolutely vital for anyone doing web stuff to be intimiately familiar with, as reading will cover some cases your experiments don't touch on, and explain anything that seems strange in your results).

I think this should have what you need.
Basically you need an <input type="file"> and to set the encoding of your form to multipart/form-data.

<input type="file" name="somename" size="n">
You put that in a form, and hasta la vista baby !

You can't do a file upload using pure HTML: You will need to handle the uploaded files on server side.
You could parse the uploaded file(s) out of the raw POST data if you want to learn how it works "under the hood" (see here for an example how to do it in ASP), but you will need some kind of server side language to do it.

Related

How can I pass form data from one html file to another without JS/PHP?

I'm learning basic web dev and started with HTML, CSS, Bootstrap. Haven't touched PHP or anything server side yet.
What I've done so far is I've created a pretty basic registration form with 5 fields and what I'm trying to do is display the input of those fields in a table that I've created on another page. The submit button has the "method" and action. Now, I've Googled a ton to find some solutions and have gone through most of the questions of this site but I still can't find out to achieve what I'm trying to do without the use of PHP/JS.
So, is it even possible to read form data from another page like this without the use of JS/PHP? If so, how do I proceed and what needs to be done? I can post the source code but I don't think it's going to help since there isn't much there, everything else is working fine except for finding a solution to this.
Thank you.
You need a programming language.
If you want to do it entirely client-side, then that has to be JS.
If you want to do it server-side (which allows you to access the data and, optionally, make it available to other people, instead of limiting it to the user of the browser) then you can use any programming language at all (although JS and PHP are among the most common choices).
Since you are trying to create a registration page, you'll need to use server-side programming.
You necessarily need to use JavaScript / PHP.
Since you are just starting, I would highly recommend you to check out the W3Schools tutorials on HTML, CSS, JavaScript, PHP, Bootstrap and jQuery.
:)
So this is long gone but I was actually able to resolve my problem without using anything other than basic HTML , so here's how I did it for anyone else who's trying to find the answer to problem (probably not, you don't usually do this professionally and basically this was a challenge from a friend).
So, two things.
SessionStorage
LocalStorage
This is built-in to your browser and you can use it to achieve simple tasks by simply assigning values to it. They'll remain there and you can use however you want.
But, as the name implies, sessionstorage will only retain those values during the session (the time you have your browser open for) while localstorage can retain it indefinitely. Not sure if I can link other sites over here so just Google these terms to learn more and how to use them.

why sometimes jsp is used instead of html for user interface?

I have a project that I am working on Spring MVC. The project uses jsp instead of html in my view for the front end UI. Can you please tell me why jsp is being used and not HTML. Is there any special purpose for using .jsp files instead of .html in Spring MVC. Can't I use html and Javascript to achieve the same functionality?
I understand this is a basic question but I dont have any experience in web development, I have just started working in a company and they want me to work on this. I have tried looking for comparisons, but there are a lot of comparison between jsp and servlets online but I cant find anything which tells why jsp is used instead of HTML pages. This might be very obvious to you but its not to me. Any hints, links, description is appreciated.
From my experience below are the reason of using jsp or more in general a template language for rendering view.
HTML can not read request data as it actually don't know what is request / session data and it has nothing to do with it actually. On the other hand, jsp knows request, response, session etc.
when you need to generate your content dynamically you may use loops and other logical stuff available but how will you do that in html? Your answer could be using javascript but it would be more problematic.
HTML is statically typed and is parsed at browser i.e. client side and hence would be evaluated at client side which exposes your page and would allow client to do several manipulations. But JSPs are server side and hence are more secure and safe as client can only access html in last.
Last but not least Java knows JSP but not html and hence for developers using JSP is better as they easily do good manipulations which a UI dev can't do .
Hope it helps!

Possible to build an editable site in just HTML/CSS?

A local nonprofit needs a new website. It's a very basic website that simply presents information, nothing past basic HTML/CSS is needed to make the actual site.
The marketing manager would like to be able to edit text sections (upcoming events, jobs) regularly. How would I go about creating the site in HTML/CSS and then allowing them to edit just the text in those sections in an easy way? is that even possible, or would this require more advanced knowledge of actual programming/database languages?
Thanks
No, you can't edit the site with just HTML and CSS. Even if you have JavaScript, you'll need server side code (ASP.NET, PHP, Ruby on Rails, Node.js etc) to store the changed text, since HTML, CSS, and JS run on the client (excluding server side JavaScript based frameworks).
The easy solution is to just use simple HTML and tell him to directly edit the HTML. If he's just a little bit technical, an hour or two of explanation of how HTML works might be enough to get you going.
A CMS solution that is prebuilt and has simple menus for editing things might work nicely. There's plenty of various options to suit your needs.
Otherwise, you can either build a custom site. A custom site that reads text from simple text files might be all it takes (Markdown might be preferable to plain text.) Of course, you can scale it up if you want until you've basically built your own CMS.
You can't do that.
HTML pages are stored on a server (which is just a computer accessible by other computers via an internet connection), when you type in an address in your browser's address bar it sends a request to a server to fetch the corresponding HTML page. Then this page is displayed in your browser.
Now, say you managed to change a text in your browser somehow using HTML/CSS, but you still need to find a way to send these changes back to the server so that these updated pages are accessible by other remote browsers, and the only way of doing this is to use server side languages. They are not really that difficult, you can quickly learn that.
You might like to take a look at this sourceforge project.
This is a file-based system that uses conventional HTML for the webpages, but allows online editing with CKEditor. Requirements are Apache 2 and php 5.3 or later.
There is a testdrive available.
Login with guest.

Finding out how a website is coded

I'm trying to figure out how to program a website that looks very similar to http://www.renthop.com/.
I'm new to web coding, so I'm not really sure where to start. For example, is it Java or HTML? Or both? I really like how its setup, the responsiveness and smoothness of it. I just want to make sure I start off in the right direction in terms of choosing the right language etc.
If anyone has any idea of what this is based on it would be greatly appreciated!
Thanks - KC
The server-side code is PHP, the front-end is built off of the jQuery and jQuery-UI javascript libraries and a series of third-party plugins. The final product is a dynamic HTML application.
Do you want to launch your website? If so, creating a website from HTML would only make a website on your local hard drive, not public. You're going to need a domain name and hosting to make it public.
HTML is a markup language for formatting websites, but you can still create a website out of it. Not public, as I said above.
CSS is rulesets for telling the browser how to display the HTML formatted content. It is also not a programming language in the same way HTML is, although it can be a lot more powerful.
Javascript is a programming language. You use it to make the website interactive. Get Firebug or a similar add-on for Firefox, or just right click and 'Inspect Element' in Chrome to see the javascript for more detail on what javascript does.
AJAX is an extension of javascript to get data from the web server and update the page with it, without having to refresh the page.
PHP is code commonly used server side to interact with the filesystem and databases and output HTML. You can also use python, perl, .NET and a handful of other languages/frameworks to do this.
MySQL is a database.

how i can make ajax uploader for images?

I need to implement Ajax uploader for image on my website. means when someone upload image i show them without refresh.
don't thing it's impossible like most of blog have a process that when upload a image they open pop-up and when i upload pop-up are closed and image now can seen in old windows i have where i write weblog.
can someone show me example or source code to implement this
you might want to check out:
http://pixeline.be/experiments/jqUploader/test.php
and
http://www.malsup.com/jquery/form/#code-samples
They are pretty neat :) Hope it helps! Cheers!
Most common solution for 'ajax' uploads is actually very simple, namely a hidden iframe. As long as it's within the same domain, you can access the contents and parse the response from it just like you would any other request.
The new XMLHttpRequest, most commonly used within HTML5 applications, is actually capable of transmitting files as well. Right now it's not the most broadly supported method, but depending on your situation it might work as well.
http://www.matlus.com/html5-file-upload-with-progress/
As far as I know.. you can't. This requires a multipart/form-data post and you may only do that with a form. You cannot transmit files asynchronously.
Ajax is an XmlHttpRequest, which does not contain files.