I'm new to this kind of stuff so sorry if this is not possible or does not make any sense. Im making a app where someone puts in there username into the form and when they press enter a popup says words but then i want for after they press ok it puts the username into the form ---- instagram://user?username --- where it says username thats where i want the username from the form to go then it will go there. sorry if this doesnt make sense or is not possible wondering if it is
You want to set your form action to GET. I believe that is what you are trying to ask.
<form action='[url submitting to]' method='GET'></form>
Using jQuery, if this is the language you are working with, you could prevent the submit and get the username field and add it to url and load this page.
//html
<form>
<input id="username">
</form>
//javascript
//the submit event is captured
$('form').on('submit', function(e){
//the event is passed in on the function and is used to prevent the
//default action so we can perform some further action
e.preventDefault();
//here we grab the value of the the #username text field
var user = $('input#username').val();
//here we are loading the instagram page based upon the user's textfield
window.location = 'instagram://user?' + user;
});
Is this what you are looking for?
Related
I have an input tag within a form, when I press enter in the input box. The url will be appended with a question mark.
code:
<form>
<input id="xyz" type="text" value="">
</form>
This is very annoying, so I add some code to prevent the user from doing this behaviour. I change the body tag to:
<body onkeydown="(event.keyCode==13) ? 0 : 1">
Well, this works in another webpage, but not in this case.
What have I missed?
And is this a good solution to prevent user from pressing enter on the keyboard?
Please give some explanation in your answer, thanks.
p.s. I can't use jQuery.
UPDATE: I don't want the user to enter press on their keyboard to submit a form even I define the form action and method.
The default action when you press enter while in an input is to submit the form. Since you don't have any action defined for the form, it doesn't do anything. You also don't have a method defined so I believe it defaults to GET which uses parameters in the URL (like example.com?param1=abc¶m2=123).
If you change <form> to <form method="post">that should stop the question mark from appearing. Though it's still not valid HTML because you don't have an action or a name for your form.
May I ask why you don't want them submitting the form when they press enter?
I'm using a form that has 3 parts, login, forgot password and registration. The initial view is the login form, but can be changed to the forgot password or registration form, which replaces the initial view by using JS.
I'm looking to post back to the page if validation isn't met. This seems to be working fine, and the field repopulates itself. However I can't get the right form to load when posted back.
For example, if the user is filling out the forgot password form, and fills in an invalid email address, the message at the top of the form will be correct, however the form that will appear is the default login form. Once the user clicks on the forgot password button, JS kicks it over to the forgot password form, and has the users invalid email address re-populated. Each form has a unique "form_type" hidden variable to differentiate between the three, so I can use this to check then load the right one. Ideally I would like to keep this as 1 page and use JS to swap between the three if possible.
I don't know how to get it to load the right form once posted back. It's using the below code to change between the forms. How do I link to the right form when posting back.
<a href="javascript:;" id="forget-password">
<a href="javascript:;" id="register-btn">
I'm not good with JS at all, and I think this is the issue. The front end and JS is all created by a third party, it's "Metronic" theme. Let me know if I need to include any JS. If it makes a difference, although the logic should be the same, I'm using codeigniter too.
EDIT All the functionality to swap between the forms is there, I just need it to POST back to the right form. This is what I have so far, if you click on the forgot password and enter an email address that is longer than 5 characters, you'll see what I mean. I obviously didn't ask this very well...
Once the user submits, and the form is posted back with errors, I need right form to pop up, rather than the default for the page. The tags above are the links used to swap between the different forms.
May be you can try on posting back to view also bring one extra variable say 'show_form'
in that show_form have you form id and based on that do jquery hide/show method
like $('#' + show_form).show() and other 2 hide.
you can try this.
I'm not sure I understand exactly what you're asking.
Do you need to have 3 forms in the same page and swap between them with JS?
If so, give each of the forms a unique ID and have 2 forms with display: none. then all you have to do (assuming you do not want to use jQuery) is just to change the style.
HTML:
<form id="first_form" class="form-visible">
...
</form>
<form id="second_form" class="form-gone">
...
</form>
<form id="third_form" class="form-gone">
...
</form>
CSS:
.form-visible
{
display: inline;
}
.form-visible
{
display: none;
}
JS:
function swapForms(id)
{
Swap-between-forms
}
differentiate the form with some variable . for example after submission form you can post back errors in variable name like if the submitted form is forgot password means define the variable name is $forgot like that. in view file check if(isset($forgot)) then set it's style as display block .
How can we redirect to another page after checking password without clicking on any button? After entering password it should check and automatically redirect to next specified page.
Do I need to add any function in text-box input tag?
//This is my HTML code.
<div style="margin-top:27%;margin-left:40%;">
<b><i>Enter pin</i></b>
</div>
<input type="password" id="pwd" autofocus required>
//This is the javascript.
<script>
function login()
{
logged_in=false;
var pin=documemt.getElementById("pwd").value();
if(pin=="hotel")
{
logged_in=true;
window.open("screen3.html","_self");
}
else
alert("Please enter correct pin");
}
</script>
Maybe this isn't a fully technical answer, but it is worth to mention here.
NEVER store passwords in javascript manifestly. User can open this file and just read it. For Your question, there is an answer.
You must have a php file that can check the password (get from the post).
<?php if(isset($_POST['pass']) && $_POST['pass'] == 'hotel') echo "ok"; ?>
Then using for example Jquery and AJAX on every change in input send ajax request to this php file with posted password. Than compare downloaded file with "ok", and if OK, use javascript window.location.replace("new url");
This is one from milions of possible answers. But remember that You should set session and remember login person, and check it on every other site. In other case, someone can enter manually the same url, that You are redirecting, and password isn't needed.
Hope it helps
Jacek
PS. this php file should also be protected for multiple password comparison, in other case it is easy to break easy passwords with bruteforce, knowing the mechanism.
PS 2. Nevertheless, in my opinion, You are doing something wrong, and this approach should be rethinked... My proposed answer also is very, very, very general. Too general.
UPDATE
Maybe better answer is to make a standart php script for logging with server verification and submit button. Then, using Javascript, hide submit button, and on input change simulate clicking it. But in that case, if password is wrong, the page should remember what the user has entered... It isn't difficult to write in php:
$input_value = isset($_POST['password']) ? $_POST['password'] : '';
But I really vote for leaving the submit button as the mother nature learned us ;).
Thx for replies, best regards.
First off you need a way to connect your input element to a function, if you don't want to use a submit button you could use some sort of on-change/on-keyup handler to detect input.
Javascript bind keyup/down event
In this function I'd recommend a better way of validation, like Jacek said.
When you figured out how to do that, you might want to take a look at this question:
How can I make a redirect page in jQuery/JavaScript?
Use of onKeyUP Event of input text as below Example.
<input type="text" onKeyUP="login();" id="pwd">
<script>
function login()
{
logged_in=false;
var pin=documemt.getElementById("pwd").value();
if(pin=="hotel")
{
logged_in=true;
window.open("screen3.html","_self");
}
else
{
alert("Please enter correct pin");
}
}
</script>
Demo Of onkeyUp
.keyup()
I hope it will help you.
When document is loaded or ready you can do
$('#pwd').onkeypress = login();
to bind the login to the keypress handler of your pwd box.
When 'logged_in == true' You can do a 'window.location = "http://www.google.com"' to redirect to your target page.
I guess there should be some parameter (session id?) or similar to verify that the user not just used the url by hand.
After validating your login data, use Response.Redirect("YourPage.aspx", False). It will redirect you to the page you specified.
I have a form (HTML) with some inputs (checkbox) and I want to submit only inputs that user has clicked ou unclicked and ignore the others inputs.
I'm thinking in add a class (javascript) to the input when user change value. But I don't know if it is a good ideia.
Any Suggestions?
You can have the form that submits onClick() and calls a Javascript. When that happens you then search what values have been unchecked and then use the Javascript to submit it to the next page to handle the response.
However not sure what you are trying to achieve doing this...
Class approach is working.
When user click on input I add class "envia":
$("INPUT[type='checkbox']").click(function(){
$(this).addClass("envia");
});
On submit I send only data with the class I want:
$.post("/financeiro/funcional/contasapagar.php", $(".envia").serialize(), function(data){
//code here
});
Only data the user changed is send to server.
Do you know when you use in a form the password field, like this:
<input type="password" name="pass">
And you do a GET or POST submit to the same page who have the form and if the user hit back in the browser the password field gets blank. Well thats good, but i need to get blank another form field when the user hit back. Thats because i asking for a captcha and the text field who hold the information entered by the user ramain fill when he hit back, but the captcha image change, and if i dont blank the field the user (sometimes) dont get that he needs to re-enter the captcha.
Thanks!
Try randomizing input name on each refresh, like:
<input type="text" id="CaptchaTextBox" name="captcha[612361]" />
Browser will notice that input field is different and will clear the value
Edit:
I have better solution: as user typed captcha once, just let him go without typing it second time. Now you know that this user is fairly non-machine so why give him so much to do ;)
Javascript
window.onload(function()
{
document.getElementById("CaptchaTextBox").value = '';
});
html
<input type="text" id="CaptchaTextBox" name="Captcha" />
Javascript erases the value of the textbox when the page is loaded