I have around 30 check boxes in a form and I need to keep track of their status if they are checked or not and based on that change the data in the dom.
I am stuck on the logic of how to implement or code for 30 check boxes. I was using the below example code but there will be a lot of if statements as I need to always know what their status is. Is there a better way I can manage so many check boxes ?
if($(this).is(":checked"))
i have created an option on a website to give the possibity to the user to change the font size (smaller, bigger, reset), like the famous x3 'A' that we see in most of the websites. the code i have is based on a plugin copywrite to [URL]. now i'm facing a problem with different font size for different elements. to make the text bigger and smaller works like a charm but to reset the font size is not working so good. here is the code of the plug in the reset part:
//on clicking default font size button, font size is reset
jQuery(container + " .defaultFont").click(function(){
jQuery("#content *").css('font-size', defSize);
// coockie to rememebr the selected font size
updatefontCookie(target, defSize);
});
here is how i'm calling the function: fontSize("#container", "#content *", 8, 12, 20); container is where i have the images to make the text smaller or bigger content is the div that has the content that i want it to be changed 8 is the smallest fonr size 12 default 20 max now the thing is that i have different font sizes in the page and some of them don't have a class just the <font> ....</font> when i'm clicking the rest button then i'm getting everything with size 12 and this is what i want to change. i want to remember the current font size and set it back.
I'm currently redesigning a forms in which one ore more objects (eg members) can be added to a selection. JQuery is a huge help with that, but now I don't know *how* to achieve the following:
Currently I add the selected members to an selection-list with option value = memberID and option label = memberName. I want to change that to the following:
AAutocomplete search inputto find a member. On select I want the memberName to be added to a span (or something) as text with an X-to delete (just like tagify does for instance). I could use tagify, but I don't know how to keep the memberID field coupled with the selected tags (and especially how to get the memberID removed when removing a value).
And for bonus points: I'd like to make the selected values draggable so I can change the order (and of course: on submittal my form must know the order too).
Right now, I have multiple draggable windows on my site. The problem is, that only the most recently created box is draggable and I clicking the other box doesn't work.
Where you can click and drag different boxes. The problem is I don't know how to implement this. When the two boxes are up and I click on one box, it completly ignores the other box. I realize in my code I need to update widget1 but I'm not entirely sure how I can do that. I call the method below using: document.onmousedown=selectMouse; in my javascript
If it helps, the windows are all contained in a <div> tag with the id 'closewid'
Each of the new windows that opens had the id "widget"+a number.
46 function selectMouse(e)
47 {
48 if(firefox)
49 {
50 var p=e.target;
51 if(p.attributes['id'] && p.attributes['id'].value=="titlebar")
52 {
53 //document.write(p.attributes[0].nodeValue);
54 isDrag=true;
55 x=e.clientX;
56 y=e.clientY;
57 tx=parseInt(document.getElementById('widget1').style.left);
58 ty=parseInt(document.getElementById('widget1').style.top);
59 }
60 }
61 else
62 {
63 var p=event.srcElement;
64 if(p.attributes['id'] && p.attributes['id'].value=="titlebar")
65 {
66 isDrag=true;
67 x=event.clientX;
68 y=event.clientY;
69 tx=parseInt(document.getElementById('widget1').style.left);
70 ty=parseInt(document.getElementById('widget1').style.top);
71 }
72 }
73 }
I'm using AIR to write an application that is mostly javascript (I am using jquery for quite a lot of it). The program has to be able to download multiple HTML pages (like a RSS feed reader might) and take a specific action when the download is complete, depending on which page has just downloaded. I'm using air.URLLoader with an eventlistener to notify when the page download is complete. The problem I have is that I want to run through a database table of around 20-30 URLs and dynamically create URLLoaders for each.I've spent hours searching Google and looking for ways to overload the event listener, add a property to the URLLoader object etc but all to no avail.
The code above will load whatever pages it is told to, but the problem I have is that it needs to take different actions depending on which page is loading. Each page in the database table has an ID field and I need to somehow identify the ID of the page within the notifyURLComplete function, hence the reason I'd like to pass the page ID into the event listener (apparently not possible) or add an additional property to the URLLoader object.Another possibility was a custom event handler, but I'm not sure how/where this would be done in my code.
I need to keep a log in a test application, so I'm using a textarea for that, and I'm appending text using the+= operator.Follows the trace function which fills the textarea:
window.trace = function(s) {
if ($('#enableLogCheckBox').attr("checked")) {
var logArea = $('#logArea')[0];
[code]....
I'm kind of new to learning javascript so please consider the following code:
orderUser = {
products: [ 'Beer', 'Soda', 'Wine' ],
users: [],
regUser:function(){
varnew_user_id = 12;//normally this wouldn't be a static number ofcourse
orderUser.users[orderUser.users.length] = new_user_id;
}}
There's an object that has some properties and a method. The method registers an user id to the users property. What I'd like to do next is keep track of what users have ordered. Is this possible with (multidimensional?) properties? Something like
userProducts[ 12 ] = [ 1, 0 ] //Soda, Beer
doesn't work. Would there be no other way than arrays?
Demo page illustrating current issue:[URL]... I'm calling different tooltip DIVs from different triggers.Using bodyHandler, each trigger has a unique corresponding DIV To keep a clean document, i've grouped the tooltip DIVs at the bottom of the source When you hover over triggers, the correct tooltip is displayed However, the tooltip displays at the bottom of the page, not tracking with cursor.
How can i group my DIVs away from my trigger markup and still achieve tooltips that track with mouse cursor?
How can I track what is written to an input field on the fly(event that is not "click" "hover" etc but something like "track" or "observe")?Lets say I have a js object like this:
var array1 = {id1: 'keyword', id2: 'execute', id3: 'go'};
And 3 input fields like this:
<input id"id1" name="id1"></input>
<input id"id2" name="id2"></input>
<input id"id3" name="id3"></input>
I want to track the input fields so that
if(
the string "keyword" is written to the id1 field
the string "execute" is written to the id2 field
[code]....
I have a form that captures users email addresses when they sign up for a enewsletter. I want to add this form submission into my google analytics and from what I have read the best way to do this is by tracking an event? I have added some jquery that I mashed together and I just want to know will this work? I added it today and I can only find out if it has truely worked by waiting 24 hours. I downloaded a program called fiddler (recommended in dot net magazine) to see tracking requests in action instead of waiting 24 hours but I can't see any of the field names displaying like AMF signup?
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-8736163-1");
pageTracker._trackPageview();
} catch(err) {}$(document).ready(function() {
$("#pre-book").attr("onSubmit", "pageTracker._trackEvent('Signup Forms','AMF Signup','Newsletter',2.0);");
});
</script>
I'd like to know if there is a way to keep a table header fixed on top of a div while I scroll the table rows. I have a div high 200px and the table itself is around 300px so when I scroll down I'd like to always see the header on top. I already use for the table tablesorter so the solution must be
compatible with that plug-in.
Use jquery to track visitors mouse movements and clicks and then playback. Here is the proof of concept:Uses: jQuery and php. jquery records mouse moves and clicks, sends data via ajax to a php page, the php page writes the mouse events to a text file.When you go to the playback page, jquery connects to a php page that reads the text file and moves the mouse accordingly
View 3 Replies View RelatedCan I remove div1 but div2 keep there?
<div id="1">
<div id="2"></div>
</div>
I have several conditional select boxes that populate from a database, using .ajax(). When the first select has an onchange, the second select populates normally. The same goes for the second and third selects. When I change the value of the second select box, the third box drops all dynamically created options and repopulates. When I change the value of the first select box, I can only empty the second box and repopulate. The third and future boxes keep their values.
The delete and repopulate piece of my function uses this bit of code: var dynamic_options = $("#" + next_dropdown_ID).children(".dynamic_option"); if ( dynamic_options ){ $("#"+ next_dropdown_ID + " .dynamic_option").remove()};
where next_dropdown_ID is the ID of the child select box. I've played with .find() and .filter() but the results are always either (a) ALL options with this class are removed, including the select I'm currently in, or (b)NO options with this class are removed.
Is it possible to delete ALL options on the page that have the ".dynamic_option" class, except for the children of the select box I'm currently in? I was hoping to be somewhat dynamic about it and not have to write an IF statement for every potential select box, so the code will be reusable. I can post the full function and HTML if more context is needed.
Is there any such thing as a jQuery Debugger, i'm trying to learn jQuery but even small things like Syntax errors keep getting in the way and it's hard to track down without any error reporting.
View 1 Replies View RelatedI'm working on a mysql browser / edit-in-place app which presents the user with a floating UI (think lightbox), that contains widgets appropriate for the given field they've clicked on.
Presently, rather than centering the UI element like a lightbox however, I find it best to keep it relative to their mouse, so that they don't have to traverse halfway across the screen with their mouse to interact with the interface if they've clicked something (for instance) on the bottom left.
The problem however should be apparent: if they click something towards the bottom of the screen, we need to adjust the css top/left properties so that the UI remains within the viewable area and doesn't run beyond the viewport, if possible. I've seen this done tons of times with tooltips.
I've thrown some basic awareness together using$(window).height() / width(), but if anyone could point me to a maturealgorithmfor harvesting the appropriate offset.
I am currently using:
$("ul.tabs li:first").addClass("active").show();
$(".tab_content:first").show();
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active");
[Code]....
There are 2 options I could use but I don't know how to do it.
1. Using a get parameter to select the tab
2. Using the cookie plugin (not sure how that works)
I have a site that I'm building at [URL] which use the jquery cycle plugin for a slideshow. I won't post the code here because it's all there with view source at the above address. It's a work in progress. The slideshow is full width (the images in it are actually 2000px wide but looks full width), and works fine apart from when the browser window is resized. This is most noticable when you start with a smaller browser window and then resize it to be bigger.
The slides stay the same width as when the page loaded - I need them to adapt to the new width. I need the slideshow to be centered at all widths, so I've put the images in as backgrounds to divs with center positioning on them. I've tried getting the window width on resize and then applying it to the slides using jQuery, but the original calculated size overrides it when the slide changes.
I'm having a really hard time trying to solve a problem. I have a container DIV aligned center that holds an image. The container is max 940 X 609. The image is set to be 100% width and height.
The objective is to have the container shrink as the user resizes the browser up until a minimum size - say, 400 X 259. I also need the container to stay centered with consistent margins on the right and left.
I want to be able to know how many time a user will spend on a page so basically, I need to get an onload time and an on leave time
View 3 Replies View RelatedI have a simple Javascript that bloggers use to load headlines from my site onto theirs. What is the best way to track which sites are using it?
I've tried embedding a StatCounter tracker but it doesn't give me the page it's used on.
Should I just identify the url that's requesting it, the IP address of the user, and plug it into a database?
How to know whats the action performed when Print is clicked
Code:
<span class="sendPrint">
<div id="eStara_CFPQ" style="height:15px; width:144px;"></div>
<a class="sendToFriend" href="#">Share This Page</a>[code]........
I am slightly confused on href="javascript:;" and href="#" statements
i want to display contents of a form in a plane text format.
for that i want to track a number of textfields in the form.....
do i need to write a seperate line for each textfield ?
i tried
for(i=1;i<7;i++)
{
var cont[i]=document.getElementById("txt"+i).value
-------
------------
-------------
}
but it didn't work out..
I have a form that is calling a js function that does the actual submit. The action of the form points to a page on another server that I do not have the ability to edit.
My problem is that I need a way of tracking submissions and I'm having a hard time thinking of a way to do that. Anyone have any thoughts?
I have a four part process to add something to my website. I'd like to have a bar at the top of my page (if you need an example, something simliar to FedEx to show where you package is along the way) that will get updated upon each page move so the user knows how far along they are in the process and how much farther they have to go?
View 2 Replies View RelatedHow can I track the mouse coordinates outside the active window? No
one can tell me its not possible because Google Spreadsheets and
EditGrid both do it. When you drag down to select cells these
spreadsheet programs are capable of properly selecting the cells based
on where the mouse is, even though the mouse is way outside the
browser. I haven't been able to find any info on it or figure it out
myself. How is this possible?