HTML Forms without actions - html

In Django / Pinax, I've come across the login form which starts like this :
<form class="login" method="POST" action="">
It works perfectly well. So I assume that either some java-script or something in the Django framework is putting the value into the action attribute.
So, my questions:
How does Django insert the action?
Why do they do it like this?
How can I find out what the action of this form is?
Update : I see this is not a Django thing at all, but what most browsers do.

Having an action of an empty string in most browsers points the form at the URL the browser currently has loaded, which is the script that served the form in the first place.

For an interesting insight on forms with empty actions read this thread, which gives you an updated HTML5-perspective on this matter.

It's also possible that javascript loaded with this page could be setting an action once the page is loaded based on what application is using the page.
Another likely possibility is that the javascript is handling the onsubmit event. One might do that to prevent the page from reloading or redirecting to a specific page

I guess it's bit late to answer this post. Anyways, I'll what I learnt about this.
If the "action" is not specified in forms, then the Django looks up the HttpResponseRedirect in the corresponding view.
For example, in the example below:
if form.is_valid(): # All validation rules pass
# Process the data in form.cleaned_data
# ...
return HttpResponseRedirect('/thanks/')
Once, the form is validated (and processed), the page is redirected to 'thanks'

Related

HTML Form: Can submitted GET/POST parameters be suppressed using only HTML or CSS?

I am volunteering on a website-based project that is trying to make all pages fully operable JavaScript free before adding any JavaScript for enhancements, and I was asked to investigate whether or not a particular scenario could be handled purely through HTML/CSS.
What we have is a form that is populated to help us filter a list of tickets that are displayed on the screen after a page update through a GET action, which itself works fine, but the concern with the current implementation is that the URL cannot be made into a permanent link. The request, however, to keep the permanent link as minimal as possible, is to only send GET parameters for fields that are populated with something (so, suppressing GET parameters for fields that are blank) instead of having a different GET parameter for each form field on the page.
I have thought of several ways that could be done, most including JavaScript (example: create fields with ids but no names and a hidden field w/ name that uses JS to grab the data from the fields), but also one that would be a POST action with a redirect back to the GET with a human readable string that could be permanently used. The lead dev, however would prefer not to go through the POST/redirect method if at all possible.
That being said, I'm trying to make sure I cover all my bases and ask experts their thoughts on this before I strongly push for the POST/redirect solution: Is there a way using only HTML & CSS to directly suppress GET parameters of a form for fields that are blank without using a POST/redirect?
No, suppressing fields from being submitted in an HTML form with method of "GET" is not possible without using JavaScript, or instead submitting the form with a POST method and using a server side function to minimize the form.
What fields are submitted are defined by the HTML specification and HTML and CSS alone cannot modify this behavior and still have the browser be compliant with the standards.
No, you cannot programmatically suppress any default browser behavior without using some kind of client scripting language, like JavaScript.
As a side note, you say "JavaScript for enhancements", but JavaScript is not used for enhancements these days. And no one in the real world would except a decent front-end without the use of JavaScript. I would suggest you simply use JavaScript.
I do not think you can avoid Javascript here to pre process before submission to eliminate unchanged /empty form fields.

Unable to understand a html attribute

I am learning html from w3schools. They have used <form action="demo_form.asp"> this form tag with attribute action="demo_form.asp. I know the meaning of form tag as well as action attribute. But I don't know what is the meaning of action="demo_form.asp". When I use this attribute action="demo_form.asp", a file named demo_form.asp start downloading!
Can anybody explain me this thing?
Full code is here.
action attribute define the page to be use to post the data, when you hit submit button it redirect to the page you have mentioned in the action attribute. so that you can access the data submitted through this page.
The action="demo_form.asp" attribute is the file to which your <form> will be submitted.
From HTML spec
action = uri [CT]
This attribute specifies a form processing agent.
It's used to send the request to the page (url) specified in the action attribute when the form is submitted.
As per the example:
Once you enter your favourite color in the input box & click submit.
The form details is sent to the server page (demo_form.jsp) based on form action.
There the form is processed and based on the input, it's redirecting you to different page.
Where you can find the fav color which you have entered is mentioned there.
Input was received as:
favcolor=blue
The value of the action attribute tells the browser the location of the script that will process this form. In the example you have provided, the data submitted by the user in the form will be processed by the file/script called demo_form.asp.
The action element points to a thing that will handle the content of the form you have submitted. This can be as simple as a new page (maybe php), or a .cgi script, and so on. In your case it is attempting to submit to an ASP page. If you are attempting to use the form in your own pages, it is likely your browser can't find 'demo_form.asp'.
Why it is attempting to download it, rather than just tell you the page is missing, I'm afraid I don't know.
Hope this helps.
demo_form.asp should execute and not download. How are you running the file? It looks like your IIS is not enabled.
If you are trying this locally, to run ASP you'll have to configure IIS in your system (it is not enabled by default) and then use
http://localhost
.... to run your file. Otherwise ASP will not execute. See http://msdn.microsoft.com/en-us/library/ms181052(v=vs.80).aspx for enabling IIS. Once IIS is enabled,
http://localhost
will point to c:\inetpub\wwwroot folder by default. Create a folder in wwroot (say test) and place your files inside that folder. If your file is abc.asp then to run it you'll have to type
http://localhost/test/abc.asp
.
Hope this helps.

How to specify DELETE method in a link or form?

Rfc2616 lists many methods besides GET and POST, like, say, DELETE, PUT etc. Method field in html forms, though, seems to be allowed to specify only GET or POST.
Is it possible to create a link or form in a html page that uses a request method that is not GET or POST?
Was trying to figure this out for a rails app that was using Angular on the front end; these seems to work for that environment:
<a data-confirm="Are you sure?" data-method="delete" href="/link-to-resource" rel="nofollow">Delete</a>
Edit: Just to give everyone a heads up, I think you still need to have jQuery for this to work. I removed jQuery and it stopped working; I put it back and it started working.
You certainly can’t create a link that uses anything other than GET. Since HTML began, links have been meant to be idempotent and free from side effects.
For forms and XMLHTTPRequests, Caps’ link is the place to look: Are the PUT, DELETE, HEAD, etc methods available in most web browsers?.
By default, not there is no way to do this. Links always perform GETs, forms can use GETs or POSTs.
That said, with a little JavaScript, it's possible. Rails for instance ships with helpers which will add a data-method attribute to links. Rails-UJS is a jQuery library that will transparently intercept clicks on these links, and trigger a form submit with a _method parameter used for overriding the normal HTTP method. Finally Rack will intercept requests with a _method params, and overwrite the request method with the value in _method.
Other frameworks no doubt follow a similar pattern.
If you want even more details, I've written up an explanation of how Rails, Rails-UJS, and Rack all work together to provide this.
It's good to know how your libraries work.
It is not possible to create a link or form with delete method.
Many web framework create a hidden input called "_method" for handling PUT and DELETE.
I created a plugin for automatically convert links to forms : RestfulizerJs
You can take a look here : https://github.com/Ifnot/RestfulizerJs
#Ifnot plugin is great but I created a one based on $.ajax function instead of appending hidden forms! here's a simple example for a DELETE request
HTML
<button class="delete" data-target="http://example.com/post/post-id/" data-method="DELETE" data-disabled="true">Delete Article</button>
JavaScript
$(".delete").restintag(optionsObj, function(data) {
console.log(data);
},
function(error) {
console.log(error);
});
https://github.com/KhaledElAnsari/RESTInTag/
HTMX is designed to solve this.
Why should only <a> and <form> be able to make HTTP requests?
Why should only click & submit events trigger them? Why
should only GET & POST methods be available? Why should you only be
able to replace the entire screen? By removing these arbitrary
constraints, htmx completes HTML as a hypertext
It enables any DOM element to make HTTP requests GET, POST, PUT, PATCH, and DELETE, without writing any custom JavaScript.
just add a data-method attribute,<a data-method='put' href='whatever'>link</a>

Is Form Tag Necessary in AJAX Web Application?

I read some AJAX-Form tutorial like this. The tag form is used in HTML code. However, I believed that it is not necessary. Since we send HTTP request through XmlHttpRequest, the sent data can be anything, not necessary input in form.
So, is there any reason to have form tag in HTML for AJAX application?
Apart from progressive enhancement as already discussed (don't make your site require JavaScript until it really has to), a <form> with onsubmit would be necessary to reliably catch an Enter keypress submission.
(Sure, you can try trapping keypresses on separate form fields, but it's fiddly, fragile and will never 100% reproduce the browser's native behaviour over what constitutes a form submission.)
Sometimes, web apps using ajax to transform their data either use forms as a fallback when the user has no JavaScript enabled (a sometimes expensive but very good thing to do).
Otherwise, if an application builds and sends an AJAX request, there is no compelling reason to use a form except in rare special cases when you actually need a form element. Off the top of my head:
when using jQuery's form serialize function
when monitoring all fields in a form for changes
when there is need to make use of the reset form button (that to my knowledge is available in a proper <form> only).
I see at least two possible reasons :
Graceful degradation (see also Unobtrusive JavaScript) : if a user doesn't have Javascript enabled in his browser, your website should still work, with plain-old HTML.
Behavior of the browser : users know what forms look like and how they behave (auto-completion, error-correction, ...) ; it's best not going too far away from that
And I would add that, if you want the user to input some data, that's why <form> and <input> tags exist ;-)
Using the right tags also helps users -- as an example, think about blind users who are navigating with some specific software : those software will probably have a specific behavior for forms an input fields.
It really depends what you're doing. If you're wanting to take form content submitted by the user and use AJAX to send that somewhere then you're going to want to use the form tag so your user can enter their data somewhere.
There will be other times when you're not sending data from a form and in that case, you wont have a form to be concerned about :)

How can I post data (form) to html page and hijacking the data in the middle?

the site addres: http://www.ynet.co.il/YediothPortal/Ext/TalkBack/CdaTalkBack/1,2497,L-3650194-0-68-544-0--,00.html
fill the form with rubbish.
Hit 'Send'
the form post the data to another HTML without any parsing of the data i've just added
How do they do it?
A likely option is that they are using a content management system where "html" on the URL doesn't actually mean it's a static html file.
This may be out of left field, but I've certainly used the occasional JS function to grab everything in the header and either parse it or pass it to another script using AJAX.
I'll sometimes use this method in a 404.html page to grab the headers of the previous page, parse them out to see where someone was trying to go and redirect them.
That is, as annakata said, one of the numerous options available.
Edit based on clarified question:
Numerous frameworks can be configured to intercept an html request - for instance asp.net can be set to handle any given extension and an HTTPModule could do anything with that. It's really up to web server configuration what it decides to do with any request.
also: you don't really want to be saying "hijack"