I have created two onClick events that i need to combine into one with jQuery. I am not sure how to do this.I have an unordered list:
<ul id="coverTabs">
<li class="currentTab"><a href="#">Individual</a></li>
<li><a href="#">Couple</a></li>
[code].....
I was wondering if there way a way to loop through elements that contain a data key applied by data(). I couldn't find a selector for data keys.
This for instance, I would like to give me the value of 'foo' for where ever it has been applied.
$(document).ready(function() {
$('body').data('foo', 52);
$('head').data('foo', 32);
});
[Code].....
I have the following object:
var wDefaults = {
"skin":1,
"pagewidth":"960px",
"c1col":[
{"wid":"w001","pcol":0,"wpos":0,"wclosed":"false","wcollapsed":"true"}
],
"c3col":[
{"wid":"w002","pcol":0,"wpos":0,"wclosed":"false","wcollapsed":"false"},
{"wid":"w003","pcol":0,"wpos":1,"wclosed":"false","wcollapsed":"false"},
{"wid":"w004","pcol":0,"wpos":2,"wclosed":"false","wcollapsed":"false"},
{"wid":"w005","pcol":1,"wpos":0,"wclosed":"false","wcollapsed":"false"},
{"wid":"w006","pcol":1,"wpos":1,"wclosed":"false","wcollapsed":"false"},
{"wid":"w007","pcol":1,"wpos":2,"wclosed":"false","wcollapsed":"false"},
{"wid":"w008","pcol":1,"wpos":3,"wclosed":"false","wcollapsed":"false"},
{"wid":"w009","pcol":2,"wpos":0,"wclosed":"false","wcollapsed":"false"},
{"wid":"w010","pcol":2,"wpos":1,"wclosed":"false","wcollapsed":"false"}, {"wid":"w011","pcol":2,"wpos":2,"wclosed":"false","wcollapsed":"false"}
]}
First, how do I access a single value? I've tried some of the examples I saw on the forum, but nothing happened. The alert did not fire:
alert(wDefaults.c3col[0].wid); //first try
alert(wDefaults.c3col.0.wid); //second try
var obj = wDefaults.c3col[0]; //third try
alert(obj.wid);
The nested objects are the properties for widgets within a portal. After the user moves around the widgets, I need to update the object, putting the widgets in a different order within c3col and updating the values saved in pcol, wpos, wclosed, & wcollapsed. I also may need to add or delete an object, for example, delete wid=w003 and add a new one called w012.
My logic would be:
for each widget on the page
found = false
find the object in c3col where wid == x and update its other values
. set found = true
if found == false then add a new object to c3col with x & its properties
end for
for each object in c3col
if that wid isn't found in the list of widgets on the page, delete it from c3col
end for
sort the objects under c3col by pcol and then wpos
The red parts are the ones I'm unclear about how to do it. My basic questions are:
(1) How do you access a single nested object?
(an object within c3col, find and change its values)
(2) How do you add a new nested object to an existing object?
(add a new object to c3col)
(3) How do you delete an nested object?
(remove an object from c3col)
(4) How do you sort nested objects?
(sort the objects in c3col by pcol and wpos)
I have a problem, I am by no means new to PHP/Javascript but am finding an error that I cannot ridicule how to stop.Ok Ill try and explain it in simple terms:I have two divs, div1 and div2,In div1 there are links whitch are fetched from the databaseIn div2, content from links href ? in div1 is collected through AJAX.No I have a php preg_replace function that replaces it to look like <a href='#' onclick=\"showTopic(0,$char,'$1');\">$1</a> Now when you click this, it inserts into the "tpm" table in the database,(this table holds the links for div1) But it will not update the links unless i refresh the page? I would like to knoe how to update the links in div1 without refreshing, because refreshing = going back to the start of the code i am working on.
View 3 Replies View RelatedI am sure this question has been raised and answered before, but I can't seem to find an answer that works for me. I hope I will get an exact response here. Here's my issue - I have my index.html that has its own $(document).ready method and everything pretty much works within it. I am trying to dynamically load a page to replace part of index.html (let' say the #inner_content ID) -
[Code]...
I'm trying to use the following loop to loop through dynamically created controls on my web form:
for(x = 0; x <= count; x++) {
Stmt += $("#DDLColumns" + x).val();
switch($("#DDLConditional" + x).val()) {
case "is equal": Stmt += " = ";
[Code].....
I'm relatively new to JavaScript. I would like to loop through all the elements within a form and grab their values and what type of input they are. So far I came up with:
[Code]...
I have created a servlet that does nothing more than create a XML file.i have got some JQuery code that reloads the servlet to get the XML data.This works fine and i am able to load the data i want, the problem i have is that when the data is loaded to the jsp page it displays [object Document] in front of my output.
Code JavaScript:
$(document).ready(function() {
setInterval(function() {[code]....
XML file only has one value, called row 1 with the data, "wow this is cool", but my output is: [object Document]
So here is my problem...I've been banging my head against the wall for days with this one.How do you send data through the URL to be handled by a script in page.html, where page.html processes the data and dynamically displays the data in a modal. I can get the script to execute without trying to display in a modal, but as soon as I attempt to display in a modal, all I get is the static HTML without the jquery dynamic html.I know some code should be given, but if anyone could just walk me through the logic of why static html might be shown but not the dynamic, I think i can figure it out.
View 1 Replies View RelatedI am trying to make my own jquery drop down menu. As usual, HTML is like this:
<ul class="menu">
<li class="parent item79"><a href="#"><span>Top Item 1</span></a>
<ul>
<li class="item101"><a href="#"><span>Sample sub-menu 1</span></a></li>
[Code]....
...it doesn't work. Top menu shows, but drop down on hover doesn't show.
I would like to loop through elements that are NOT disabled. So far my code is:
$("#addlivestock :input").each(function(){
if($(this).find().attr('disabled','disabled'))
{
var getAttr = $(this).attr("name");
[Code]....
When I click a button that code fires. When that code fires all the elements that aren't disabled get disabled. My code does NOT work as expected and I found the problem, which is if($(this).find().attr('disabled','disabled')). how to loop through form elements that are NOT disabled.
In the examples for live() and delegate(), the selectors match at least one element that already exists. Will either of these commands work on elements for which there is no match at all on page load?
In my case, I want to bind a keyup event to the textareas that jeditable creates. I could probably create custom plug-in (to the plug-in :) to do the job, but I'd like to use live or delegate if they would work.
I am practicing looping through a document, finding certain tags and then manipulating them. I have a document with several select tags. 5 of them are very similar showing pirate names. 2 shows pirate ships. The action I would like is if you select a pirate from any select menu, all the other pirate select menus show the same pirate.
This worked as intended until I added the pirate ship select menu to the document. Now for some reason when the script loops through the select tags it is missing some of the pirate ones. The error message I get is that my variable subSelect is null, though it works for some of the loop. I'm not sure why it is dropping it's value.
Code:
<html>
<head><title>DropDown Test</title></head>
<script type="text/javascript">
[code]....
i'm trying to do the following: select the links one after another and add a class to them. When the next one is selected i want to remove the class from the previous.
[Code]...
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 have a button and a table that I want to clone when "Add new" button is pressed, and then append the cloned elements to the "items" container, but with updated id's and names - the update is done by appending the value of "num" attribute of "items". In the end I'll have to clone and update the id's and names for multiple input elements in the table found in the "default_container" - but right now it doesn't work even for direct children. The problem (one of them at least) right now is that the iteration over the children isn't performed.
$
(
document
).
ready
[Code].....
When using the document.write command to dynamically cretae a new html
page .. how should I use the "" charcters.
e.g. for font size="2"
As the attributes appear within " "for the purposes of the documnet.write
bit ...it just gives me errors.?
I am making a system whereby if an element has a class "editable", you can click it and a popup box appears with some options about that particular element. Fairly straightforward, I'm using [code]...
This works fine but I need to be able to have lots of different divs, all with class "editable", some of which are inside others with class "editable". Like this [code]...
However, clicking on the 'somethingelse' div, triggers the click correctly but also triggers it for the parent 'something' div, so I end up with the popup box appearing twice.
Does anyone know how to just catch a click event on the exact div (without using ids) without triggering the parent?
I want to find a way to highlight elements when I click on them. The problem is the elements are nested and when I click on a child element, the parent element is highlighted as well. I would like the child to highlight only, but because the child is within the boundaries of the parent (i.e. you can't hover over the child without also hovering over the parent), the parent highlights as well.
For example, if you have...
<div>
<h1></h1>
<ul>
<li></li>
<li></li>
</ul>
</div>
I'd like to be able to hover over, click and highlight an <li> and hover over, click and highlight the <div> independently of one another. It's no problem to hover over, click and highlight the <div> without highlighting the <li>, but because the <div> encapsulates the <li> it's impossible to hover over, click and highlight the <li> without highlighting the <div>.
My HTML:
<div class="home-button">
<span><a href="#" style="">Button</a></span>
</div>
I have an instance of a div (button), inside this div is a link wrapped in a span. When you hover over the div (".home-button")I want to move the background position inside its "span a", I've achieved this using the code below.
[Code]...
I need to loop through all form elements such as text, radios, check boxes and the like and to save their state in a file. does anyone have JS code to do this ?
View 1 Replies View RelatedI have a form and I want to loop through the elements to give them the .onfocus and .onblur attribute. how can I do this?
View 5 Replies View RelatedI have a function that dynamically creates page (form) elements with the option to remove it.
Code:
divcounter++;
var element = document.createElement("input");
...
element.onclick = function() {removeElement('sel' + String(divcounter))};
[Code]...
For some reason divNum in removeElement() always returns the latest value of divcounter. So if I add 4 form elements, and I want to remove the 2nd item, item 4 is removed and above fuction returns an error when I want to remove another element afterwards because it is trying to remove the 4th element again.
Is it possible to search an array without looping through all the elements?
hoping for something like this;
myarray.exists("one")
which may return the element number or a true or false depending if the element being searched exists.
I've lately stepped up a little problem with one of my personal projects that i am working. I'm writing an aspx webpage, which includes web user controls inside it.
The webuser controls are within a web form (id=form1 runat=server) which resides in the
main.aspx page.
1. First of all, is there a way to find a SPECIFIC control inside the webuser control (ascx)
using Javascript in the main.aspx?
2. If not (which i think it is), which is the best way to do it? The snippet i tried was this:
[Code]...
I am returning the following to $getJSON() and not getting any results:
{"QC":["x","y","z"],"RM":[{"DEFAULT":"default_project1"},{"DEFAULT2":"default_project2"},{"DEFAULT":"default_project3"}]}
In the "RM" array there are three objects, each a single name/value pair. The name of the array[0] object ("DEFAULT") is identical to the name of the array[2] object. No results are returned by the getJSON call. Since each object is a separate array value, there shouldn't be any object name collision problems. Note that if I change the name of the array[2] object to "DEFAULT3", the data structure is handled properly.