I want to trigger a call to a function ,when any change is done in the text box to validate the input .
I don't want to add an inline call , rather want to add the code in the script block .
$(document).ready(function () {
$("#LocationName").change(validateLocationName);
});
function validateLocationName()
{
var formAddress = contractAddress.getData();
formAddress.LocationName = $("#LocationName").val();
if ( validate condition) {
--- add error or etc
return false;
}
return true;
}
attached the code i am trying to use , but the function does not get called . Any help will be appreciated
Your code, if stripped down to just call the function, works like below. Just make sure you have included the necessary jQuery script and also that you are not getting any other error. e.g if getData() is actually working and if statement has valid check like if (formAddress.LocationName == $("#LocationName").val())
<textarea id="LocationName"></textarea>
<script>
$(document).ready(function () {
$("#LocationName").change(validateLocationName);
});
function validateLocationName() {
alert($("#LocationName").val());
}
</script>
Related
I have a form on my site and would like an icon to be displayed in addition to the validation message.
I can get it to display, but am having trouble getting it to display at the right moment.
I am using jQuery Validation and have set the function "onfocusout".
The problem now is that it does not execute the default code.
Is there a function how I can call this?
My jQuery / JS:
$("#form").validate({
onfocusout: function (element) {
// I want to call the Default behavior here!
if ($(!element.valid())) {
errorIcon.removeAttribute("hidden")
}
else {
errorIcon.setAttribute("hidden", "true")
}
}
}
});
Do not mind the logic in the Code.
Thanks for helping
This is my Piece of script with form id="details"
<script type="text/javascript">
function onLoad() {
$("#password").keyup(passCheck);
$("#repeatpass").keyup(passCheck);
}
function passCheck() {
var password = $("#password").val();
var repeatpass = $("#repeatpass").val();
if (password == repeatpass) {
$("#matchpass").text("Passwords match");
$("#matchpass").addClass("valid");
$("#matchpass").removeClass("error");
$("#details").submit(true);
} else {
$("#matchpass").text("Passwords donot match");
$("#matchpass").addClass("error");
$("#matchpass").removeClass("valid");
$("#details").submit(false);
}
}
$(document).ready(onLoad);
</script>
I want to know why my form(id="details") is not being submitted and if someone can explain how this structure works, it will be more helpful for me. thanks
Working fiddle.
Use $("#details").submit() instead of $("#details").submit(true); and remove $("#details").submit(false);.
Hope this helps.
You should not pass parameter in your submit function remove your $("#details").submit(true); and $("#details").submit(false); its not there in jquery API write this fragment of code it will be of better use:
$( "form" ).submit(function(event) {
if ( $( "span" ).hasClass('error')) {
alert('prevented');
event.preventDefault();
}
return;
});
Fiddle Link
For starters you do not need to have a .submit call in the else block.
This code works in three steps:
(1) The .ready command tells jQuery that when the page is ready it should execute the function named onLoad.
(2) The onLoad function tells that when a key from the keyboard is pressed then the passCheck function should be called.
(3) The passCheck function checks to see if the two texts are equal and if so submits the form, otherwise it does not submit (i.e. The .submit should not be called at all).
Probably the two passwords are both empty initially so they are equal and the .submit is attempted but an error on that prevents the function a ms the script stops working. After that the script stops working completely.
Both notes on the request for the HTML code and the note on the argument given to the .submit, mentioned above are correct.
I have a JQuery (v1.8) which handles the code after clicking a hyperlink. I would like to call that click or do anything else (as the clicking of the link would) to enforce the JQuery to run from the code behind. Any ideas?
JQuery code:
<script type="text/javascript">
jQuery(document).ready(function (){
jQuery('#lnkShowModule').toggle(
function (){
jQuery(this).html('Hide the Module');
jQuery('.hide-element').toggle();
},
function (){
jQuery(this).html('Show the Hidden Module');
jQuery('.hide-element').toggle();
}
);
});
and this is my link in the ascx control:
<a id="lnkShowModule" href="#"> show the hidden module</a>
any ideas?
add the javascript code inside a function and you can add the following code whereever you want to call the javascript function
Page.ClientScript.RegisterStartupScript(Page.GetType(), "ShowHide", "ShowHideDiv();", true);
#UPDATE 1
function ShowHideDiv(){
$(document).ready(function (){
$('#lnkShowModule').toggle(
function (){
$(this).html('Hide the Module');
$('.hide-element').toggle();
},
function (){
$(this).html('Show the Hidden Module');
$('.hide-element').toggle();
}
);
});
}
also you have to change the " a "
<a id="lnkShowModule" href="#" onclick="ShowHideDiv();"> show the hidden module</a>
If you're already posting back (as you noted in your question that you're wanting to do this from the code-behind), then you can simply set the visibility of the object in question from the code-behind as well.
If your intention is to hide a div, you can turn it into an asp:Panel (MyPanel) (which outputs a div). Then you can simply call:
MyPanel.Visible = False; ' or True
to set the visibility. No javascript/jquery required.
I'm very frustrated right now... and making lots of mistakes. Sorry about that
I've been trying to unhide a specific div based on search results
If no search was made the div should not appear, and this is easy with css, but once the search is done I have to change the style to 'block'.
Since I'm using the google custom search javascript its too hard to replace the button for another similar button that triggers my javascript function.
I also couldn't figure out how to replace the "resultDiv" into some more complex path
I already done this javascript function to hide a div based on the result div...
css div style is at #main.section .widget.HTML
function check()
{
if (document.getElementById('resultDiv')) {
if ($('.gsc-expansionArea').is(":empty")) {
document.getElementById('resultDiv').style.display = 'none';
}
else {
document.getElementById('resultDiv').style.display = 'block';
}
}
}
I think there might be 2 possible solutions. First is to load the script
<body onLoad="check();">
but doesn't seems to work.
Second would be check URL for ?q= meaning a search was done, but I don't know how to get these parameters from URL.
Please assist me. Thank you
well, since you've tagged jquery:
$(window).load(function(){
check();
})
and your function check() could be more like
function check() {
if ($('#resultDiv').length) {
if ($('.gsc-expansionArea').is(":empty")) {
$('#resultDiv').css({'display': 'none'})
}
else {
$('#resultDiv').css({'display': 'block'})
}
}
}
--
Second would be check URL for ?q= meaning a search was done, but I
don't know how to get these parameters from URL.
use location.search
Location search Property
MDN window.location
Replace
<body onLoad="javascript:check();">
with
<body onLoad="check();">
You can use
$(document).ready(function()
{
check();
}
to load the function when the page loads. You can also simplify your function with jQuery:
function check()
{
var isEmpty= $('.gsc-expansionArea').is(":empty");
$('#resultDiv').toggle(isEmpty);
}
The documentation for toggle is here.
Let us say i have a page http://www.abc.com/xyz.html and i am going to access this page in two ways
simple as it is
I will append some stuff to the url e.g. http://www.abc.com/xyz.html?nohome by just putting the value ?nohome manually in the code.
Now i will add some javascript code something like this
$(document).ready(function () {
if (location.search=="?value=nohome") {
// wanna hide a button in this current page
}
else {
// just show the original page.
}
});
Any help will be appreciated.
As you are using jQuery to catch the DOM-ready event, I guess a jQuery solution to your problem would be fine, even though the question isn't tagged jQuery:
You can use .hide() to hide and element:
$(document).ready(function () {
if (location.search=="?value=nohome")
{
$("#idOfElementToHide").hide();
}
// Got rid of the else statement, since you didn't want to do anything on else
});