I have a chrome extension generator and it downloads multiple files. I want it to put all the files in a new folder instead of downloading them all into the downloads folder, and then upload to chrome. If there is a way, that would be great, but that might not work because it installs an extension automatically? Here is the code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Extension Maker</title>
</head>
<body>
<form>
<h1>Extension maker for chrome</h1>
<input id="name" size="22" placeholder="Extension name">
<br>
<input id="vers" size="22" placeholder="Version">
<br>
<textarea id="desc" placeholder="Description"></textarea>
<br><br><br>
<input type="checkbox" id="popup">Popup <input id="popup-html" placeholder="Popup html">
<br>
<input type="checkbox" id="urlo">Change contents of single page <input id="page-cont" placeholder="Page HTML">
<select id="select">
<option value="newtab">New Tab Page</option>
<option value="bookmarks">Bookmarks Page</option>
<option value="history">History Page</option>
</select>
<br>
<input type="checkbox" id="js">Run JavaScript <input id="js" placeholder="JS">
<br><br><br>
<button onclick="downloadAll()" id="downloadbutton">Download</button>
</form>
<script>
function download(filename, text) {
var element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
element.setAttribute('download', filename);
element.style.display = 'none';
document.body.appendChild(element);
element.click();
document.body.removeChild(element);
};
function downloadAll() {
var first = document.getElementById("popup").checked;
var second = document.getElementById("urlo").checked;
var third = document.getElementById("js").checked;
var name = document.getElementById("name").value;
var vers = document.getElementById("vers").value;
var desc = document.getElementById("desc").value;
var pophtml = document.getElementById("popup-html").value;
var manifeststart = "{ 'name': " + name + ", 'version': " + vers + ", 'description': " + desc + ", 'manifest_version': 2 ";
if (first === true) {
var manifest = manifeststart + "'default_popup': 'popup.html', 'default_icon': { '16': 'images/get_started16.png' } },}";
var text = document.getElementById("popup-html").value;
var filename = "popup.html";
download(filename, text);
};
if (second === true) {
var select = document.getElementById("select").value;
var text = document.getElementById("select").value;
var manifest = manifest + "'chrome_url_overrides' : { ' " + select + "': 'myPage.html' }";
var text = document.getElementById("page-cont").value;
var filename = "myPage.html";
download(filename, text);
};
if (third === true) {
var manifest = manifest + "'background': {'scripts': ['background.js'],'persistent': false }";
var text = document.getElementById("js").value;
var filename = "background.js";
download(filename, text);
};
var manifest = manifest + ", }";
var text = manifest;
var filename = "manifest.json";
download(filename, text);
};
</script>
</body>
</html>
(also please tell me if there is anything wrong with the code)
Is this possible? Thanks in advance!
Related
I want to re-generate user's input values onto textarea with specific format.
I've created input and 'select' with various 'options' inside as well as 'button' that triggers the function.
Can someone please tell me what I'm doing wrong here..?
<SCRIPT>
function myFunction() {
var finaL = document.getElementById("textArea").value;
var spacE = " | ";
var a = document.getElementById("input1").value;
var b = document.getElementById("input2").value;
var c = document.getElementById("selecT").value;
finaL = a + spacE + b + spacE + c;
}
</SCRIPT>
In your code your are getting the value of the textarea and storing it in final variable which is just a string. What you need to do is get the reference of the textarea in the final variable and then set the value.
Working Code:
function myFunction() {
var finaL = document.getElementById("textArea");
var spacE = " | ";
var a = document.getElementById("input1").value;
var b = document.getElementById("input2").value;
var c = document.getElementById("selecT").value;
finaL.value = a + spacE + b + spacE + c;
}
<label for="input1">Male</label>
<input name="input1" id="input1" /> <br>
<label for="input2">Input 3</label>
<input name="input2" id="input2" /> <br>
<label for="selecT">Input 3</label>
<select id="selecT">
<option value="Value 1">Value 1</option>
<option value="Value 2">Value 2</option>
<option value="Value 3">Value 3</option>
</select>
<br>
<button type="button" onclick="myFunction()">Copy</button>
<br>
<label>Result</label>
<textarea id="textArea"></textarea>
just update code to this
<SCRIPT>
function myFunction() {
var finaL = document.getElementById("textArea").value;
var spacE = " | ";
var a = document.getElementById("input1").value;
var b = document.getElementById("input2").value;
var c = document.getElementById("selecT").value;
document.getElementById("textArea").value = a + spacE + b + spacE + c;
}
</SCRIPT>
what i change is from this
value = a + spacE + b + spacE + c;
to this
document.getElementById("textArea").value = a + spacE + b + spacE + c;
Im working on this currency converting app and ufetching the API from https://exchangeratesapi.io/
The app works except it only fetches the api on refresh. Im using onload in body tag.
Any idea how can I make it work on first load without refreshing?
Thanks in advance
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>JS Bin</title>
<script type="text/javascript" src="indexCurrencyFirst.js" ></script>
<script type="text/javascript" src="indexCurrency.js" ></script>
<link rel="stylesheet" type="text/css" href="styleCurrency.css">
</head>
<body onload="convertCurrencyRight()" >
<nav>
<ul class="navbar">
<li id="logo"><img src="Assets/Logo_openCurren.svg"></li>
<li id="date">Fecha</li>
</ul>
</nav>
<div class="wrapper" >
<div id="containerFrom">
<input id="fromQuantity" type="number" value="1" onchange="convertCurrencyRight()" onkeyup="convertCurrencyRight()"/>
<select id="from" onchange="convertCurrencyRight()" onkeyup="convertCurrencyRight()">
</select>
</div>
<div id="arrow"><img src="Assets/Arrow.svg"> </div>
<div id="containerTo">
<input id="toQuantity" type="number" value="0" onchange="convertCurrencyLeft()" onkeyup="convertCurrencyLeft()"/>
<select id="to" onchange="convertCurrencyRight()" onkeyup="convertCurrencyRight()">
<option value="EUR" selected>EUR</option>
</select>
</div>
</div>
<div class="wrapper" >
<div id="containerCValues">
<p id="currentRateA"> 1 Eur = 0.89 Gbp </p>
<p id="currentRateB"> 1 Gbp = 1.12 Eur </p>
</div>
</div>
</body>
</html>
My JS files
Loaded in head indexCurrencyFirst
//fill the select options with the available currencies
fetch("https://api.exchangeratesapi.io/latest?base=")
.then((resp) => resp.json())
.then(function(data){
var allRates = data.rates;
var selectA = document.getElementById("from");
var selectB = document.getElementById("to");
allRates = Object.entries(allRates)
for(var i = 0; i < allRates.length; i++) {
var opt = allRates[i][0];
var el = document.createElement("option");
el.textContent = opt;
el.value = opt;
if(opt==="GBP"){
var selectedAtt=document.createAttribute("selected");
el.setAttributeNode(selectedAtt);
}
selectA.appendChild(el);
var la = document.createElement("option");
la.textContent = opt;
la.value = opt;
selectB.appendChild(la);
}
})
.catch(function(error) {
console.log(error);
});
and the functions which convert the rates
function convertCurrencyRight() {
var fromCurrency = document.getElementById("from").value;
var toCurrency = document.getElementById("to").value;
console.log(toCurrency);
fetch("https://api.exchangeratesapi.io/latest?base=" + fromCurrency)
.then((resp) => resp.json())
.then(function(data){
//if both currencies are the same return identical values
(fromCurrency===toCurrency) ?
(document.getElementById("toQuantity").value = document.getElementById("fromQuantity").value,
document.getElementById("currentRateA").textContent= "1 " + fromCurrency + " = " + "...",
document.getElementById("currentRateB").textContent= "")
:
//otherwise return the top value as the multiplication of top currency rate by the amount specied below
(document.getElementById("toQuantity").value = (data.rates[toCurrency]*document.getElementById("fromQuantity").value).toFixed(3),
//change the single amount values
document.getElementById("currentRateA").textContent= "1 " + fromCurrency + " = " + (data.rates[toCurrency]).toFixed(6) + " " + toCurrency,
document.getElementById("currentRateB").textContent= "1 " + toCurrency + " = " + (1/data.rates[toCurrency]).toFixed(6) + " " + fromCurrency)
//load the date of the current rates
var date = document.getElementById("date");
date.innerHTML = "LAST UPDATED " +
data.date.split("-").reverse().join("-");
})
.catch(function(error) {
console.log(error);
});
}
function convertCurrencyLeft() {
...
}
Any idea how to fix this. I tried using jQuery with document ready instead of onload with luck
I'd just get ride of the onload on your body tag and just go with Jquery $(document).ready() and put your call to `convertCurrencyRight() there. In my fiddle this appears to work fine.
$(document).ready(function() {
convertCurrencyRight();
});
Today I was working to script, when I wanted to test it, I could see that it didn't works correctly it show the value [object Object] and not the real value (It didn't change the value too). It shows: Click here for see the picture
Its necessary click on "Edit" near of Google or Yahoo. I want to show the correct value when I click "Edit" near Google and Edit it when I click edit. I tried to change the value Checked[Item] for Checker[Name] but it only shows undefined.
html:
<!DOCTYPE html>
<html>
<head>
<title>SSL Checker</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="js/script.js"></script>
<script type="text/javascript" src="js/json.json" charset="utf-8"></script>
</head>
<body onLoad="start()">
<div id="title">
<h1>SSL Checker</h1>
</div>
<div id="data">
<form action="javascript:void(0);" method="POST" onsubmit="SSL.Add()">
<input type="text" id="add-name" placeholder="Name"></input>
<input type="text" id="add-link" placeholder="Link"></input>
<input type="submit" value="Add">
</form>
<div id="edit" role="aria-hidden">
<form action="javascript:void(0);" method="POST" id="saveEdit">
<input type="text" id="edit-name">
<input type="submit" value="Edit" /> <a onclick="CloseInput()" aria-label="Close">✖</a>
</form>
</div>
<p id="counter"></p>
</div>
<div id="table">
<table style="overflow-x:auto;">
<tr>
<th>Sites:</th>
</tr>
<tbody id="urls">
</tbody>
</table>
</div>
</body>
</html>
js:
function start() {
var SSL = new function() {
//List urls to check
this.el = document.getElementById('urls');
this.Count = function(data) {
var el = document.getElementById('counter');
var name = 'url';
if (data) {
if (data > 1) {
name = 'urls';
}
el.innerHTML = 'There are:' + ' ' + data + ' ' + name;
} else {
el.innerHTML = 'No ' + name;
}
};
//Buttons configuration
this.FetchAll = function() {
var data = '';
if (Checker.length > 0) {
for (i = 0; i < Checker.length; i++) {
data += '<tr>';
data += '<td>' + Checker[i].name + '</td>';
data += '<td><button onclick="SSL.Edit(' + i + ')">Edit</button></td>';
data += '<td><button onclick="SSL.Delete(' + i + ')">Delete</button></td>';
data += '</tr>';
}
}
this.Count(Checker.length);
return this.el.innerHTML = data;
};
//Add name
this.Add = function() {
el = document.getElementById('add-name');
el1 = document.getElementById('add-link')
var url = el.value;
var url1 = el1.value;
if (url) {
if (url) Checker.push({
"name": url,
"url": url1
})
el.value = '';
this.FetchAll();
}
}
//Edit
this.Edit = function(item) {
var el = document.getElementById('edit-name');
el.value = Checker[item];
document.getElementById('edit').style.display = 'block';
self = this;
document.getElementById('saveEdit').onsubmit = function() {
var url = el.value;
if (url) {
self.Checker.splice(item, 1, name.trim());
self.FetchAll();
CloseInput();
}
}
};
//Delete
this.Delete = function(item) {
Checker.splice(item, 1);
this.FetchAll();
};
};
SSL.FetchAll();
function CloseInput() {
document.getElementById('edit').style.display = 'none';
}
window.CloseInput = CloseInput;
window.SSL = SSL;
}
json:
var Checker = [{
name:"Google",
url: "google.es",
},
{
name:"Yahoo",
url: "yahoo.com",
}
]
Add another input tag for each attribute of Checkers objects.
<input type="text" id="edit-name">
<input type="text" id="edit-url">
And set each input separately
var el = document.getElementById('edit-name');
el.value = Checker[item].name;
var el2 = document.getElementById('edit-url');
el2.value = Checker[item].url;
Working code:
var Checker = [{
name: "Google",
url: "google.es",
},
{
name: "Yahoo",
url: "yahoo.com",
}
]
document.getElementById('edit').style.display = 'none';
function start() {
var SSL = new function() {
//List urls to check
this.el = document.getElementById('urls');
this.Count = function(data) {
var el = document.getElementById('counter');
var name = 'url';
if (data) {
if (data > 1) {
name = 'urls';
}
el.innerHTML = 'There are:' + ' ' + data + ' ' + name;
} else {
el.innerHTML = 'No ' + name;
}
};
//Buttons configuration
this.FetchAll = function() {
var data = '';
if (Checker.length > 0) {
for (i = 0; i < Checker.length; i++) {
data += '<tr>';
data += '<td>' + Checker[i].name + '</td>';
data += '<td><button onclick="SSL.Edit(' + i + ')">Edit</button></td>';
data += '<td><button onclick="SSL.Delete(' + i + ')">Delete</button></td>';
data += '</tr>';
}
}
this.Count(Checker.length);
return this.el.innerHTML = data;
};
//Add name
this.Add = function() {
el = document.getElementById('add-name');
el1 = document.getElementById('add-link')
var url = el.value;
var url1 = el1.value;
if (url) {
if (url) Checker.push({
"name": url,
"url": url1
})
el.value = '';
this.FetchAll();
}
}
//Edit
this.Edit = function(item) {
var el = document.getElementById('edit-name');
el.value = Checker[item].name;
var el2 = document.getElementById('edit-url');
el2.value = Checker[item].url;
document.getElementById('edit').style.display = 'block';
self = this;
document.getElementById('saveEdit').onsubmit = function() {
var url = el2.value;
var name = el.value;
if (url && name) {
Checker[item].name = name;
Checker[item].url = url;
self.FetchAll();
CloseInput();
}
}
};
//Delete
this.Delete = function(item) {
Checker.splice(item, 1);
this.FetchAll();
};
};
SSL.FetchAll();
function CloseInput() {
document.getElementById('edit').style.display = 'none';
}
window.CloseInput = CloseInput;
window.SSL = SSL;
}
<html>
<head>
<title>SSL Checker</title>
</head>
<body onLoad="start()">
<div id="title">
<h1>SSL Checker</h1>
</div>
<div id="data">
<form action="javascript:void(0);" method="POST" onsubmit="SSL.Add()">
<input type="text" id="add-name" placeholder="Name"></input>
<input type="text" id="add-link" placeholder="Link"></input>
<input type="submit" value="Add">
</form>
<div id="edit" role="aria-hidden">
<form action="javascript:void(0);" method="POST" id="saveEdit">
<input type="text" id="edit-name">
<input type="text" id="edit-url">
<input type="submit" value="Edit" /> <a onclick="CloseInput()" aria-label="Close">✖</a>
</form>
</div>
<p id="counter"></p>
</div>
<div id="table">
<table style="overflow-x:auto;">
<tr>
<th>Sites:</th>
</tr>
<tbody id="urls">
</tbody>
</table>
</div>
</body>
</html>
You are getting correct output with [object Object], because Object.toString() returns exactly [object Object].
To represent your object in a custom format you can change the part of your SSL.Edit() method where you do el.value = Checker[item] to something like
el.value = Checker[item].name; // To show the name
el.value = Checker[item].url; // To show the url
el.value = Checker[item].url + ' ' + Checker[item].url; // To show both
I'm writing a code where users can input any text and choose any letter to see how many times it occurred in that particular text - I'm not sure where I'm going wrong
function textOccurrences() {
var inputField1 = (document.getElementById("inputField1").value);
var inputField2 = (document.getElementById("inputField2").value);
var count = 0;
for (i = 0; i < length; i++) {
if (parseInt(search) != -1) {
count++;
var search = inputField1.indexOf(inputField2, parseInt(search) + 1);
}
document.getElementId("answer").value = inputField2 + "Occurs" + count + "times";
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> Text Occurrences </title>
<h1> Number of Character Occurrences</h1>
<script="text/javascript"> </script>
</head>
<body>
<form>
<p>Enter text: </p>
<p> <input id="inputField1" type="text" /> </p>
<p>Enter any character:</p>
<p> <input id="inputField2" type="text" /> </p>
<input type="button" value="Search" onlick="textOccurrences()" />
</p>
<p>Number of Occurrences:</p>
<p><textarea id="answer"></textarea></p>
</form>
</body>
</html>
Try this as your function.
function textOccurrences() {
var inputField1 = (document.getElementById("inputField1").value);
var inputField2 = (document.getElementById("inputField2").value);
var count = inputField1.split(inputField2).length - 1;
document.getElementId("answer").value = inputField2 + "Occurs" + count + "times";
}
You can use a regular expression:
function textOccurrences() {
var inputField1 = (document.getElementById("inputField1").value);
var inputField2 = (document.getElementById("inputField2").value);
var re = new RegExp(inputField2, "g");
var count = inputField1.match(re).length;
document.getElementById("answer").value = inputField2 + " Occurs " + count + " times";
}
Note that in your code, you have said getElementId instead of getElementById, also contributing to the error.
function textOccurrences() {
var inputField1 = (document.getElementById("inputField1").value);
var inputField2 = (document.getElementById("inputField2").value);
var reg = new RegExp(inputField2,'g');
document.getElementById("answer").value = inputField2 + "Occurs" + inputField1.match(reg).length +
"times";
}
You can try something like this
you can use regex to match any occurence of you chosen letter and then count those matches and you have to syntax errors in your html and javascript
-it is onclick NOT onlick
-and it is getElementById NOT getElementId
here is you code after editing
Javascript
function textOccurrences() {
var inputField1 = (document.getElementById("inputField1").value);
var inputField2 = (document.getElementById("inputField2").value);
console.log("hekasdlkjasd");
var re = new RegExp(inputField2, "g");
var count = inputField1.match(re).length;
document.getElementById("answer").value = inputField2 + " Occurs " + count + " times";
}
Html
<!DOCTYPE html>
<html>
<head>
<title> Text Occurrences </title>
<h1> Number of Character Occurrences</h1>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
<form>
<p>Enter text: </p>
<p> <input id="inputField1" type="text" /> </p>
<p>Enter any character:</p>
<p> <input id="inputField2" type="text" /> </p>
<input type="button" value="Search" onclick="textOccurrences();" />
</p>
<p>Number of Occurrences:</p>
<p><textarea id="answer"></textarea></p>
</form>
</body>
</html>
I am trying to get id of x to change the value of a and print both values to .xls. I got part of it working properly (x will modify a) but it will not print to .xls properly. (says [object] instead of the value of variable x in the spreadsheet. Any help would be appreciated
<html>
<head>
<title>TEST</title>
<HTA:APPLICATION id="Test"
applicationName"Test"
caption="yes"
maximizeButton="no"
minimizeButton="no"
showInTaskbar="yes"
navigable="no"
singleInstance="yes"
scroll="no"
scrollFlat="yes" />
</HTA:APPLICATION>
</head>
<body>
<form id="TEST">
<h1>TEST</h1>
<input type="text" onblur="x1()" maxlength="2" id="X" />X <input type="text" maxlength="2" value="0" id="a" />a <br />
</form>
<script>
var fso = new ActiveXObject("Scripting.FileSystemObject");
var c = fso.CreateTextfile("z.xls",true);
c.WriteLine("X a");
c.close();
function x1() {
var X = document.getElementById("X");
var a = document.getElementById("a");
if (X.value == 1) {
a.value++;
var fso = new ActiveXObject("Scripting.FileSystemObject");
var c = fso.OpenTextfile("z.xls",8,true);
c.Writeline("" + X + " " + a + "");
c.close();
} else {
if (X.value == 2) {
a.value--;
var fso = new ActiveXObject("Scripting.FileSystemObject");
var c = fso.OpenTextfile("z.xls",8,true);
c.Writeline("" + X + " " + a + "");
c.close();
}
}
}
</script>
</body>
</html>
X and a points to an input tags. You need to get the value property.
(Just like you did in the line: if (X.value== 1) {)
Replace
c.Writeline(""+X+" "+a+"");
To
c.Writeline(""+X.value+" "+a.value+"");