I wrote the following jquery code to allow only numbers in a textbox.
$("[id$='txtPriority']").keydown(function (event) {
if (event.keyCode == 48) {
var value = $("[id$='txtPriority']").val();
if (value == "") {
event.preventDefault();
return;
}
}
else if (event.keyCode == 86 || event.keyCode == 118) {
event.preventDefault();
return;
}
else {
$("[id$='txtPriority']").numeric();
}
});
});
This works fine ,when the page is loaded for first time.But after post back the code is not working.What might be the reason.
I you are changing something with ajax then the event will not work.
Try using the live function ( http://api.jquery.com/live/ )
$("[id$='txtPriority']").live('keydown', function (event) {
I had this problem once and it was because I was replacing the html for the form in the postback. You need to reset your event handlers after replacing the controls or use the .live() handler which will work even for elements you add later:
$("[id$='txtPriority']").live('keydown', function (event ) {
Related
I have the following piece of code in an asp mvc page
$('#regForm').submit(function (event) {
if (event.keyCode == '13') {
event.preventDefault();
}
});
The aim is to prevent the form from submitting when enter is pressed.
We have noticed that in ie 11, this is not working, and on stepping into the code via debug, event.keycode is null. I have been doing some researching on this, and it seems to be an issue because we have the IE-8 Compatibility Meta Tag present on the page, which means that event.keyCode (and event.which) returns undefined for the event, and so my form is always submitted.
So how do I rewrite this to get round the issue?
You need to use the keypress event, not form submit
$('#regForm').keypress(function (event) {
if (event.keyCode == 13) {
event.preventDefault();
}
});
Try something like this, use window.event:
$('#regForm').submit(function (e) {
var keyCode = (window.event) ? e.which : e.keyCode;
if (keyCode == '13') {
e.preventDefault();
}
});
Use type="button" attribute with <button> element
So that IE thinks the button as a simple button instead of a submit button.
So form will not submit
You can also get more details from below url
http://tjvantoll.com/2013/01/01/enter-should-submit-forms-stop-messing-with-that/
$('#regForm').keypress((event) => {
if (event.key === "Enter") {
event.preventDefault();
}
});
I have created an ajax dropdown, i need to change the background color of the dropdown values when i press the down arrow and up arrow key.Here when i press the key background changes and it disappears immediately.it's not working in the ajax dropdown, if i put and alert before setting the class selectedhash, it's working else it's not working.
Here the div will be updated by the ajax results with list.
Please help me to solve this.
<div class='textautocomplete'>
</div>
$(document).on("keydown", function(e) {
if (e.keyCode == 40)
{
if(chosen === "")
{
chosen = 0;
} else if((chosen+1) < $('.textautocomplete ul').length)
{
chosen++;
}
$('.textautocomplete ul').removeClass('selectedhash');
$('.textautocomplete ul:eq('+chosen+')').addClass('selectedhash');
return false;
}
if (e.keyCode == 38) {
if(chosen === "") {
chosen = 0;
} else if(chosen > 0) {
chosen--;
}
$('.textautocomplete ul').removeClass('selectedhash');
$('.textautocomplete ul:eq('+chosen+')').addClass('selectedhash');
return false;
}
});
$(".textinput").live("keyup",function(e)
{
$.post('/users/getusers',{data:dataString},function(result){
if(result!=='')
{
$('.textautocomplete').show();
$('.textautocomplete').html(result);
}
else
{
$('.textautocomplete').hide();
$('.textautocomplete').html('');
}
});
return false
});
Firstly change: ".live" to: ".on" in line:
$(".textinput").live("keyup",function(e)
because:
"As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live()."
More: jQuery .live() method
Secondly add keyCode filter code in:
$(".textinput")
For example:
if ( e . keyCode == 38 || e . keyCode == 40 ) { return false; }
Working example fiddle: JSFiddle
Basically sometimes I need to show a form that is pre-populated with a record. Depending on the users privileges, he may or may not be able to edit the data.
The problem I'm encountering is that sometimes a user will try to edit a textbox that's been disabled by clicking on it and hitting the "backspace" button to edit the text. This causes the browser to go back one page... Annoying.
If it's asp .net you can simply do it like this:
<script language=javascript>
function cancelBack()
{
if ((event.keyCode == 8 ||
(event.keyCode == 37 && event.altKey) ||
(event.keyCode == 39 && event.altKey))
&&
(event.srcElement.form == null || event.srcElement.isTextEdit == false)
)
{
event.cancelBubble = true;
event.returnValue = false;
}
}
</script>
<body onkeydown=cancelBack()>
You need to catch the keyboard event in javascript and stop it from executing. What server-side code you are using (ASP.NET) doesn't make a difference.
window.onkeydown = function(event) {
if(event.keyCode == 8)
return false;
}
Just tested in Chrome and it seems to work
Place this under in the document ready function if you have one
window.onkeydown = function (event)
{
if (event.keyCode == 8) {
return false;
}
}
I have a input on page in some div:
<input style='border:1px solid black;' type='text' id='inputFindBy_Name' />
and o jquery javascript function monitored it:
$("div[id=mainGridPage] input").bind("keyup", function (event) {
if (event.keyCode == 13) {
var searchField = "Name";
var searchValue = $(this)[0].value;
var pageIndex = "1";
var sortField = "Name";
Application.Services.ProductTypeService.LoadMainGridProductType(pageIndex, sort, sortField, searchField, searchValue, ResultLoadMainGridProductType, ErrorLoadMainGridProductType);
}
});
when user typed something and pressed ENTER (event.keyCode == 13) I need do some thing but without reloading the page. How do that?
Try this one
$("div[id=mainGridPage] input").bind("keyup", function (event) {
if (event.keyCode == 13) {
// needed do something here without reloading the page
return false;
}
});
just like a link.
Just return false from within the function:
var code = event.keyCode || event.which;
if (code == 13) {
// do what you have to do.....
return false;
}
Edit: the keyup event is triggered "too late" after the form submission event was already dispatched - you can't cancel or stop it in that stage. So, handle the keypress event instead. Change the line to:
$("div[id=mainGridPage] input").bind("keypress", function (event) {
And the return false; will indeed stop the form from submitting.
Live test case.
You need to do a event.stopPropagation() and maybe the return false;. Please use event.which because event.keyCode is not compatible with all browsers, also you are using div[id=mainGridPage] input which searches for an ID, a better way to put this down is: div#mainGridPage input, and probably faster.
$("div#mainGridPage input").bind("keyup", function (event) {
if (event.which == 13) {
event.stopPropagation();
// needed do something here without reloading the page
return false.
}
});
try this. this will work i think:
$("div[id=mainGridPage] input").keypress(function(event) {
if (event.keyCode == 13) {
// do your code
console.log('hello');
return false;
}
});
I'm trying to trigger something to happen either when I press the escape key or when I click on an element. I've tried using..
if( $( '#some_id' ).click() || e.keyCode == 27 )
{
alert( 'Click or esc' );
}
But that doesn't seem to be working, is there something else I can use? If I do each individually like..
$( '#some_id' ).click(...);
or..
if( e.keyCode == 27 )
it works without a problem, but I'd prefer to have it working together to avoid code duplication. Sorry if it's something stupid I missed but would really like to get this sorted.
Thanks :)
Use .bind() .on() (as of jQuery 1.7) passing in multiple events:
$("#some_id").on("click keyup", function (e) {
if (e.type == "click" || e.keyCode == 27) {
alert("click or esc");
}
});
You mentioned code duplication. Why not do them separately, but put the code you want to execute for both of them into a function:
$('#some_id').click(function () {
doStuff();
});
$('#some_id').keypress(function (e) {
if (e.keyCode == 27) doStuff();
});
function doStuff() {
alert('Click or esc');
}