Might I suggest using a type="button" instead of type="submit" for your form? that way you can perform a loop before the form is submitted, then you can document.forms["paypal"].submit(). Of course, you would need to include a <noscript> submit button.
When you create your loop, you need to figure out a way to determine which check box gets which option names. Once you have that figured out (look at my suggestion below the code), change your submit button type to "button" and give it the even onclick="submitForm()". Then define this function in your head. Note that the ????????? needs to be figured out:
Code:
function submitForm(){
_formInputs=document.getElementsByTagName('inputs');
_checkboxes=[];
for(i=0;i<_formInputs.length;i++){
if(_formInputs[i].type=='checkbox') _checkBoxes.push(_formInputs[i]);
}
for(i=o;i<_checkboxes.length;i++){
if(_checkboxes[i].checked) {
optionName=????????????????; //I don't know how you'll determine this part.
optionChoice=_checkboxes[i].parentNode.getElementsByTagName('label')[0].value;
newPPoption(document.forms["paypal"],optionName,optionChoice);
}
}
document.forms["paypal"].submit();
}
In order to decide the value of optionName, I might suggest using class="Photo_Manipulation" (depending on the group it's in, of course) and use optionName=_checkboxes[i].getAttribute("class"). But don't actually define those classes in the stylesheet. Does that make sense?
Actually, instead of changing the submit button type, it might be better to call this function during validation in the validateForm() function.
BTW, thanks for the offer! I enjoy doing stuff like this, because I love problem solving, so you don't owe me anything I'm actually a graphic designer in addition to being a programmer anyway, so I've got mad photoshop skills haha
Last edited by jamesbcox1980; 11-11-2009 at 11:05 AM.
I like Crockford. He's definitely a giant who's shoulders we stand on.
I have gone over it, and I think my last suggestion would be the best way to go. Just use class="xxxx" as a group identifier.
1. Simply find each checkbox related to options, and, in the tag and after the name="......", add class="Photo_Manipulation" or whatever group corresponds to that check box. Make sense?
2. Once you've done that, open the ZIP file I attached below and get "valid.js" from it and upload it to your server to replace the current one. I've also included a backup of the original ("valid.js.bkp"-- just remove the ".bkp" to restore it).
INFO:I added the function above to the valid.js file so that it runs during the other function, "validateForm()". I also changed the name to addFormOptions() and removed the form.submit() line.
Does all that make sense? I hope I have not convoluted the instructions too much!
update - only shows Add object or person and not what I selected
Hi James
I'm glad you like Crockford. I just finished watching the first of his 4 videos.
Ok this is what I did so far:
I unzipped and uploaded your valid.js (cheers for that buddy)
I found each checkbox related to the first package (options), and, in the tag and after the name="......", added class="Photo_Manipulation" - then uploaded the html file
When I hit submit, it only shows: Add object or person followed by the total amount.
James, notice the last two lines on my html file at the beginning of the form:
PayPal cannot process this transaction because of a problem with the seller's website. Please contact the seller directly to resolve this problem.
By the way I removed the JavaScript code from the head and the one after the form which you suggested earlier.
Are you able to check the html page and see where I'm going wrong in the form? Could be that I'm using cart instead of button? Beats me.
To those who are reading besides James:
If you know where I need to correct the lines (either in the html form or JavaScript) kindly let me know your thoughts too.
Haha I think I found the problem.... brain-fart on my part :P Let me give you the new version. Sorry about that, I should have been more careful. I also noticed that not ALL of the checkboxes had a class with their corresponding group name, so you'll need to look at those too.
It was just I did something to try to get the "value" of the input's label. I'm not sure why I did that... I guess because I had been looking at so many inputs. Anyway, there is no "value" for a label, so I had to change it to get the text on the inside of the label using innerText and textContent.
Last edited by jamesbcox1980; 11-12-2009 at 09:58 AM.
Still not working, huh? I'm getting an error that says "fileUploadEl is null". This is something that occurs before my script is being called. It's looking for an element with the ID "ctl00_ctl00_cphMain_cphInsideMain_fileUploadN" + x, but I can't find one in the HTML anywhere. Are you sure you have not removed a file upload form?
Yes I did remove the upload part but now I put it back in the HTML form so you won't get the error. Reason why I removed the image upload section is because the form details are supposed to go to PayPal for customer to pay, but if the customer do upload their images before paying, it won't come to me via PayPal as they wouldn't receive images then pass it to me. That is why I was thinking of removing the upload section from the HTML and JavaScript, let the customer make a payment, and when payment is successful, will get them to a "payment success" page where they can upload images.
But there's a bigger problem than that. If you fill out the form and hit submit, you will see the same one line that keeps coming up on PayPal:
Notice the last two lines. If I remove them, then paypal shows error. If I keep them, then "Add object or person" is the only option that is shown. What to do ?
Rafi
Last edited by rafiakbar; 11-12-2009 at 10:32 AM.
Reason: Grammar mistake
When I selected 6 add-ons from the first package "Photo Manipulation", on Paypal it now shows 2 separate rows of items. Good news is at least it shows 2 whereas before it used to be only 1. Progress!!! I think we're getting close. Almost time to go home and check out the rest of Crockford videos...
Bookmarks