I have my website in which I have email pdf functionality
Procedure is :
when user enters email and then he has to click on submit button
after clicking submit button , form will not submit and form will hide and
there is another hidden div contains thank you message which appears with Ok button.
When User Click on OK button then form will submit.
But Now the Problem is :
When User enter email and if he press ENTER accidentally then form gets submitted without showing thank you message.
I want to Disable ENTER when user Press Enter key.
Check which key was pressed ant if was the enter key return false. Using jQuery this is easy.
var field = $('.classname');
field.keydown(function(e){
if(e.which==13){
return false;
}
});
you can try this to disable the submit on keypress
$(function() {
$("form").on("keypress", function(e) {
if (e.keyCode == 13) return false;
});
});
Use this code, will surely work for you:
var class = $('.classname');
function stopRKey(evt) {
var evt = (evt) ? evt : ((event) ? event : null);
var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
if ((evt.keyCode == 13) && (node.type=="text")) {return false;}
}
class.onkeypress = stopRKey;
Use a regular html button instead of a submit button. In the onclick event of the button write some Javascript to show/hide the DIV. The button on the Thank You DIV make that a submit button.
Place this in the script:
<script language="JavaScript">
function TriggeredKey(e)
{
var keycode;
if (window.event) keycode = window.event.keyCode;
if (window.event.keyCode == 13 ) return false;
}
</script>
Related
I have a form with number of submit type as images. Each image has a different title. I need to find out the title of the clicked image. But my click function inside form submit is not working.
My form is:
<form action='log.php' id='logForm' method='post' >
<?
for($j=1;$j<=5;$j++)
{
?>
<input type="image" src="<?=$img;?>" title="<?=$url;?> id="<?="image".$j?> class="images" />
<?
}
?>
</form>
Jquery:
$("#logForm").submit(function(e)
{
$(".advt_image").click(function(event) {
var href=event.target.title;
});
var Form = { };
Form['inputFree'] = $("#inputFree").val();
// if($("#freeTOS").is(":checked"))
Form['freeTOS'] = '1';
$(".active").hide().removeClass('active');
$("#paneLoading").show().addClass('active');
var url="http://"+href;
$.post('processFree.php', Form, function(data)
{
if(data == "Success")
{
$("#FreeErrors").html('').hide();
swapToPane('paneSuccess');
setTimeout( function() { location=url }, 2500 );
return;
}
swapToPane('paneFree');
$("#FreeErrors").html(data).show();
});
return false;
});
How can I get the title value of clicked image inside this $("#logForm").submit(function())?
How can I use the id of clicked image for that?
You can use event.target property
$("#logForm").submit(function(e)
alert($(e.target).attr('title'));
});
http://api.jquery.com/event.target/
[UPDATE]
I just realized it wouldn't work. I don't think there is a simple solution to this. You have to track the click event on the input and use it later.
jQuery submit, how can I know what submit button was pressed?
$(document).ready(function() {
var target = null;
$('#form :input[type="image"]').click(function() {
target = this;
alert(target);
});
$('#form').submit(function() {
alert($(target).attr('title'));
});
});
[Update 2] - .focus is not working, but .click is working
http://jsfiddle.net/gjSJh/1/
The way i see it, you have multiple submit buttons. Instead of calling the function on submit, call it on the click of these buttons so you can easily access the one the user chose:
$('input.images').click(function(e) {
e.preventDefault(); //stop the default submit from occuring
alert($(this).attr('title');
//do your other functions here.
});
// Runtime click event for all elements
$(document).on('vclick', '.control', function (e) { // .control is classname of the elements
var control = e.target;
alert(e.currentTarget[0].id);
});
if you are not getting proper message in alert, just debug using Firebug.
Check following code you can get the title of clicked image.
Single click
$(document).ready(function()
{
$('#logForm').submit(function(e){
$(".images").click(function(event) {
alert(event.target.title);
});
return false;
});
});
Double click
$(document).ready(function()
{
$('#logForm').submit(function(e){
$(".images").dblclick(function(event) {
alert(event.target.title);
});
return false;
});
});
add following ondomready in your rendering page
$(document).ready(function(){
$("form input[type=image]").click(function() {
$("input[type=image]", $(this).parents("form")).removeAttr("clicked");
$(this).attr("clicked", "true");
});
});
Now in your form's submitt action add follwing behaviour and yupeee!... you got it!....
$("#logForm").submit(function(e)
{
var title = $("input[type=image][clicked=true]",e.target).attr("title");
.....
.....
});
i want to delete php session variable using a key press. so i used these codes,
<script type="text/javascript">
function textsizer(e){
var evtobj=window.event? event : e
var unicode=evtobj.charCode? evtobj.charCode : evtobj.keyCode
var actualkey=String.fromCharCode(unicode)
if(actualkey=="x"){
location.href="biling.php?cmd="+actualkey;}
}
document.onkeypress=textsizer
</script>
<?php if(isset($_GET['cmd'])){
unset($_SESSION["bill_array"]);
header('location:biling.php');
}
?> }
but the problem is, this code also clearing the session when i'm typing "x" in a text box. so i just want to stop that and clear the session only when i press "x" out side of a text box
I think you can edit your existing function as such:
function textsizer(e) {
var evtobj=window.event? event : e;
var element = evtobj.target ? evtobj.target : evtobj.srcElement;
if (element.tagName.toLowerCase() == "body") {
var unicode=evtobj.charCode? evtobj.charCode : evtobj.keyCode;
var actualkey=String.fromCharCode(unicode)
if(actualkey=="x"){
location.href="biling.php?cmd="+actualkey;
}
}
}
You can check the e.target property to identify which element trigger the keypress event.
//Does not work on IE
window.addEventListener('keypress', function(e){ console.log(e.target) }, false)
Taking action when e.target.tagName == 'BODY' is a good choice.
Update
For more info about Event, check:
Firefox & Webkit, https://developer.mozilla.org/en/DOM/event
IE, http://msdn.microsoft.com/en-us/library/ie/ms535863(v=vs.85).aspx
$("input[type='text']").keypress(function(){
});
i have this openid plugin but when i click on aol the dialog opens and within no time it automatically gets closed and the form is submitted. i want that it shud stop at time when dialog opens and form shud be submitted only when i close the dialog box
please help me out
(function($){
$.fn.openid = function() {
$('input').click(function(e){
var provider = $(this).attr('class');
if (provider == 'aol') {
$("#dialog").dialog();
}
else{
var provider_url = $(this).attr('id'); //get id
var myinput = $('<input type="hidden" name="provider_url"/>').val(provider_url);
}
$('form').append(myinput);
$('form').submit();
})
}
})(jQuery);
Add e.stopPropogation(); to the first line of the click event handler to prevent the normal form submission from occurring.
I have a ajax method of calling data from php file, i learned it from one of a blog, now it works file for submit button click function, but when i press enter the variables get shown in address bar and ajax process is not executed, Can any one please help me doing it on a press enter method....
This is my code:-
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
$(document).ready(function() {
$("input[name='search_user_submit']").click(function() {
var cv = $('#newInput').val();
var cvtwo = $('input[name="search_option"]:checked').val();
var data = { "cv" : cv, "cvtwo" : cvtwo }; // sending two variables
$("#SearchResult").html('<img src="../../involve/images/elements/loading.gif"/>').show();
var url = "../elements/search-user.php";
$.post(url, data, function(data) {
$("#SearchResult").html(data).show();
});
});
});
});//]]>
</script>
I have tried it by taking an if condition along with keypress event still its not working:-
if (e.keyCode == 13) { // Do stuff }
else { // My above code }
//In this also it seems that i am doing something wrong.
Can anybody please enlighten me oh how to do it.
My input field is:-
<input type="text" name="searchuser_text" id="newInput" maxlength="255" class="inputbox MarginTop10">
My submit button is:-
<input class="Button" name="search_user_submit" type="button" value="Search">
You can try with event.preventDefault(); for enter keypress.
Thanks.
When you type enter there is executed default onSubmit handler for a form. You can use submit jquery function to handle both enter and click on submit button.
$("form").submit(function() {
var cv = $('#newInput').val();
var cvtwo = $('input[name="search_option"]:checked').val();
var data = { "cv" : cv, "cvtwo" : cvtwo }; // sending two variables
$("#SearchResult").html('<img src="../../involve/images/elements/loading.gif"/>').show();
var url = "../elements/search-user.php";
$.post(url, data, function(data) {
$("#SearchResult").html(data).show();
});
return false;
});
return false in this function will prevent submit of the form.
i've been trying to get a confirm box to work, i am using php and jquery to make a confirm box appear when clicking on a delete link, actual code :
$(document).ready(function(){
if (jQuery("a.delete-link").length > 0) {
$("a.delete-link").bind("click", function(){
return confirm("Sunteti sigur ca doriti sa stergeti?");
});
}
});
and the link is called :
sterge
the link is used to submit a form when clicked, the code for that is :
$(document).ready(function(){
if ($(".formSubmit").length > 0) {
if ($(".formSubmit").parents("form").find("input:submit").length == 0) {
$(".formSubmit").parents("form").append('<div style="width:1px;height:1px;overflow:hidden;"><input style="width:0;height:0;overflow:hidden;" type="submit" /></div>');
}
$(".formSubmit").click(function(){
$(this).parents("form").trigger("submit");
return false;
});
}
});
i do get the confirm dialog, but any option i chose, the form submits and the delete action is called.. any idea what i'm doing wrong ?
Bind the confirmation to the onSubmit of the form. You'll save a lot of hassle that way and you will get a confirmation no matter how the form was submited.
$( document ).ready ( function () {
$( 'selector for your form' ).submit ( function () {
return confirm ( 'Are you sure ...?' );
} );
} );
You have two click events bound to the anchor tag. The first event shows the confirm and the second submits the form.
Trigger the form submission only if the user confirmed:
$(document).ready(function(){
if ($(".formSubmit").length > 0) {
if ($(".formSubmit").parents("form").find("input:submit").length == 0) {
$(".formSubmit").parents("form").append('<div style="width:1px;height:1px;overflow:hidden;"><input style="width:0;height:0;overflow:hidden;" type="submit" /></div>');
}
$(".formSubmit").click(function(){
if ($(this).hasClass('delete-link') && confirm("Sunteti sigur ca doriti sa stergeti?"))
{
$(this).parents("form").trigger("submit");
}
return false;
});
}
});
Can you use this:
<a href="#" onclick"return javascript:void(0);" ... />