I'm trying to take all selected items from my "available_items" listbox, and move them to my "selected_items" listbox when I click on the "additems" button. My problem is my JS is behaving strangely. I have played with code for this and found I'm just having trouble getting anything to run right.
MANIFEST:
{
"manifest_version": 3,
"name": "example script",
"version": "0.1",
"description": "redacted",
"permissions": [],
"author": "Me",
"action": {
"default_popup": "pop.html",
"default_title": "redacted",
"default_icon": {
"16": "icon/icon16.png",
"48": "icon/icon48.png",
"128": "icon/icon128.png"
}
},
"icons": {
"16": "icon/icon16.png",
"48": "icon/icon48.png",
"128": "icon/icon128.png"
}
}
HTML:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="scripts/jquery-3.6.0.js"></script>
<script src="scripts/helper.js"></script>
</head>
<body>
<div id="header">
<img src="img/header.png" />
</div>
<hr>
<div id="item_selection">
<select Multiple Name="available_items" Size="10" class="listbox">
<option>Item #1</option>
<option>Item #2</option>
<option>Item #3</option>
<option>Item #4</option>
</select>
</div>
<div id="buttons">
<br><br><br>
<input type="button" id="additem" value="🠞" /> <br>
<input type="button" id="delitem" value="🠜" />
</div>
<div id="items_selected">
<select Multiple Name="selected_items" Size="10" class="listbox">
<option></option>
</select>
</div>
</body>
</html>
Javascript/Jquery: -- returns the alert, the dropdown seems empty.
$(document).ready(function() {
$('#additem').click(function() {
if ($("#available_items").find('option').length <= 1) {
alert("dropdownlist empty");
}
});
});
** Why is the dropdown list showing as empty?** If I take everything out of the document ready function and just do an alert, it works. I can alert the values from the buttons like $('#addclient').click(function(){ alert($(this).attr("value")); }); so I know my code can see the elements in DOM. If I do a console.log it does not do anything odd enough. Why?
Please help me to get past these questions so I can finish setting up the code to move items from one listbox to the other.
from Chrome Extension listbox issue
No comments:
Post a Comment