LuminateExtend for Designated Giving

Options
Are any of you using the luminateExtend by Noah Cooper to build your API forms? I have a working form that I'm trying to get Designated Giving set up on and I'm stuck. I have the Designees set up and I'm using the Single Gift Designation and the Flexible Sustainer Donation Level together to get a designated option, multiple giving levels, and a recurring option. The form processes correctly, but the designee information isn't going through. 


Here is the section that's set up for the designee dropdown. Any thoughts on where I'm going wrong?


Designate your gift:

<select name="designee.id">

  <option value="1001">Where Needed Most</option>

  <option value="1002">Krause Children's Center</option>

  <option value="1003">New Life Children's Center</option>

  <option value="1004">Foster In Texas</option>

  <option value="1005">BeREAL</option>

  <option value="1006">Adoption</option>

</select>
Tagged:

Comments

  • You must pass a combination of two parameters "designated.X.id" and "designated.X.amount" where the "X" part of the parameter names to identify ID and amount pairs.


    In your example, rename the dropdown field name to "designated.1.id" and as long as you have one designation, the second parameter will be "designated.1.amount" with the donation selected amount.
  • Romany Nassief:

    You must pass a combination of two parameters "designated.X.id" and "designated.X.amount" where the "X" part of the parameter names to identify ID and amount pairs.


    In your example, rename the dropdown field name to "designated.1.id" and as long as you have one designation, the second parameter will be "designated.1.amount" with the donation selected amount.

    Romany, thanks for your reply! Below is the code that I'm using for the giving levels, sustained giving option, and the dropdown for the designated giving. I'm pretty sure I understood where the 'designated.1.id' goes and I added that in. Since the giving levels already have a name="level_id", I'm not sure what you mean by "the second parameter will be 'designated.1.amount' with the donation selected amount. 


    <input class="radio" name="level_id" type="radio" value="2384" /><label>$500</label>

    <input class="radio" name="level_id" type="radio" value="2385" /><label>$250</label>

    <input class="radio" name="level_id" type="radio" value="2386" /><label>$100</label>

    <input class="radio" name="level_id" type="radio" value="2387" /><label>$25</label>

    <label><input id="level-other" class="radio" name="level_id" type="radio" value="2382" /> Other amount: </label>

    <input id="other-amount" class="form-control" style="width: 170px;" disabled="disabled" name="other_amount" type="text" /></span>


    <p style="margin-top: 6px;"><input id="sustaining_frequency" class="checkbox" name="sustaining.frequency" type="checkbox" value="monthly" /><label style="padding-left: 8px;"><strong>Make this a monthly gift.</strong></label></p>


    <p>Designate your gift: <select name="designated.1.id">

      <option value="1001">Where Needed Most</option>

      <option value="1002">Krause Children's Center</option>

      <option value="1003">New Life Children's Center</option>

      <option value="1004">Foster In Texas</option>

      <option value="1005">BeREAL</option>

      <option value="1006">Adoption</option>

    </select></p>


    <input name="method" type="hidden" value="donate" />

    <input name="form_id" type="hidden" value="1820" />

    <input name="validate" type="hidden" value="true" />

    <input name="sustaining.duration" type="hidden" value="0" />


    The rest of the code (not shown) is just used for the credit card info, name/address info, email signup, and submit button.  I hope I've made sense here. Thanks again for taking a look and pointing me in the right direction!

  • You will need to add designated.1.amount as a hidden field and then set its value equal to the donation amount.

    ======================

    1) Add this hidden field:
    <input name="designated.1.amount" type="hidden" value="" />



    2)  Add data-amount attribute to your donation levels:
    <input class="radio" name="level_id" type="radio" value="2384" data-amount="500"/><label>$500</label>

    <input class="radio" name="level_id" type="radio" value="2385" data-amount="250"/><label>$250</label>

    <input class="radio" name="level_id" type="radio" value="2386"data-amount="100" /><label>$100</label>

    <input class="radio" name="level_id" type="radio" value="2387" data-amount="25"/><label>$25</label>

    <label><input id="level-other" class="radio" name="level_id" type="radio" value="2382" data-amount="other"/> Other amount: </label>

    <input id="other-amount" class="form-control" style="width: 170px;" disabled="disabled" name="other_amount" type="text" /></span>



    3) Use the following jQuery script that listen on level change to set designated.1.amount value:
    $('input[name="level_id"]').change(function() {

                var currentValue = $(this).data('amount');

                if (currentValue !== 'other') {

                    $('#other-amount').attr('disabled', 'disabled').removeAttr('name').val('');

                    $('input[name="designated.1.amount"]').val(currentValue);

                } else {

                    $('#other-amount').removeAttr('disabled').attr('name', 'other_amount').focus();

                    $('input[name="designated.1.amount"]').val('');

                }

            });

            $('input[name="other_amount"]').bind("keyup change", function() {

                $('input[name="designated.1.amount"]').val(parseFloat($(this).val()));

            });

    ======================

    Please note: your shadow form should include either the Designated Giving Donation Level or Flexible Designated Giving Donation Level component.
  • Wow, that's a lot more effort than I was expecting! Thanks so much for your help!


    I'm not a Javascript guy (though I'm actively taking lessons now), but I think I understand all that you wrote and what it's doing. May I ask a question regarding your jQuery code that you wrote? The line: var currentValue = $(this).data('amount');, the data('amount') isn't familiar to me. I assume it's referencing the data-amount="500" we added to the gift levels, but the 'amount' doesn't seem to be referencing anything. I could be very wrong here, so let me know if I am :)


    At any rate, I added in all the changes and did a test donation. The donation went through but my reports did not show the designation went through, nor did the autoresponder reciept. When I first added the jQuery, I put it in at the top, but got an error. So I moved it to just about the hidden field we added with the rest of the hidden fields. Does it need to be in a specific spot for it to execute properly; could that be why it didn't go through?


    I'm also looking at the <select> code and wonder if something in there isn't right. 


    Anyway, thanks again for your help! I've been struggling with this for months but I feel like it's really close!
  • Solid posts Romany!


    Amount is the key to the data store on that input. Check out...


    https://api.jquery.com/data/#data2


    Edit: The mention of HTML5 data-* attribute is important. You can store lots of data on an html element using data-somekey="somevalue"


    <input class="radio" name="level_id" type="radio" value="2384" data-amount="500" data-level="gold" />
  • Brian Mucha:

    Solid posts Romany!


    Amount is the key to the data store on that input. Check out...


    https://api.jquery.com/data/#data2


    Edit: The mention of HTML5 data-* attribute is important. You can store lots of data on an html element using data-somekey="somevalue"


    <input class="radio" name="level_id" type="radio" value="2384" data-amount="500" data-level="gold" />

    Ahh, that makes sense now. Thanks for sharing the link to that. I'm getting there, slowly, but I'm getting there!

  • You can include this script inline before the form HTML by surrounding it with <script></script> and it will be changed a little to be like that:
    <script>

    $( document ).ready(function() {

    $('input[name="level_id"]').change(function() {

                var currentValue = $(this).data('amount');

                if (currentValue !== 'other') {

                    $('#other-amount').attr('disabled', 'disabled').removeAttr('name').val('');

                    $('input[name="designated.1.amount"]').val(currentValue);

                } else {

                    $('#other-amount').removeAttr('disabled').attr('name', 'other_amount').focus();

                    $('input[name="designated.1.amount"]').val('');

                }

            });

            $('input[name="other_amount"]').bind("keyup change", function() {

                $('input[name="designated.1.amount"]').val(parseFloat($(this).val()));

            });
    });

    </script>


     

    Chris, please edit your donation form from Luminate admin and navigate to Design Donor Screens > Edit Donation Form - make sure Designated Giving Donation Level added in the right pane.
  • Romany,


    Yes, I had wrapped it in the <script> tags already, but I added the other line as well just now. I have the script above the hidden fields. I tried below also. Neither option is working right still. Thanks again for all your support! Not sure where to go from here. 


    As far as the Data Element, we do have a company that helped us set up our Luminate in the first place and he said I can achieve the giving options I'm after with the 'Single Gift Designation' and the 'Flexible Sustainer Donation Level' elements. See below. Also, I just realized I never gave a link to the live giving form as reference. https://www.upbring.org/give-now-test/

    1f1a2d493d2d6bf0d80cde47a627f5f3-huge-gi

     
  • I just wanted to let you guys know that the form is working! Everything you suggested was correct and working the entire time. The API logs showed that the data was coming through correctly. The issue ended up being the data elements that were being used. For some reason, they didn't work properly. We switched them out with a different one and the designated info showed up in the reports.


    Thanks for all your help!
  • Chris Ayres:

    I just wanted to let you guys know that the form is working! Everything you suggested was correct and working the entire time. The API logs showed that the data was coming through correctly. The issue ended up being the data elements that were being used. For some reason, they didn't work properly. We switched them out with a different one and the designated info showed up in the reports.


    Thanks for all your help!

    Hello -

    Can someone confirm that the ghost form "Giving Pattern" has to be either the "Designated Giving Donation Level" or the "Flexible Designated Giving Donation Level" and not the "Standard Donation Level" in conjunction with the "Single Gift Designation" element?  We are hoping that there is an API solution that we have overlooked that will allow us to simply add the "Single Gift Designation" element to the ghost form without having to rework its Giving Pattern.

    Thanks much!
  • Daniel Krumm:

    Hello -

    Can someone confirm that the ghost form "Giving Pattern" has to be either the "Designated Giving Donation Level" or the "Flexible Designated Giving Donation Level" and not the "Standard Donation Level" in conjunction with the "Single Gift Designation" element?  We are hoping that there is an API solution that we have overlooked that will allow us to simply add the "Single Gift Designation" element to the ghost form without having to rework its Giving Pattern.

    Thanks much!
     

    Daniel, I believe we had the Standard Donation Level and the Single Gift Designation elements at first, and that didn't work for us. I'm currently using the "Designated Giving Donation Level" option. That allows us to have preset giving levels, and Other Amount level, and designated giving.


    It's supposed to have sustained giving as well, though I'm currently troubleshooting that since it's not working like I thought it was. Or maybe it is... I just posted about it this morning on this thread, if that interests you any.  https://community.blackbaud.com/forums/viewtopic/1/34112?post_id=127233#p127233  


    Our giving form is at upbring.org/give if you'd like to see what we have working under the "Designated Giving Donation Level" option.
  • Thanks for the response, Chris.  

    Have a great day!

    Dan Krumm
  • Romany Nassief:

    You must pass a combination of two parameters "designated.X.id" and "designated.X.amount" where the "X" part of the parameter names to identify ID and amount pairs.


    In your example, rename the dropdown field name to "designated.1.id" and as long as you have one designation, the second parameter will be "designated.1.amount" with the donation selected amount.

    Does this mean that the only option is to use the Designated Giving Donation Level as opposed to the single gift designation with the standard donation level option? 

  • "Does this mean that the only option is to use the Designated Giving Donation Level as opposed to the single gift designation with the standard donation level option? "


    Brandy, that's the way I understand it. It didn't work for me until I switched to the Designated Giving Donation Level. 
  • Thanks! I'd love to know if anyone from Blackbaud can say for sure before I have to go in and redo a stockpile of forms.
  • Brandy Reppy:

    Thanks! I'd love to know if anyone from Blackbaud can say for sure before I have to go in and redo a stockpile of forms.

    You will have to update the level unfortunately -- I just tested and confirmed that things don't work as expected if you use the Standard Donation Level and Single Gift Designation elements on your shadow form. If you process a donation to a form with the Standard Donation Level and Single Gift Designation using the designated.X.id and designated.X.amount parameters, the interaction shows that while the designee was recorded, the gift still is set to "Use my gift where it is needed most." This is because the API has no option for toggling from this option to a specific designee, as you can on the shadow form with a radio button.

  • Ugh - alright, thanks for letting me know.

Categories