Drag & Drop render template

  • 1
  • Question
  • Updated 2 years ago
  • Answered
I have followed the instructions on this page to create a drag and drop queue. I wanted to display more data on the card but some of the data I want to conditionally show. I wrote an 'if' statement to do this and the correct info prints in the console but not on the template.

Basically if the deadline field has a value then show the value otherwise don't.

Can someone point out the error of my ways?

Thanks!

Altered Code:
var args = arguments[0],
    item = args.item,
    list = args.list,
    model = args.model,
    element = args.element,
    row = item.row,
    deadline = row.Custom_Field__c,

    
    renderTemplate = '{{{Name}}} <br />{{Amount}}<br />'
     if(deadline !== ""){
         "D:"+ deadline;
         console.log('Deadline' + deadline);
     } 
     else{
         null;
     }



Original Code:
  1. var args = arguments[0],<br>
  2. &nbsp; &nbsp; item = args.item,<br>
  3. &nbsp; &nbsp; list = args.list,<br>
  4. &nbsp; &nbsp; model = args.model,<br>
  5. &nbsp; &nbsp; element = args.element,<br>
  6. &nbsp; &nbsp; row = item.row,<br>
  7. &nbsp; &nbsp; renderTemplate = '{{{FirstName}}} {{{LastName}}} - {{{Company}}}',<br>
  8. &nbsp; &nbsp; mergeSettings = {<br>
  9. &nbsp; &nbsp; &nbsp; &nbsp; createFields: true,<br>
  10. &nbsp; &nbsp; &nbsp; &nbsp; registerFields: true<br>
  11. &nbsp; &nbsp; };<br>
  12. &nbsp; &nbsp; <br>
  13. element.html(<br>
  14. &nbsp; &nbsp; skuid.utils.merge('row',renderTemplate,mergeSettings,model,row)<br>
  15. );
Photo of Tami Lust

Tami Lust

  • 5,280 Points 5k badge 2x thumb

Posted 2 years ago

  • 1
Photo of Tami Lust

Tami Lust

  • 5,280 Points 5k badge 2x thumb
Can anyone see why this is printing in the console but not in the template?
Photo of Tami Lust

Tami Lust

  • 5,280 Points 5k badge 2x thumb
I figured this out. In case this can help anyone else.

var args = arguments[0],
    item = args.item,
    list = args.list,
    model = args.model,
    element = args.element,
    row = item.row;
    
    
    var deadline = row.Custom_Field__c;

    
    
     if(deadline !== undefined || 0){
         renderTemplate = '{{{Name}}} <br />{{Amount}}<br /> GD:{{{Custom_Field__c}}}';
         console.log('Deadline' + deadline);
     } 
     else{
        renderTemplate = '{{{Name}}} <br />{{Amount}}<br />';
     }

    mergeSettings = {
        createFields: true,
        registerFields: true
    },
    $ = skuid.$;
    
element.html(
    skuid.utils.merge('row',renderTemplate,mergeSettings,model,row)
).
draggable({
    revert: 'invalid',
    appendTo : 'body',
	helper : function() {
        var original = $(this);
        var helper = original.clone();
        // Pass along a reference to the current list's contents
        // so that we can compare lists
        // to ensure we're not allowing dropping on the current list
        original.data('listContents',list.contents);
		
		helper.css({
			'z-index' : 1000,
			'width' : $(this).css('width'),
			'height' : $(this).css('height'),
			'border' : '1px black solid',
			'padding' : '4px',
			'background-color' : '#EEE',
			'font-family': 'Arial,Helvetica,sans-serif',
			'cursor':'move'
		});
		
		return helper; 
	}
});
Photo of Karen Waldschmitt

Karen Waldschmitt, Official Rep

  • 8,220 Points 5k badge 2x thumb
Tami~

Glad you were able to figure it out!

Thanks for sharing what you learned with the community!
Karen