I'm trying to add a checkbox to my form which copies billing details from the form to shipping details, but my function isn't working.
This is what I have so far:
function fillShipping(f) {
var billing = document.forms["billing"];
var shipping = document.forms["shipping"];
if (document.getElementById("checkshipping").checked)
{
f.title.value = f.title.value;
f.firstname.value = f.firstname.value;
f.email.value = f.email.value
f.phone.value = f.phone.value
f.Address1.value = f.Address1.value
f.Address2.value = f.Address2.value
f.city.value = f.city.value
f.postcode.value = f.postcode.value
f.country.value = f.country.value
}
Can anyone point out where I'm going wrong?
You probably meant
shipping.title.value = billing.title.value;
Instead of
f.title.value = f.title.value;
if you are getting the forms and putting them into vars why are you passing in f? why not billing.email.value = shipping.email.value? Also how are you calling this function?
Related
Hello I am trying to make my jquery code in working order but its not working at all, I don't know whats a problem behind it but it contains multiple text boxes in multiple rows, each row calculates its own sum
Here is Fiddle link
Here is my Code
$(document).ready(function(){
$('.employee input[type="text"]').keyup(function() {
var basic_salary = parseInt($('input[name^=txtMonthlyRate]').val());
var advance_salary = parseInt($('input[name^=txtAdvance]').val());
var recover_comm = parseInt($('input[name^=txtRecovery]').val());
var sales_comm = parseInt($('input[name^=txtSales]').val());
var deduction_salary = parseInt($('input[name^=txtDeduction]').val());
var adjustment_salary = parseInt($('input[name^=txtAdjustment]').val());
var total_sum = ((basic_salary+recover_comm+sales_comm) - (deduction_salary + advance_salary)) + adjustment_salary;
$('input[name^=txtTotal]').val(total_sum);
console.log(total_sum)
);
});
The txtSales1, txtDeduction1, txtAdjustment1 variables are camel cased in your javascript, but not on the html input name. So these return NaN.
UPDATE Also, you need to set the context of what you're referring to using the second parameter of a selector function:
$('.employee input[type="text"]').keyup(function(e) {
var $scope = $(this).closest('.employee');
var basic_salary = parseInt($('input[name^=txtMonthlyRate]', $scope).val());
var advance_salary = parseInt($('input[name^=txtAdvance]', $scope).val());
var recover_comm = parseInt($('input[name^=txtRecovery]', $scope).val());
var sales_comm = parseInt($('input[name^=txtSales]', $scope).val());
var deduction_salary = parseInt($('input[name^=txtDeduction]', $scope).val());
var adjustment_salary = parseInt($('input[name^=txtAdjustment]', $scope).val());
var total_sum = ((basic_salary+recover_comm+sales_comm) - (deduction_salary + advance_salary)) + adjustment_salary;
$('input[name^=txtTotal]', $scope).val(total_sum);
});
The txttotal1 needs to be changed to txtTotal1
The fiddle needs a closing }
I would like to ask a question about creating an HTML form through JavaScript, populating data in it(including file types) and submitting it right after.
I somehow managed to have three different forms in a page and I need to concurrently submit them all together and open the new page where I submit my data. Because we cannot have nested forms in a page, I found out that I can create a new form through JavaScript, copy the data in the new created form and then send them. So far so good(if I only had text data), but I also need to copy(and send) a file(image) type and there is where something seems to not work.
Below I'm providing the JavaScript code only, mentioning the important point where I believe the problem is:
function viewpreview(){
Elements = new Array();
counter =0;
$('input[name="ElementValues[]"]').each(function() {
Elements[counter]=$(this).val();
counter+=1;
});
Title = $('#Title').val();
Picture = $('#Picture').val();
EditorText = $('#editor1').val();
var theForm, newInput1, newInput2, newInput3, newInput4;
theForm = document.createElement('form');
theForm.action = 'preview.php';
theForm.method = 'post';
theForm.enctype ='multipart/form-data';
theForm.target = '_blank';
newInput1 = document.createElement('input');
newInput1.type = 'hidden';
newInput1.name = 'Elements[]';
newInput1.value = Elements;
newInput2 = document.createElement('input');
newInput2.type = 'hidden';
newInput2.name = 'Title';
newInput2.value = Title;
newInput3 = document.createElement('input');
newInput3.type = 'file'; // <-- Important point here. If I make it a 'hidden' input type, it sends only the text-name of the file. If I make it a 'file' type, it does not work at all.
newInput3.name = 'Picture';
newInput3.value = Picture;
newInput4 = document.createElement('input');
newInput4.type = 'hidden';
newInput4.name = 'EditorText';
newInput4.value = EditorText;
theForm.appendChild(newInput1);
theForm.appendChild(newInput2);
theForm.appendChild(newInput3);
theForm.appendChild(newInput4);
document.getElementById('hidden_form_container').appendChild(theForm);
theForm.submit();
}
Is there someone who have dealt with that issue before or is able to find a solution to this?
If necessary, I can also accept a new workaround to this, as far as we can keep the 3 forms in the page.
Thank you very much in advance.
I am using Google Scripts UiApp in order to gather availability information. I want to send this information to a spreadsheet. I have used the example here: http://www.googleappsscript.org/advanced-examples/insert-data-in-sheet-using-ui-forms
to get me started in the right direction.
The Web App looks good and when clicking submit, the appropriate message displays. However, the values that are transferred to the spreadsheet say "undefined" for all of the entries.
How can I convince it to link the textbox entered data to the variables so that I can transfer to the spreadsheet?
Thanks!!
Here is some code:
var submissioSSKey = // Key removed
function doGet() {
var rows = 15
var columns = 15
var mygrid = UiApp.createApplication().setTitle("MLC Walk Ins Scheduling")
var panel = mygrid.createSimplePanel();
// Define the grid layout
var grid = mygrid.createGrid(rows, columns).setCellPadding(2).setCellSpacing(8)
// Create the text at the top
var Title = mygrid.createLabel("Walk-In Scheduling")
grid.setWidget(1, 1, Title)
(snip) - creating various checkboxes and textboxes
var text1 = mygrid.createTextBox().setName('name1')
grid.setWidget(3,9,text1)
var text6 = mygrid.createTextBox().setName('message1')
grid.setWidget(4,9,text6)
// Create the "submit" button
var submit_button = mygrid.createButton("Submit")
grid.setWidget(12,9,submit_button)
var infoLabel = mygrid.createLabel('Availability inserted successfully.').setVisible(false).setId('info');
grid.setWidget(13,9,infoLabel)
var handler = mygrid.createServerClickHandler('insertInSS');
handler.addCallbackElement(panel);
submit_button.addClickHandler(handler);
panel.add(grid);
mygrid.add(panel);
mygrid.add(grid);
return mygrid
}
Then the function call for the button:
//Function to insert data in the sheet on clicking the submit button
function insertInSS(e){
var mygrid = UiApp.getActiveApplication()
var name1 = e.parameter.name1
var message1 = e.parameter.message1
mygrid.getElementById('info').setVisible(true).setStyleAttribute('color','blue')
var sheet = SpreadsheetApp.openById(submissioSSKey).getActiveSheet()
var lastRow = sheet.getLastRow()
var targetRange = sheet.getRange(lastRow+1, 1, 1, 2).setValues([[name1,message1]])
return mygrid
}
Ahh! A simple fix for a big headache.
I had an extra line:
mygrid.add(grid);
that was breaking it.
i
HTML
<div id="notApprovedUsers">
</div><button onclick="approveUsers()">Approve</button>
</div>
i like to get checked users in parameter userList to work with.
here is javascript there me generating list with users and checkboxes.
i like to approve just the checked one's of course!
JavaScript
function getNotAssignedUsers() {
server.getUsersByGroup("1eb33e30-c355-467f-af3c-e7d0b4a1fgt5").then(function (userDetails) {
debugger;
for (var i = 0; i < userDetails.length; i++)
{
var vorname = userDetails[i].firstName;
var nachname = userDetails[i].lastName;
var newCheckBox = document.createElement('input');
newCheckBox.type = 'checkbox';
newCheckBox.id = "0"+i;
document.getElementById("notApprovedUsers").appendChild(newCheckBox);
var newElement = document.createElement('div');
newElement.id = i;
newElement.className = "notApprovedUsers";
newElement.innerHTML = vorname + " " + nachname;
document.getElementById("notApprovedUsers").appendChild(newElement);
}
});
}
HERE in userList I need to read just a checked users..
function approveUsers(userList)
{
var user1 = document.getElementById("00").checked;
var user2 = document.getElementById("01").checked;
var user3 = document.getElementById("02").checked;
alert(user1 || user2 || user3);
}
You want something like this then. There may be errors as I havent tested
var names = [];
$('input[type=checkbox]:checked').each(function(index, value){
var name = $(value).next("div").html();
names.push(name);
});
Then do something with the names array
Edit - See jsfiddle http://jsfiddle.net/vpg3r/3/
I think the best solution for you here is to use jQuery. You can use something like:
$('#notApprovedUsers input[type=checkbox]:checked')
to get all the elements that are checked, and work with them.
I've created a JSFiddle for you to demonstrate how to implement the behavior that I'm describing. You can see it in this link.
Ho can I can I create a textbox with javascript and then onclick, pass a function with argument? below the commented out line is the problem
var inputBox = document.createElement("input");
inputBox.staff = project.staff[j].name;
inputBox.defaultValue = inputBox.staff;
inputBox.onchange = changeHours;
//inputBox.onclick = selectText(this);
inputBox.onclick=function(argument){
selectText(this);
};
Try
inputBox.onclick=function(){selectText(this)};
http://www.w3schools.com/jsref/event_onclick.asp
Just set onclick with the function that you want.
var inputBox = document.createElement("input");
inputBox.staff = project.staff[j].name;
inputBox.defaultValue = inputBox.staff;
inputBox.onchange = changeHours;
inputBox.onclick = function() {
selectText(this);
};