I would absolutely love to have the datepicker icon BEFORE the input field. Is there any simple way of doing this? (Or even not so simple... am prepared to have a go at tweaking the code in the .js file if only I knew where to start looking
View 8 RepliesI am using multiple instances of the jquery datepicker on my form. Due to my CSS i could not use the icon trigger built-into jquery, it caused the icon to be displayed below the input field and i wanted it to be displayed next to the text. Below is the code for one of my input fields.
[Code]...
I have multiple date fields i want to use the datepicker with. The issues i am having are; 1. when i click on the icon to display the datepicker, the picker is displayed, but it displays on the wrong icon. No matter what icon i click on it always gets displayed on only one and it is always the same one. Each field has its own unique name and id the only thing that each field shares is a class. I can't seem to figure out how to fix this. My other issue is that when i click on the icon the page scrolls to the top, so if i am clicking on a picker icon at the bottom of the screen it scrolls the screen to the top.
I have called a calendar icon file from a script on the form - this works except IE, where I get the "x" for image. I prefer to call it from the widget defaults. I have downloaded the themeroller version, including datepicker. The defaults regarding button image that came with the download are:
buttonText:"",buttonImage:"",buttonImageOnly:false, I wish to change it to: buttonText:"calendar",buttonImage:"",buttonImageOnly:true,
Note the missing button image from the icons png that comes with the download. I can see that other widgets use those and that there is a calendar icon, but how do I go about calling that supplied icon calendar onto the page by using "buttonimage:"" "? I suspect there may be more to it...but cannot follow it through.
I have 2 datepickers, 1 that has the day in and the other the day out. Id like to be able to disable the day out datepicker icon(hide it) until you put in the day in date. Here's my code. You'll notice the onSelect:datepickerhandle...this makes a call to that function which only allows the day out date to be within 30 days of the day in.Ill add this script at the bottom to.
var today = new Date();
I am using both the jQuery Validation plugin and the datePicker plugin. I would like to get the error message for this showing after the calendar icon for the datePicker plugin. I have tried this and cannot get it to work and so far not found a solution on any website I have checked.
jQuery Validation code
$(document).ready(function() {
$("#adminform").validate({
submitHandler: function(form) {
SubmittingForm();
},
rules: {
date: {
required: true,
date: true
}},
errorPlacement: function(error, element) {
if(element.type == 'input') {
error.insertAfter(element.sibling(a));
} else {
error.insertAfter(element);
}}});
});
Trying the sibling thing was my last probably silly attempt at getting this working.
HTML output when the field fails validation
<fieldset>
<legend>Update Date</legend>
<label for="date" class="admin">Date of Run: </label>
<input type="text" class="date-pick dp-applied error" size="7" value="" name="date" id="date">
<label for="date" generated="true" class="error">This field is required.</label>
<a title="Choose date" class="dp-choose-date" href="#">Choose date</a>
</fieldset>
As you can see the label for the error is placed inbetween the input field and <a> for the calendar image. How to get this label to show after the <a>.
If set the width of button by css the icon will be positioned in center of button (in IE 8).But in FF it looks good.
View 7 Replies View RelatedI have successfully implemented the Datepicker plugin but am having very difficult problems with the image alignment of the calender icon.
The icon seems to have no padding/margin/spacing between the input box and the image, and is also not aligned correctly.
I have viewed the documentation but can see no reference on how formatting is achieved.. I looked at jquery-ui css (redmond) and can see no reference to how this is aligned.
When datepicker is used on buttons positioned at the bottom of thescreen it only displays part of the datepicker popup. The default position should be bottom, but if it reaches beyond the end of the screen the position should be above/top. Does anyone know how to control this ?Current code:
// set DatePicker defaults
$.datepicker.setDefaults({
dateFormat: 'dd/mm/yy',
[code]....
how do I change my html/javascript so that if I drag and drop a link from a webpage to
the desktop in such a way that the name of the shortcut created is not the URL of the link but the link itself?
e.g. if the link is
<a href="http://www.microsoft.com"> MS </a>
then the name of the desktop icon should be 'MS' and not
http://www.microsoft.com
<script type="text/javascript">
$(function() {
$('#myDiv').dialog();
$('#myDiv').dialog(open);
[code]....
When dialog pops up and when I want to select date from datepicker but clicking on input datepicker is under dialog. What option make it to be on top ?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<META content="MSHTML 6.00.2800.1627" name=GENERATOR>
[Code].....
I'm using jQuery to make ajax calls for content, when I click on a link and pull in the new content, I want the <title> in the <head> to change. I thought that since head and body are both siblings in the DOM I could target the <title> in the same way as a <p> or any other element and write a new value in, using replaceWith() which would then change the text in the tab at the top of the browser but it doesn't seem to work. I even tried adding <title id="title_text"> and targeting #title_text, but it doesn't change that way either. The original title text in the browser tab does change, but to the page uri. After using firebug to see what was going on when using replaceWith(), I saw that replaceWith() was replacing this:
[Code]...
Trying to check how many lines a div has and then alter another to match.
Found this code, but I'm not sure what to do [code]...
Look at Navigation and then look at Animated Menus as an example. When the grey animated menus (div.columnrt) takes up two lines (could be more), need the corresponding left div (div.columnleft) to be same number of lines, so that everything stays lined up. Each of these pairs sits inside of a li element.
Is it possible to alter the query string of the current URL without triggering a page load.
eg. Say you have AJAX pagination, allowing people to change pages without the whole page reloading, just the content of the paginated area. However in case somebody bookmarked the page, they would really only be bookmarking the page 1 - even if they were on page 10.
So, what I was wondering is if it is possible when a user clicks Next, Previous, or Page 10, 15 etc, to alter (with javascript/jQuery) the URL (shown in the browser navigation bar) so that it reflects the page number they are on.
I am sure something like this is possible, either that or it is a damn fast connection. When I browse photos in somebody's photo album in Facebook, the photo loads with AJAX, yet the URL query string changes to reflect the current photo. And all this happens without any obvious full page reload. It appears that the URL/query string is being updated using Javascript while the photo changes using AJAX.
The link below is a stripped down section of a form.
[url]
The problem I'm having is with altering the names of the fields. I'm trying to add an identifier on the end. "_X_1", "_X_2" after the new sections are added.
NOTES:
Incidentally, "_X_" is a delimiter so the key can be converted into an array on the back end to extract data from it.
I can't alter the "repeater" variable because it would be extremely complicated on the back end.
i,m trying to make a map who show me as position A and a target adress as point B.I have made it so i can choose adress a and adress b from a dropdown but i want to automaticly load my position as possition A then choose position B from a dropdownlist. How can i do this ?
[Code]....
function func1() {
this.val = 1
}
function func2() {
this.getVal = function() {return this.val}
}
var inst1 = new func1();
var inst2 = new func2();
inst2.getVal(); //should return 1
So the point is how can i change the object that this refers to?
first off I am pretty much a newbie to web development but especially to java script so go easy with the tecnical terms I am trying to implement an image carousel but I cant get it to work and it is altering the width of my div in the HTML. I have the slider in div id="content", when I dont have the JS file in the folder the div shows up fine but when I have the JS file in the right place it resizes it to 1024*50 so none of the content can be seen. I was wondering if anyone could make sense of the JS file and see if anything would be causing that? I must also point out that I havent written this code, I have copied it from the web.
View 1 Replies View RelatedIs it possible to alter the contents of a remote page in an iframe through javascript? I have a page I'm showing from a remote server that has no style at all.. and I can't stand the Times New Roman font on my page.
View 4 Replies View RelatedI was hoping to get some help with altering the default size of a tag image.
Below is an example of what the "ElementByTageName" is doing.
[URL]
How would I go about changing the size of the tag elements?
And here is the javascript code...
var gal = {
init : function() {
if (!document.getElementById || !document.createElement || !document.appendChild) return false;
[Code]....
The source code on the website below i want to know what do i need to change to get the date to show as dd/mm/yyyy instead of mm/dd/yyyy?
[url]
As you can see I am totally lost, I have been trying to work this out for several weeks now without any progress, I need to make about 20 of these displays each include 4 buttons that will none/block the related text area below the display for a visual please see: Code:
View 3 Replies View RelatedI need to get input for a css class font-size attribute from the user like 8px,10px,12px and so on.. and dynamically I need to change it.
I get the following code from net:
Its working fine in mozilla, but in IE 8 and IE 9 it works but affects some other styles also and after onclick the div it set to correct.
<head>
<script type="text/JavaScript">
<!--
var whichOpt='select'
function showOption(which)
{
//First hide the currently displaying menu.
document.getElementById(whichOpt).style.display = "none";
//Determine what the new selection is.
whichOpt = document.getElementById(which).options[document.getElementById(which).selectedIndex].value;
//Show the newly selection menu.
document.getElementById(whichOpt).style.display = "inline";
}
-->
</SCRIPT>
</head>
Code:
<select class="g4" NAME="bonustype" id="bonustype" style="width:180"
<option VALUE="select">Select an option</option>
<option VALUE="signon">Sign-on bonus</option>
<option VALUE="refer">Refer a friend bonus</option>
</select>
</div>
<table width=190px align=center><tr><td><div id="select" align=justify class=red>After selecting a bonus type, the criteria relating to that bonus will appear here.</div></td></tr></table>
<div id="signon" style="display:none;">SHOW SIGN ON CRITERIA</div>
<div id="refer" style="display:none;">SHOW SIGN ON CRITERIA</div>
However, at present I cannot get the 'signon' or 'refer' div's to appear. When the php page is loaded, 'After selecting a bonus type, the criteria relating to that bonus will appear here' will appear on the screen. When I select a different option for the 'bonustype' combo box, the writing will dissapear but nothing will show up instead. When selecting 'Select an option' again, the writing that appeared at the start does not show up.
therefore I take it that the javascript is not working correctly (i.e. not changing the style display option contained with in the div's). But why does the 'After selecting a bonus type, the criteria relating to that bonus will appear here' disappear when a different option is selected, but not appear again?
#navigation li is the parent element, which is positioned relative.The ul element above that is also position relative. I previously tested a click function and was able to confirm I was getting the correct position back, so now I just need to set the CSS property correctly for all of those links.The reason I want to do this is I have a set of links that appear over a photo of a city skyline. When you hover over those items, I want them to be given a background image that is a blurred and lightened version of the same photo so it needs to line up (sort of like the tabs are made of frosted glass).
View 1 Replies View RelatedI'm using this fantastic accordian here: [url]
It works great, but I'd LOVE to be able to set the tab image to another image (say, a lighter shade of green) once it's clicked. Just so the user knows which tab they're viewing.
I've tried looking through the three .js files to do this, but it's a little too advanced for me.