Using Jquery to populate hidden form field for Paypal integration.

Posted on 2012-08-13
Last Modified: 2016-03-24

I work fo a non-profit that runs a couple of therapeutic day schools for children with emotional and behavioral needs.

As part of our back to school appeal I've built a drag and drop shopping cart for a 'virtual school supply drive' that enables folks to place 'school supplies' into a 'backpack.' The jquery that I have allows for the drag and drop of the different items and updates the 'total.'

I would like to add to that script so that the value generated for the 'total' is also added into the code for a paypal button so that I can use that service to process monetary donations to our school program. What I want is for thew value of .total to be entered into the hidden amount field as the value so that paypal can process it.

Here's the jquery:

		var data = {"total":0,"rows":[]};
		var totalCost = 0;
					$(this).draggable('options').cursor = 'not-allowed';
					var name = $(source).find('p:eq(0)').html();
					var price = $(source).find('p:eq(1)').html();
					addProduct(name, parseFloat(price.split('$')[1]));
		function addProduct(name,price){
			function add(){
				for(var i=0; i<; i++){
					var row = data.rows[i];
					if ( == name){
						row.quantity += 1;
				} += 1;
			totalCost += price;
			$('#cartcontent').datagrid('loadData', data);
			$('div.cart #total').html('$'+totalCost);

Open in new window

Question by:jcourtice
    LVL 50

    Accepted Solution

    Is it not as simple as the following (comments inline)

    // After this line
    $('div.cart #total').html('$'+totalCost);
    // Where amount is the name of the paypal button?

    Open in new window


    Author Closing Comment

    Thank you so much. I'm more a designer than a developer so anything beyond manipulating existing code usually takes me about 10x longer than it should.
    LVL 50

    Expert Comment

    by:Julian Hansen
    No problem - any time. I work a lot with designers who don't want to code so familiar with how it works.

    Featured Post

    How your wiki can always stay up-to-date

    Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
    - Increase transparency
    - Onboard new hires faster
    - Access from mobile/offline

    Join & Write a Comment

    Suggested Solutions

    PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
    I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
    The viewer will learn how to dynamically set the form action using jQuery.
    The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

    734 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    24 Experts available now in Live!

    Get 1:1 Help Now