Here is a simple script to login automatically to my ipcamera. The view from the ipcamera is integrated as a moving picture in a slideshow [stills] on my webpage, which can be viewed anonymously. [that is why a want to automize the login, i.e. not to bother the viewer with inlogcodes, nor myself].
When I login via the "authentication required" popup from the remote web-adress of the ipcam [which is different from the slideshow's url all is going well and the integration succeeds, so let us skip this part.
This is the login script:
<html>
<head>
<script>
<!--
function login() {
document.form1.action="http://86.95.237.226:8884/videostream.cgi";
document.form1.submit();
}
//-->
</script>
</head>
<BODY bgcolor=#000000 onLoad="login()">
<FORM NAME="form1" METHOD="POST">
<INPUT TYPE="hidden" NAME="login" VALUE="video">
<INPUT TYPE="hidden" NAME="password" VALUE="video">
</FORM>
</BODY>
</HTML>
Now the "authentication required" popup still appears with empty fields. I don't see . Hope somebody can explain why this script doesn't work and maybe also has a suggestion for its solution.
BTW replacing the action property [url] in the script with the empty string [as was the case in the original script] and moving the action=url into the Form tag does not result in a camera view, although the authentication req does not pop up now, which does not mean that the login succeeds.
Appreceate all help,
Wimsch
Put your credentials in camera URL:
document.form1.action="http://user:pass#86.95.237.226:8884/videostream.cgi";
When i click a radbutton then postback changing page url as /blabla.aspx?btnMsg_ClientState=&btnCarDetails=Sorgula&btnCarDetails_ClientState=&btnPrice_ClientState=&btnReject_ClientState=# ..
First pop-up work but then break.
There are 5 extra buttons and seems all in page url. Where is coming these query strings ?
Ie Developer tools says:
ScriptResource.axd...
I cant find solution, please help.
It appears that the form on your page is configured to use a GET request when submitted.
<form id="form1" runat="server" method="get">
In this case all parameters on the page are specified as part of the URL, which includes the input elements that are used for rendering the button, as well as the other input elements on your page.
You can change this behavior by setting the method attribute of the form to post, so that a POST request is utilized for submitting the form.
<form id="form1" runat="server" method="post">
In this case the parameters will be passed in the message body of the HTTP request.
I've noticed that browsers do not store form values until the form is submitted, which means that if you're using AJAX instead of a standard form submit, your browser's auto-fill is never populated. Is there a way to force populate your browsers auto-fill/auto-complete so that I can have this convenience with forms that are submitted via AJAX? It's annoying to go to my AJAX page and have to type in the same things in the form fields every time because the browser doesn't remember them.
My question is pretty much identical to the this one, except that only a work around in FireFox is provided as the accepted answer to that question. I'm looking for a solution that works in all major browsers (at least Chrome, FF, and IE), if there is one.
Note: I am not talking about AJAX auto-complete plugins, which is what almost always pops up when googling this question. I am talking about your browser's built-in auto-complete or auto-fill that helps you fill out forms by remembering what you entered in the past.
For anyone who's still trying to solve this, seem like I've found the answer.
Chromium tries to recognize the submit event, even if you preventDefault and handle the actual submission yourself.
That's it, you need to preventDefault the submit event, not the click event.
This worked on Chrome, Edge and IE 11 at the time of writing (I'm too lazy to download and test it on Firefox).
Here's your form:
<form method="POST" id="my-form">
<label>Email</label>
<input autocomplete="email" type="email" name="email">
<button type="submit">Subscribe</button>
</form>
Notice the autocomplete attribute. These are all the possible values that you can use for autocomplete.
In JavaScript, simply do this:
$("#my-form").on("submit", function (ev) {
ev.preventDefault();
// Do AJAX stuff here
});
The browser will remember whatever email you've entered on clicking subscribe button.
I have also come across this; there doesn't seem to be a great solution, certainly not a cross browser one, but here is one for IE I haven't seen anyone mention:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<SCRIPT>
function subForm()
{
window.external.AutoCompleteSaveForm(f1);
f1.submit();
}
</script>
</HEAD>
<BODY>
<FORM id=f1>
User ID : <input type=text name=id></input><br>
Password :<input type=password name=pw></input><br>
E-mail :<input type = text VCARD_NAME = "vCard.Email"> <br>
<input type=button value=submit onclick="subForm()">
</FORM>
</BODY>
</HTML>
From: http://support.microsoft.com/kb/329156
Use this Method:
AutoCompleteSaveForm = function(form){
var iframe = document.createElement('iframe');
iframe.name = 'uniqu_asdfaf';
iframe.style.cssText = 'position:absolute; height:1px; top:-100px; left:-100px';
document.body.appendChild(iframe);
var oldTarget = form.target;
var oldAction = form.action;
form.target = 'uniqu_asdfaf';
form.action = '/favicon.ico';
form.submit();
setTimeout(function(){
form.target = oldTarget;
form.action = oldAction;
document.body.removeChild(iframe);
});
}
Tested with ie10, ff latest, chrome latest
Test yourself: http://jsbin.com/abuhICu/1
Have you try the answer of my question that you mention?
The answer is using hidden iframe but seems he claim the idea is not working on IE and Chrome on that time.
Try to take the idea, and instead of using hidden iframe, just put the username/password/submit visible input element in a form POST, in an iframe. So user will enter login details directly into iframe. With proper Javascript you can put loading image, get success or denied from server and update the parent or the whole page. I believe it should work on any browser.
Or if you still want to use AJAX since you probably implemented the API on server side. You can make the iframe to just send a dummy POST at the same time send the real user/pass to AJAX URL.
Or back to use hidden iframe, not to hide it but move it to the invisible area like top: -1000px.
After several hours searching, I found a solution at Trigger autocomplete without submitting a form.
Basically, it uses a hidden iframe in the same page, set the action of your form to the 'src' of the iframe, and add a hidden submit button inside the form, when user clicks your button which triggers AJAX requests, you should programmatically click the hidden button before sending the AJAX request. see example below:
In your form page:
<iframe id="hidden_iframe" name="hidden_iframe" class="hidden" src="/content/blank"></iframe>
<form target="hidden_iframe" method="post" action="/content/blank" class="form-horizontal">
<input type="text" name="name">
<input type="text" name="age">
....
<button id="submit_button" type="submit" class="hidden"></button>
<button id="go_button" type="submit" class="hidden">Go</button>
</form>
Then java script:
$('#go_button').click(function(event){
//submit the form to the hidden iframe
$('#submit_button').click();
//do your business here
$.ajax(function(){
//whatever you want here
}})
);
Hope this helps.
I have the following code submitting a form
<div class="free-download">
<input name="method_free"
value="<TMPL_VAR lang_free_download>"
type="image"
src="images/free-download.png"
alt="<TMPL_VAR lang_free_download>" />
</div>
it's working fine in firefox, but in internet explorer it just loads the same page for some reason, any ideas?
Thanks
Try the form attribute in the input tag.
<input type="image" form="(ID of the form it belongs to)">
Sometimes inputs can get lost in layouts.
Have you checked to see if you are getting method_free_x and method_free_y posted back to you? Seems when using an image to submit, you get the X and Y coordinates that were clicked.
This seems simple enough but there are complications...
I have a facebook FBML static page where I want users to sign up to my magento newsletter.
I think I'm right in saying typically you can put the form code as below into the fbml page and on submit it will add the user to the newsletter;
<form action="http://my-site.com/newsletter/subscriber/new/" method="post" id="newsletter-validate-detail">
<fieldset class="block-content">
<legend>Newsletter</legend>
<label id="newsletter-label" for="newsletter" class="left">Join our mailing list</label>
<div class="input-box left">
<input name="email" type="text" id="newsletter" class="input-text required-entry validate-email" />
</div>
<button id="newsletter-submit" type="submit" class="button btn-submit"><span>Join</span></button>
</fieldset>
</form>
But of course at my site I have an ajax function that returns a thanks for registering, so when this submit is sent from fb, this just lands me at a confirmation message on my domain that is supposed to feed through java and say thanks very much for signing up.
So what I need is some way of posting the action, but keeping the user on facebook, or at least leaving them at some other landing page after the action.
Something that posts but doesn't redirect, or something that posts then redirects to something other than the url in the form action?
Not sure if I need ajax for this or if js is even allowed within the fb environment, could I use any of their proprietary FBML to achieve this?
Many thanks
Could you add onSubmit="handleData(); return false;" to your form so it doesn't submit? and use the handleData() function to proccess the data in whatever way you need? This will keep the user from moving off the current page.