Currently, I am on the hunt for a unique piece of javascript that can bring ShuttleBox-like functionality into my project.
Essentially, what I require is to have 2 list boxes and 4 buttons - Move Left, Move Right, Move All to Left, and Move All to Right. However, I am looking to implement this code dynamically so it can easily be reused by simply passing in the dom object parameters...
If anyone has any code snippets or helpful links, I would greatly appreciate them...
Thank you in advance...
Is this the kind of thing you're looking for?:
<html>
<body>
<script>
function move_right()
{
var node = document.getElementById ( "left" );
for (i=0; i < node.childNodes.length; i ++)
{
if ( node.childNodes[i].selected )
{
document.getElementById ( "right" ).appendChild( node.childNodes[i].cloneNode(true) );
node.removeChild ( node.childNodes[i] );
-- i;
}
}
}
function move_left()
{
var node = document.getElementById ( "right" );
for (i=0; i < node.childNodes.length; i ++)
{
if ( node.childNodes[i].selected )
{
document.getElementById ( "left" ).appendChild( node.childNodes[i].cloneNode(true) );
node.removeChild ( node.childNodes[i] );
-- i;
}
}
}
function move_all_right()
{
var node = document.getElementById ( "left" );
while ( node.childNodes.length > 0 )
{
document.getElementById ( "right" ).appendChild( node.firstChild.cloneNode(true) );
node.removeChild ( node.firstChild );
}
}
function move_all_left()
{
var node = document.getElementById ( "right" );
while ( node.childNodes.length > 0 )
{
document.getElementById ( "left" ).appendChild( node.firstChild.cloneNode(true) );
node.removeChild ( node.firstChild );
}
}
</script>
<select multiple="multiple" id="left"><option>item 0</option><option>item 1</option><option>item 2</option><option>item 3</option></select>
<input type="button" value="<" onclick="move_left()"/>
<input type="button" value="<<" onclick="move_all_left()"/>
<input type="button" value=">>" onclick="move_all_right()"/>
<input type="button" value=">" onclick="move_right()"/>
<select multiple="multiple" id="right"></select>
</body>
</html>
I've been struggling to upload files from Firebase Storage and encountering errors despite reading the documentation and various blogs on the topic. I'm looking for the most effective approach to resolve this issue. import { storage } from ' ...
I am in the process of creating a feedback application for a tablet using phonegap-android. The main page features a registration form, while the secondary page includes a star rating with six questions that the user needs to rate. I aim to store the resul ...
Review the script below. I'm currently testing it on Chrome. /*create a new set*/ var items = new Set() /*add an array by declaring its type as an array*/ var arr = [1,2,3,4]; items.add(arr); /*display items*/ console.log(items); // Set {[1, 2, 3, ...
Explore the common issues related to object iteration and queries outlined below. Presented here is a list of objects (used for managing a connection form): const connectionData = { mail: { value: false, isRequired: true }, password: { v ...
Hello, I am new to node.js so please bear with me if my question seems basic. The code I have written works fine, but I am struggling to match the name (url) that starts with http.get with the result obtained from the website. I came across a similar issu ...
I am attempting to combine an image (a background image for my graph) with my canvasJS chart. Once these elements have been merged on a canvas, I aim to obtain a DataURL of this canvas, enabling me to download an image of it (depicting the graph along wit ...
I'm struggling to grasp the concept of looping through an object in Handlebars and transferring information from one location to another. Here is a sample json file that I am attempting to read from. The file, named "testdata.json", contains: { &qu ...
I have been working on creating a custom Role-Permissions system that I want to set up during the initial root state resolve: $stateProvider .state('common', { resolve:{ user: function(AclService, UserService) { UserService. ...
Seeking advice on the most effective method for loading multiple models exported from Blender to JSON format. In the provided example below, I am utilizing the static_objects array containing predefined object data and model URLs. These URLs are then iter ...
Here is the input data provided: data = [ { name: "John Cena", groupName: "WWE" }, { name: "Nandini", groupName: null }, { name: "Rock", groupName: "WWE" }, { name: "Vinay", groupName: null }, { name: "Rey Mesterio", groupName: "WWE" ...
Currently studying JavaScript and I came up with a basic script to inquire about the number of hours you've put in at work. Following that, it will indicate whether you've reached the required threshold, along with displaying the previously enter ...
I am looking to create a test where I can check if my shallow enzyme wrapper includes the correct child element. For instance, when I have the given code and my specified wrapper, I want to execute a function like someFn() to retrieve the child elements wi ...
My React application has been running smoothly for a while, but recently all the npm commands in the package.JSON file have stopped working. { "name": "fitness-appication-frontend", "version": "0.1.0", "private": true, "dependencies": { "reac ...
Are you unsure about the distinctions between Grant and Passport.js? How do you decide when to utilize Grant over passport.js, and vice versa? If your goal is to create a social media platform that tracks user activities and posts them on a news feed, whi ...
<script> //AngularJS Code goes here var appVar = angular.module('listApp', ['ngRoute']); appVar.controller("controller1", function($scope){}); function FetchEmployeeData($scope, EmployeeList){ var reque ...
Currently, there is a dropdown menu on the site that shows an unordered list of links when hovered over. However, this hover functionality can be troublesome for users and I want to change it to either 'click' or 'toggle'. Below is the ...
I am currently developing a chat application using web API ASP.NET with C# in VS Code. The user registration and login functionalities are working seamlessly with the database. I have integrated the SignalR sample code into the Welcome page, but I have a s ...
I'm currently exploring ways to dynamically add a new collection every time a button is clicked. Here's the HTML snippet I have: html: <template name="tempName"> <button class="submitButton">Submit</button> </template&g ...
After successfully exporting an animation from Blender using the Three.js export utility and adding it to a Three.js scene, I encountered an issue when trying to position it manually. Here is the code snippet I am using for creating the mesh and animation ...
Here's a simple JavaScript function I have: function checkTime() { var current = new Date(); var target = new Date('April 10, 2017 12:11:00'); if (current < target) { $('#modalnew').modal('show'); } els ...