I didn't found the same problem ine the groupes: I would like to show error msg already in the page Exemple:
<input type="text" name="myTextField">
<span>This textfield cannont be empty</span>
if error the span will become showed. and not show error with the js
See this code:
The above is a simplified version of my code, but it shows enough. The two DIVs are set to "display:none".
How do I invoke the validate plugin in such a way that it shows the appropriate DIV when validation fails on the relevant field?
I know the refresh() method is gone since version 1.2 but for somereason even if it's suposed to work without it I can't get it to work.Here's the scenario:I got a select box, depending on the selection I want certain elementto validate so I dynamically add validation class to those elementlike this.$("input#element").toggleClass("{validate:{required:true}}");But when I click submit the element doesn't get validated at all but Ican see the class has been added in firebug.
View 2 Replies View RelatedI have a script that works:
function element_exists(element_name) {
if(document.getElementsByName(element_name).length > 0) {
return true;
} else {
alert("Please make sure the Title field was properly completed.");
return false;
}}
The only problem is that I need it to return false only if one of the form radios ('useit') is checked to "no". I was trying something like this
function element_exists(element_name) {
var checkuse = document.getElementsById(useit).value;
if(checkuse=="no" || !checkuse) {
if(document.getElementsByName(element_name).length > 2) {
return true;
} else {
alert("Please make sure the Title field was properly completed.");
return false;
}
} else {
return true;
}}
If you are wondering why I have !checkuse, it is because the form is dynamically created and sometimes does not even include the element 'useit'. How can I do this. If radio 'useit' checked to "no" or doesn't exist, run the function.
I have several divisions with a hidden division within them, like this:
[Code]...
With that script, if I click on one of the parent divisions ALL of the hidden divisions are shown. That's not what I want. I tried several variations of the script using (this), but I just kept getting errors.
I want to provide an element over which a user can hover the cursor to display a small div directly below it, out of the flow of the document so that it appears above it. A kind of overlay with some text for a short bio in it, not unlike a JS tooltip but bigger.
I need to keep the div accessible, but hidden, so I know that I will have to position it absolutely off-page and override that with the JS. It's important that the div is not visible on screen if JS is blocked, as it would cover other content. If it can slide out or whatever instead of just appearing, that would be a big plus. I use jQuery, but I'm not totally familiar with it yet. Here's an example of the HTML:
HTML Code:
<div id="header"><p class="">About Me</p></div>
<div class="">
<h4>About Me</h4>
<p>Text for a brief bio</p>
</div>
So what JS do I need to write in order to get this to happen? Or is there by any chance a lightweight plugin that happens to do exactly this?
Consider the following:<div id="item-1">
<a href="#">The Link</a>
<div>The contents shown on hover only</div>
</div>
I'm positioning elements absolutely. I want the child DIV to show when I hover over the link. Here is how I'm accomplishing this:
$("#item-1 a").mouseover(function() {$("#item-1 div").fadeIn('fast');})
$("#item-1 a").mouseout(function() {$("#item-1 div").fadeOut('fast');})
This works wonderfully. But I would like to make this generic so that I need 2 lines of code, not 2 times however many items I have.
I know the show() or hide() methods, but what if I just wanted to show say half of an element and hide the other half? is this possible using jquery?
View 1 Replies View RelatedI'm building a website with JQuery. Now I need to check if an object is shown, with show()
My jqeury to hide all the elements at start:
[Code]...
show/hide future element in the DOM. I have something like this where it will be triggered by a modal dialog (e.g. a facebox)
<div id="parent" style="display:none">
<a href="#" id="link">click me</a>
<div>
I am hoping on click me I can show/hide the parent. I did
$("a#link").live('click", function() {
$(this).parent().hide();
};
But because parent wasn't available so it seems the hide event wasn't able to bind to the parent.
How would I start to go about this? I'd like an <h3> to display and slide in whenever the user scrolls to a certain position on the page. For example, once a certain content div is 50% displayed in the viewport, I'd like the animation to fire.
View 2 Replies View Relatedi've been breaking my brain about this issue for a bit now, so here is my question.
I have a SELECT with various OPTIONS
<select id="myselect" name="myselect">
<option value='$variable' >1 - variable ammount of this option</option>
<option value='$variable' id="showOption">2 - gets added once at the end of the SELECT</option>
[Code]....
I have a vertical navigation menu with the basics (a <ul> with four <li>) but I need one of these list elements to slide to the left and when it finishes show or slide down a nested <ul> with its own li that is now hidden with display: none. and when I click again the first list element I wish everything to close back. or alternatively to close with a timeout. so far I got to this:
$(document).ready(function(){
$("#gioca").click(function(){
$("#gioca").animate({ left: "+=400" }, 1200)
[code].....
I'd like to have an alert of some type, either standard alert or a hidden div, show up when a user selects an option in a select element.
For instance, if a select element has 5 options in it and the user chooses the first one, they would get an alert that says "You have chosen the first option". I'm confident this is something that can be done with a few lines of code, but I'm not sure where to begin.
Here's the logic - I'm just not sure how to write the syntax...
If ("#select option") changes and ("#select option:eq(0):selected"), fade in the div ("alert").
i know there is live() event to make newly added element to be able to run a function, but that only apply to some mouse event.i use this tipsy plugin to show tips everytime on an image. my image can be changed by uploading new image. but the new image wont have the tips showing created by the tipsy().$("#photo").tipsy();
View 6 Replies View Relatedif you use the .show() the element appears form its upper left edge ... can you spec from which edge it shoud appear?
View 4 Replies View RelatedI have a databound control that I'm trying to add a menu that will show up only when the user rolls over the area. I am trying to append the rollover menu to each data container. I am able to append the menu, but the problem is that I cannot select the menu after it has been created to add say a click function to it. Basically, I am trying to append a menu that only shows up when a user rolls over the container (such as a <div>) and I would like to add some function to the newly created element. The problem is that I cannot assign the rollover menu an ID because although I could select them at that point it will assign the function to all of the ID's which won't really do me any good.
View 1 Replies View RelatedI'm using the validation plugin [url]
I must be missing something, is there not an easy way to validate inline?
For example, I have a required text input that is given focus on page load, I would like for it to throw an error if the user moves to the next field w/o entering any data.
Right now, it only checks for errors on 'submit'.
im loading data via json dynamical from the server. Now i try to optimate the speed of my application and so i want to disable the validate of the fields during the data loading from the server.Is there a simple solution to this? like validate = false
View 2 Replies View RelatedI have a form (form1) to register with the fields: user, email, password being validated normally.
Have a second form (Form2) to the user update the data registered in form1, and the fields user, email, password is already populated with data from the database, the email field I use the remote validation, and as the field already has been completed and read always says that this email already exists, how do I create a rule or method so that when the field is already filled it not do so validating and validate if it is filled with a new email. Email2 have a hidden field in order to do a test type.
How can i validate x inputs with name array like init_date[] with this plugin [URL]
$('#form').validate({
rules: {
year:{required:true,number:true},
[code]...
I'm working under certain constraints wherein,at a certain point outside my direct control,validate is called with no arguments, but after that I want to set a custom validation function on a form field. I figure there's got to be a way to manipulate validate's internal data structure to add the function, but I don't have a clue as to how.
View 1 Replies View RelatedI have a section of a form containing elements that are not visible, currently just in a hidden div. Some of these elements have validation on them so when the form is submitted it fails on this validation.What I am after is a way to stop the validation firing for any hidden elements. I have tried setting them to 'display: none' and 'visibility: hidden' but this does not have any affect.
View 5 Replies View RelatedAlright, I got the basic idea (which is relatively easy):
function show_el(id)
{
var obj = document.getElementById(id);
obj.style.display = "block";
}
function hide_el(id)
{
var obj = document.getElementById(id);
obj.style.display = "none";
}
The problem is, you need 2 different links, one to show the element, one to hide it. What I want is one link that changes depending on whether or not the element is showing: If it's showing, the link will be "Hide Element", if it's not, it'll be "Show Element."
I've seen this done a lot, mainly in expanding/collapsing, which is basically what I'm doing. I imagine it's not all that hard, but I just can't seem to figure it out.
I have the numbers "1 2 3" set up on a page to change a image and text when you click on each number. It works fine but I am not able to figure out how i can get the numbers to stay a specific color to indicate that this is the image you are viewing, a kind of "you are here" state.
View 1 Replies View RelatedLooking for a simple way to have a hidden element made visible when the page scrolls.
The idea is to have a back arrow appear only when the page has been scrolled horizontally.
trying something along these lines without success . code...