I've got a very basic form here in which I want to test whether the input text value is correctly picked up when clicking the submit button.
<form id="form1" onSubmit="console.log(document.getElementById('inkomen1').value)">
<input type="text" id="inkomen1" name="inkomen1">
<button type="submit" form="form1" value="Submit">Submit</button>
</form>
So I've set the form onSubmit to display the contents of the input text field through console.log. Live this works, but locally I always get this strange error in my console:
Not allowed to load local resource: file:///favicon.ico
Why doesn't this work when I text the file locally and why this request for 'favicon.ico'? Can I make it work locally somehow too?
It's has nothing to do with the code you included in your question. You have an HTML code that has a link to a favicon. The link has an absolute path file:///favicon.ico which is not correct when running your code in a different environment.
Use a relative path, if your favicon is in the same path as your HTML you can set it to:
/favicon.ico
UPDATE
Try to add custom action to your form
<form id="form1" action"targetPageHere" onSubmit="console.log(document.getElementById('inkomen1').value)">
Maybe the default action page is not your page and has a different code that include this reference.
Related
I have this simple web form which has just a single button so the user can open a static PDF file when they click it.
Now that I've updated the PDF file, I updated the query string timestamp cache-busting parameter so they see a new version of the file.
<form action="Path/To/My/PDF Document.pdf?v=1234" target="_blank">
<button>Get your PDF here!</button>
</form>
Well, the PDF opens up alright, but the querystring is automatically reduced to just the question mark.
What opens up is: Path/To/My/PDF Document.pdf?
This shows the original version and not the new one, and I'm wondering what is the matter with this process?
*I know method="GET" is not in my example, but it does the same with or without it.
Give this a go:
<form
action="Path/To/My/PDF Document.pdf"
method="GET">
<input type="hidden" name="v" value="1234" />
<button>Get your PDF here!</button>
</form>
Key points:
specify the method as GET
provide the query-string parameter as a hidden input, with the name set to the name of the query-string
The reason this works is because of how forms process input data.
Demo: https://jsfiddle.net/1tszbe5o/
Recommended reading for WHY this works: https://developer.mozilla.org/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data
TLDR: when you use the GET method, any form data provided with form inputs will be included in the query-string of the HTTP request resulting from the form action.
Why does it get stripped out in the first place? Because the form data was empty, hence the query-string was empty also ;)
We are trying to upload files to blob storage, the process currently works, however, when trying to upload a file greater than ~28.5MB through the HTML input type="file" element, a connection was reset error message appears. When debugging, the page never hits our httppost method in the C#. However all files we have tested under 28.5MB will upload correctly.
This is the file input in our cshtml page.
<input id="files" type="file" asp-for="UploadFiles" multiple />
Our form looks like this:
<form method="post" enctype="multipart/form-data" asp-area="JobManager" asp controller="KnowledgeBase" asp-action="EditItem">
There is a limit in Kestrel noted at https://github.com/aspnet/Announcements/issues/267.
I have a form that reads
<form action="Send.asp" method="POST" name="Order" id="Order">
in my send a quote page. The submit button reads as follows:
<input name="B1" type="submit" class="style80" value="Submit">
Now when I click on the button, it only redirects to the home page. I would like it to go to the .asp file called Send.asp
That .asp file has the sending methods: connect to SMTP server and compile an email form the input boxes on the request page.
Why is my email not sending? What am I missing from the form tag?
Your input type=submit seems correct. Is the Send.Asp page in the same directory than the html file ?. Maybe you have to use other relative route.
Are you debugging Send.asp file to check if it is being called?.
That could be a start.
Try changing aswell the Send.Asp with full url to discard that the url is not valid.
form action="http://yoururl/yourproject/Send.asp" method="POST" name="Order" id="Order">
following code is working but with 2 issues: It is part of bigger form on the web page it appears on.
<FORM id="my_file_upld_form"
style="display: inline;"
METHOD="POST"
ACTION="/cgi-bin/fileupload_ajax.pl"
ENCTYPE="multipart/form-data">
<INPUT TYPE="file" class="ajaxfileupload" NAME="myfile" SIZE="42">
<input type="hidden" class="ajaxfileupload" name="fileupload" value="ajax_fileupload">
<input class="ajaxfileupload" type="submit" value="Upload"/>
</FORM>
it is allowing "blank" or empty (no file selection and upload button clicked) to upload. which is causing 500 error on server.
bigger problem is: after the file is uploaded, a new blank page is opened in browser and user has to use back button to go back to the page from where this was run. This happens irrespective of the fact that the ajax script returns anything back or not.
how to fix? I am open to replace this piece of code on the page, if needed.
It's hard to tell exactly what is going wrong without your java script code. However I think I know how to fix some of your problems.
Don't trust the client you need to handle in your backend code the ability to handle a form that gives you bad data. You can validate the form client side but you always need to validate server side as well.
I suspect this problem is happening because you aren't preventing the default event in javascript. In jquery you would do
$("#my_file_upld_form").submit(function(e){
e.preventDefault()
})
I'm trying to setup a simple form in a jsp that will put a search query in the URL submitted.
This is what I have so far:
<form action="search/" method="get" onsubmit="this.action+=this.q.value.trim();return true">
<input type="text" id="q">
<input type="submit" value="go">
</form>
This is in a jsp that's included on each page of my web app and it works when I'm at the root of the app. For example, if I initially load "http://localhost:8080/MyApp/" then type "123456" in the search form, it takes me to "http://localhost:8080/MyApp/search/123456", which is what I want. However, from that page, if I search again (for "654321" for example) it goes to "http://localhost:8080/MyApp/search/search/654321", which doesn't work for me. I need search/{query} to be appended to the root of the app's path no matter what page I may be on at the time.
I would like to avoid javascript if possible, I'm fine with JSTL though.
Any suggestions would be much appreciated!
Simply add a full path to your action, start it with /. Note it will depend on your application context, you could use :
<form action="${pageContext.request.contextPath}/search/"...
It will work in dev and also prod.
EDIT :
Path : search will try to load relative from current path so : http://domain.com/contact/search/
Path : /search will try to load relative from the domain so : http://domain.com/
With the context path above, it will work no matter if it change from dev to prod.
Hope this helps!