Cloned Select Menu

Apr 19, 2005

This is handy when making dynamic forms. Will reproduce and return a duplicate of an existing select menu. Just pass the id of the select you wish to clone.


function cloneSelect(objid)
{
var sel=document.createElement('select');
obj=document.getElementById(objid);
var len=obj.childNodes.length;
for(var i=0;i<len;i++)
{
if(obj.childNodes.item(i).text)
{
var opt=document.createElement("option");
opt.value=obj.childNodes.item(i).value;
str=document.createTextNode(obj.childNodes.item(i).text);
opt.appendChild(str);
sel.appendChild(opt);
}
}
return sel;
}

View 4 Replies


ADVERTISEMENT

JQuery :: Creating A Favorite Links Menu, Removing Cloned Content?

Nov 18, 2010

I have several drop down lists of links with one of the drop downs being a "My Favorites". My intent is that when the user clicks on a star image next to the links, it is cloned and appended to the favorites menu, where it can then be drag and drop sorted. To remove the link from the favorites menu, the user can either click on the "x" button to the right of the link on the favorites menu, or unselect the star on the main menus.

I have successfully cloned the link and appended it to the favorites menu by selecting the star and enabled the drag and drop sorting, but I am having trouble removing the link form the favorites menu when unselecting the star and when clicking on the "x". Here is what I have so far:

var me = '';
$('div.star').toggle(function(me){
var me = $(this).next('a').text();
$(this).addClass('favorite').next('a').clone(true).appendTo('ul#myFavs1').wrap('<li></li>').before("<div class='dragHandle'><img class='png' src='_images/dragHandle4.png' width='11' height='11' /></div>").after("<div class='remove' title='Remove from Favorites'></div>").attr('id', me); return me;}, function(me){[CODE]...

So, I clone the link, wrap it, add a drag handle and the 'x' button, give it an id of the text of the link which all works fine. I have a different part of the script that uses the drag handle to drag and drop the links...that works fine. The issues I am having are that unselecting the star does not remove the link from the favorites drop down and clicking on the 'x' does not even fire the alert. The z-index on the 'x' is higher than all the other elements in the li.

View 2 Replies View Related

JQuery :: Select Menu Shows 'undefined' When Open Menu?

Jan 13, 2011

I am trying to use the Jquery selecmenu to skin dropdowns.There are extra UL LI getting formed with data "undefined" so dropdown is showing undefined in end.

View 1 Replies View Related

Expected '' Error - Select Menu 'Customer' Which Triggers A 3 JS Functions - To Populate 2 Extra Select Menus

Aug 18, 2010

I'm having problems with a Javascript 'Lookup' function.

Basically, I have a select menu 'Customer' which triggers a 3 JS functions, to populate 2 extra select menus.

Using IE Developer Tools, during debugging, I get this error: Expected ';' Error

This relates to either: eval(ajax_CustContact[index].response); OR eval(ajax_CostCentreContact[index].response); (it's a bit random, as sometimes it works, sometimes it doesn't)

I have tried changing the 'custid' to 'custname' to check whether it was an integer causing the problem, but had the same problem.

View 4 Replies View Related

Ajax :: Create A Multiple Select Menu Where Can Select Several Different Items

Oct 10, 2010

We have a list of items that each has a different quantity available. So I am going to create a multiple select menu, where they can select several different items. So, how can I make it that when they leave the field it sends all the different ones to the ajax program to build all the appropriate quantity forms?

[Code]...

View 1 Replies View Related

Modifying ChildNodes Of A Cloned Div

Nov 23, 2005

I have a div 'readroot' that I clone. I change the change the id and
name of the childnodes of 'readroot' to the original name plus a
number(counter).

The problem is I have i have a div 'serials' inside 'readroot' and the
childnodes of 'readroot' are not modified with the current function i have.

What is the best way to modify the childnodes of the div serials?

I guess i could put another for loop inside the for loop of the
moreFields function but i am thinking a recursive function could do it. Code:

View 2 Replies View Related

JQuery :: Tooltip Goes Away After Being Cloned?

May 7, 2011

I am trying to add a tooltip to an element (based on vertigo-[URL]... Normally, works fine, except when I clone an element which has a tooltip in it and append it to another element, the title disappears after the first time it is hovered over. Code is below, and a live example is here.

[Code]...

View 1 Replies View Related

Changing Ids In Cloned Table?

Jul 2, 2010

I have a table nested in a row of another table, briefly:

<table id='table1'>
<tr id='row1'>
<td id='col1'>

[code]....

View 5 Replies View Related

Cloning Objects And CSS Id Of Cloned Element

Jul 23, 2005

I use such code to clone blocks:

element = document.getElementById(IdOfElement)
element = element.cloneNode(true)
new_element = document.getElementById(IdOfElement).appendChild(e lement)

Anybody knows how to set id for the new element ? I mean the id which I coud
use in CSS stylesheet for setting css properties of new element.

View 3 Replies View Related

Need File Input Cloned From 1 Form Into Another?

May 17, 2009

I have an <input type="file" name="image" /> in an html form that get's submitted via method="POST". But I can't submit this normally, since this is all I want submitted, and there is already a <form> tag defined above the code and than below the code, closes the form with </form> that must remain there. Since, there is no way to have forms inside of forms, I am using Javascript to create a form and submit it on the fly. But I need to get a copy of the file input element defined in the document.forms.creator form.

I handle the action with a php file that calls $_FILES['image']['name'] and $_FILES['image']['tmp_name']. The problem is I need to create the form on the fly, must clone the <input type="file" name="image" /> so that it obtains the $_FILES['image']['name'] and $_FILES['image']['tmp_name'] and submits it all on the FLY! Here's what I got so far, coded in php, but you can see the Javascript in there as well. It submits it fine, but $_FILES['sigImg']['name'] and $_FILES['sigImg']['tmp_name'] are NOT SET for some reason...

echo '<tr><td colspan="2"><a href="#" name="sig' . $user_info['id'] . '"></a><center><b>Signature Image Rotator</b></center><br /><center>
Add Image: <input type="file" size="48" id="imagefile" name="image" />  <input type="button" value="Upload" onclick="createFormAndSubmit()"></center>';

[code]....

I have tested this in IE 8 and doesn't set $_FILES['sigImg']['name'] and $_FILES['sigImg']['tmp_name'] to anything. I don't want the value of the file input, since this will be different depending on the browser. And in IE 8, you'll need to have some settings enabled to be able to get the full path, otherwise will return "fakepath".

View 3 Replies View Related

Cloned Selectbox Will Not Refresh Content

Jan 19, 2006

I have two selectboxes containing several option. I am able to move options from one selectbox to the other selectbox (by .insertBefore for example).

However, when I clone those selectboxes, the cloned selectboxes behave incorrect. I am able to move options from one to the other, but they won't show correctly. Only after a browser resize or minimize/maximize window will the selectboxes be 'refreshed' to reflect their real content. See the following code example. Bottom selectboxes are clones of the top ones. Code:

View 6 Replies View Related

Changing Attributes Of Input Tag In Cloned Row?

Jun 24, 2010

I'm extending the number of rows of a table by cloning the last row (=newLastRow). Each row has a single input tag in it, with a name which includes the row number and an onclick function call which passes the row number to the function:<input type='text' class='clickable' name='inp8.1' size='20' value='xyx' onclick='toggle("table8");'>The new cloned row has an input tag with the same parameter value as the cloned one, obviously. I need to increment this: name='inp9.1', 'toggle("table9")'.y question is simple but I'm just starting with DOM: how do I refer to the input tag in the newLastRow so I can change these values?

View 2 Replies View Related

How To Set Another Select Menu

Sep 25, 2010

I would like to know how to set another select menu based on what was select by another one example if I select water in the first select box.i would like to be able to select a type of water from the next select box.i have items in the first select box like water , wastewater, petroleum.if i select water in the first one then the second select box should have a list like brackish water,brine,fire protection.

View 9 Replies View Related

Select Menu Pop-up

Nov 1, 2002

I have this select menu

<select name='config'>
<option value='cal' selected='selected'>Choose a server config</option>
<option value='cal'>Official CAL Match</option>
<option value='clanbase'>Clanbase time 20 (FF-ON)</option>
<option value='clanbasemr12'>Clanbase MR12 (FF-ON)</option>
<option value='ogl_Advanced_v2'>OGL CS Advanced Server Config V2.0</option>
<option value='ogl_ff_v2'>OGL CS FF Server Config V2.0</option>
<option value='ogl_v2'>OGL CS Server Config V2.0</option>
<option value='pg'>Official ProvingGrounds Server Config</option>
<option value='Public'>PUBLIC Settings</option>
</select>

and I want to make it so when they make a selection, it pops up a window to tell them a little about what settings that config has.

View 1 Replies View Related

JQuery :: Click Event Not Working When Cloned?

Feb 27, 2011

I have a page like this:

<div class="clone" style="display:none;">
<input type="text" name="test" />
<img src="icon_delete.png" class="delete"/>

[code]....

View 1 Replies View Related

JQuery :: Datepicker Not Working In Cloned Code

Oct 4, 2011

Below code is in html
<div id="firstdiv">
<input type="text" class="cal"/>
</div><input type="button"/>

Below is in head tag
$(function() {
$('.cal').datetimepicker();
});

Following in .js file
$(document).ready(
function(){ /* here goes the code for div clone*/
$addTripBtn.click(
function(){ var $firstCal = $copydiv.find(':text');
$($firstCal).bind('click', function() {
$('.cal').datetimepicker();//$('$firstCal').datetimepicker();
});

I have textboxes in div wherein onclick I get a calender popup. Now I have to repeat this div on button click for which I used clone() method. Repeating div content is working fine but when I click cloned textbox for calender it is not working.

View 3 Replies View Related

JQuery :: Increment ID Of Selected Cloned Elements By One?

Nov 14, 2010

i have following code:

<input type="button" name="addNew" id="addNew" value="Add New Activity" />
<table border="1" class="likertBorder" cellpadding="2" id="actTbl" >
<tr class="likertBorder responseRow" id="actRow">
<td class="likertBorder" valign="middle" align="center">

[Code]....

Its adding a new row with all child elements but i am unable to assign unique ID's. I'd like increment ID by one or append existing id with some unique number.

Also when i refresh page all loaded elements gets removed. Is there a way so that these newly added rows,Td, text boxes and select stays even when page is refreshed.

View 3 Replies View Related

JQuery :: Altering Cloned HTML's ID Values?

Jan 12, 2010

<!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].....

View 2 Replies View Related

JQuery :: Rename Cloned Element Id (increase By One)?

Sep 25, 2009

I have following code:

[Code]...

How can I rename cloned element? Should be fine to increase its name by one,e.g.: original id1 into cloned id2 and so on.[URL]...

View 2 Replies View Related

JQuery :: Cloned Elements New Class Isn't Recognized?

Oct 21, 2009

I have two functions show after the message. The first works fine. When a checkbox is clicked with the class availableProfile, its class is removed, selectedProfile added. It is then appended to anotehr list and destroyed in the original. However when i click the now moved checkbox it doesn't recognize it has the new class of selectedProfile.

$(".availableProfile").click(function(event) {
elementID = event.target.id;
elementGroup = elementID.split("__");
$(this).removeClass("availableProfile");

[Code]....

View 1 Replies View Related

JQuery :: Updating Children Elements In Cloned Div?

Feb 18, 2011

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].....

View 1 Replies View Related

JQuery :: Validation Not Working On Cloned Elements?

Nov 7, 2010

I am just now starting to use the jquery clone and validation features and I'm having a little issue.I am using relCopy plugin to clone the elements and the jquery.validate.js plugin to validate that they are not empty.

The javascript is as follows:

<!--script to make clones of fields-->
<script type="text/javascript">
$(function(){
var removeLink = ' <a class="remove" href="#"

[Code]....

Only the original select and text field are getting validated, the form submits even if a cloned element is not filled in.

View 3 Replies View Related

Use Callback To Apply Them On Newly Cloned Objects?

Feb 3, 2011

I am using quicksand, i want to use tool tips in it, but i am facing problem due to callback code that i am not able to implement, this is the place where quicksand is present and also told about tooltips usage with it, well he has not explained it in detail as expects people to know jquery before using it. http:razorjack.net...-and-demos.html

the code which is saying to use is this [code]...

i don't know where to place this code and how as i don't know jquery, and if this code is to be place in tooltips script then where to place in it and how, e-g i might use this one[code]...

then in this code where to put the above code.

If its not possible with the above tooltip then i am ready to use any tooltip which can display picture in it.

View 4 Replies View Related

Drop Down Menu - Only Select Each Value Once?

Jan 6, 2011

Tried searching for this, but can only find js events to remove an item completely from a drop down box once it's been selected. Example: On a page with many fields for entering different DNS server addresses, I have a drop down menu next to each field, and the values are "Main DNS", "Alternative DNS", "Third DNS", "Least Favorable". Since there can only be one main DNS server chosen, I'd like to know if it's possible for js to prevent that choice from being used more than once. Say there is a Main DNS selected, but the user changes his/her mind and wants a different one. When he selects a second "Main DNS", the first item will return to the drop-down default choice (most likely blank). As stated before, I'll gladly accept a link describing this (or even the proper term to use for a google search).

View 14 Replies View Related

Select Menu Value Undefined?

May 25, 2010

I'm about to use this script below for a project I have. It works great but unfortunately I can't get it to read select menu (selected option) values. It returns undefined. I've asked the author but had no response as yet, so I was wondering if anyone else could see why it wouldn't read the select menu value.

var functionname = function () {}
functionname.prototype = {
options : {},
generateShortCode : function() {

[code]....

View 1 Replies View Related

Advanced Select Menu?

Jun 4, 2004

I'm looking to create a multiple selection drop down menu that has radio buttons & text. For example


[MENU] <-click

[MENU] <-after click
--------------------
| (x) Selection one |
| (o) Selection two |
| (x) Selection three |
| (o) Selection four |
--------------------

so basically, like a <select> except it has radio selections and you can pick several choices. When you select one, that whole row is highlighted (background color of that row changes). Would I use javascript/dhtml for this? I'm guessing so.

View 6 Replies View Related







Copyrights 2005-15 www.BigResource.com, All rights reserved