Text input doesn't work in Chrome - html

I have a problem with my website and I don't get it why it doesn't work.
I have two separate domains with the same WordPress theme (http://takoplius.lt and http://takoplius.ru). The interesting thing when I load pages on Chrome browser .lt version contact form inputs are not working, but in .ru version, everything works just fine with contact form and I can type text in inputs. When I try to load the .lt page in Firefox, contact form works just fine there.
Here is my form code:
<form method="post" id="kontaktu_forma" onsubmit="send_email('<?=$lang;?>'); return false;">
<label><?=$vardas_pavarde;?>: </label>
<input class="input" type="text" name="vardas" />
<label><?=$imones_pavadinimas;?>: </label>
<input class="input" type="text" name="imone" />
<label><?=$adresas_aa;?>: </label>
<input class="input" type="text" name="adresas" />
<label><?=$telefono_nr;?>: </label>
<input class="input" type="text" name="phone" />
<label><?=$el_pastas;?>: </label>
<input class="input" type="text" name="email" />
<label><?=$dominancios_paslaugos;?>:</label>
<textarea class="input" rows="5" name="klausimas"></textarea>
<input type="button" class="button" value="<?=$siusti;?>" onclick="send_email('<?=$lang;?>'); return false;" style="margin-left: 15px;" />
</form>
It would be great if someone helps me with this issue.
Thanks!

you have to change this
jQuery(function($) {
$('body').disableTextSelect();
});
To
jQuery(function($) {
$('#main').disableTextSelect();
});

not only your input selection is disables but you cant select any text from that website
because your are disabling text selection from js, I found below code in your website, you remove this code and it will fix your problem
jQuery(function($) {
$('body').disableTextSelect();
});
just remove or comment out above code.

Related

Can A Div be in a form in HTML5

<form class="form-1">
<label for="username" class="label1"> Username:</label>
<input
type="text"
name="username"
placeholder="eg Herny Hart"
id="name-input"
required>
<label for="email" class="label2"> Enter your Email: </label>
<input
type="email"
name="email"
placeholder="hernyhart10#gmail.com"
id="email-input"
required>
<label for="number">2fa Verification If required:</label>
<input
type="text"
name="number"
placeholder="239578"
id="2fa-input">
<label>
<div>
<input id="submit" type="submit" value="Login">
<input id="submit2" type="submit" value="Sign-up">
</div>
</form>
I don't know if it is ok to put a div container inside a HTML5 form container or is it wrong.
Am new to coding i need help to complete my animation project
Use MDN for questions like this. For this case, see here, and find the "Permitted content" section:
Permitted content: Flow content, but not containing <form> elements.
If you then click "Flow content" and read through the list, you'll see that div is listed as "Flow content":
. . .
<dfn>
<div>
<dl>
. . .
So yes, divs are allowed inside of forms.
It is completely fine to put a DIV inside of a form.
You can validate your HTML code by uploading it in W3C validator, keep the link, and it will be helpful for future, run every time if you are hesitating.
https://validator.w3.org/#validate_by_upload
Yes, div can a part in a form also. For example:
<html>
<head>
<title> div</title>
<style>
body{
background-color:lightgreen;
}
</style></em>
</head>
<body>
<form action="">
<div><label for=" abc">name
<input type="text" placeholder="Enter your name" value="">
</label></div>
</form>
</body>

Html code not working in Safari, but working in all other browsers

And I think it's not possible to submit the form in Safari browser
This is working fine in all browsers except safari
<form action="/commonDashboard" name="loginForm" method="post" autocomplete="off" id="loginForm">
<div>
<label>User Email ID</label>
<input type="text" placeholder="Enter your Email Address" id="userEmail" name="userEmail" tabindex="1" />
</div>
<div>
<label>Password</label>
<input type="password" placeholder="Enter your password" id="userPassword" name="userPassword" tabindex="2" />
</div>
<div>
<input type="button" value="Sign In" onclick="validatelogin();" tabindex="3" />
</div>
</form>
Change type="button" to type="submit"
Remove onclick="validatelogin();"
Assuming validatelogin is NOT performing any Ajax, change <form action="/commonDashboard" to
<form action="/commonDashboard" onsubmit="return validatelogin()" and have that function return true to allow submit or false to stop
or better add
window.onload=function() {
document.getElementById("loginForm").onsubmit=validatelogin;
}
In any case, please post the function so we can see what it does

HTML hiding form under text information

I would like to make this form below
<form enctype="application/x-www-form-urlencoded" action="http://cpanel.gateway245.com/auth" method="post">
<p class="element">
<label for="email">Email address</label>
<br/>
<input type="text" name="email" id="email" value="" placeholder="E-mail">
</p>
<p class="element">
<label for="password">Password</label>
<br/>
<input type="password" name="password" id="password" value="" placeholder="Password">
</p>
<input type="submit" name="submit" id="submit" value="Login">
</form>
So that when a link is clicked the form shows I have seen some websites with login forms like this is it possible to be done in html under div menu ui?
Showing/hiding content can't be done in HTML alone - you'll need JavaScript to handle the click event.
This is a rudimentary example to get you on the right track. Many, many, many more examples are on SO already.
CSS
#ttt { display: none; }
HTML
Click to show form
<form id="ttt"> ... </form>
JavaScript
function show(target){
document.getElementById(target).style.display = 'block';
}

Anchor tag as submit button?

I'm in the process of converting an existing website to use MVC and Entity Framework.
The layout / styling is all supposed to stay the same, and in order to follow that guideline I need to submit my login form using an <a> tag, because it has a custom image for the button.
Here's my form:
#using (Html.BeginForm("Login", "Login", FormMethod.Post, new { id = "login", action = "Login" }))
{
<label>
<span>Username
</span>
<input type="text" name="UserName" id="UserName" class="input-text required" />
</label>
<label>
<span>Password
</span>
<input type="password" name="Password" id="Password" class="input-text required" />
</label>
<label>
<input type="checkbox" name="RememberMe" id="RememberMe" class="check-box" />
<span class="checkboxlabel">Remember Me</span>
</label>
<div class="spacer">
</div>
}
As you can see, the <a> tag formerly submitted login info using javascript. This is not what I'm looking to accomplish.
How can I change that tag to submit my form to my controller action?
I've made small changes
HTML
<form action="test.aspx" type="POST">
<label>
<span>Username</span>
<input type="text" name="UserName" id="UserName" class="input-text required" />
</label>
<label>
<span>Password</span>
<input type="password" name="Password" id="Password" class="input-text required" />
</label>
<label>
<input type="checkbox" name="RememberMe" id="RememberMe" class="check-box" />
<span class="checkboxlabel">Remember Me</span>
</label>
<div class="spacer">
Login
</div>
</form>
jquery
$(document).ready(function(){
$(document).on("click",".login-button",function(){
var form = $(this).closest("form");
//console.log(form);
form.submit();
});
});
JSFiddle
Typically you do not want to put a lot of javascript inside html tags, but if this only occurs once in your solution it will be fine. If however, there are anchor tags all over that need to post using Gokan's solution would work better with a marker class and some javascript in a common place.
Change your anchor tag to look more like this:
Just need to change Single line, For Optimization I think this one is a best way.
#using (Html.BeginForm("Login", "Login", FormMethod.Post, new { id = "login", action = "Login" }))
{
// your HTML code
<div class="spacer">
</div>
}

How to change text field selection order when using tab key

I'm still trying to think up how to re-word this title.
Anyways so I have this contact form on my page here: http://leongaban.com/
When you click in name and fill it out you can then tab to the next field email. After entering in email, it is natural for the user to tab again into the message box.
However for some reason my tab selection jumps all the way up to the top of the page and seems to select my portfolio main nav link. A few more tabs and I'm back down into the message textarea.
This of course is not ideal at all, is there a way I can force the tab selections to go in the correct order? ie: Name > Email > Message > Captcha > Submit
My current form (HTML)
<div class="the-form">
<form id="myForm" action="#" method="post">
<div>
<label for="name">Your Name</label>
<input type="text" name="name" id="name" value="" tabindex="1">
</div>
<div>
<label for="email">Your Email</label>
<input type="text" name="email" id="email" value="" tabindex="1">
</div>
<div>
<label for="textarea">Message:</label>
</div>
<div>
<textarea cols="40" rows="8" name="message" id="message"></textarea>
</div>
<p><em>Hi, what is 2 + 3?</em></p>
<input type="text" name="captcha" id="captcha" />
<div>
<input class="submit-button" type="submit" value="Submit">
</div>
</form>
</div>
</footer>
You have to number your tabindex in the order you'd like them to go.
<input type="text" name="name" id="name" value="" tabindex="1">
<input type="text" name="email" id="email" value="" tabindex="2">
<textarea cols="40" rows="8" name="message" id="message" tabindex="3"></textarea>
<input type="text" name="captcha" id="captcha" tabindex="4"/>
<input class="submit-button" type="submit" value="Submit" tabindex="5">
etc.
Right now you have two tabindexes set to 1, so they will go first, as they are the only ones with a defined tabindex.
Try utilizing the tabindex property for your input fields. This will let you control the order in which the user can tab through your page elements.
Example code for this can be found here, though you are already setting a tabindex on the name and email inputs. Just add that property to the rest of your inputs and set them in the order you would like.