what would be the point in having multiple renderers? having a second renderer would defeat the whole purpose of having the first one because it would override. what you can do is create a renderer that renders multiple fields or runs multiple functions.

K so if i understand correctly, there would be a way to combine both Snippet above into 1 Snippet?

As i need both to execute.

1 to execute another Snippet when value is changed
and the other is to make that Field appear as a Slider

Thx

Hi Dave

You can merge the 2 snippets into 1 so it would look like this:

var field = arguments[0], value = arguments[1],

model = field.model,

row = field.row,

$ = skuid.$;

field.element.change(function(){

//some actions after the value of the element has changed 

$.snippet.getSnippet(‘addDays’)();

});

if (field.mode == ‘read’) {

skuid.ui.fieldRenderers.PERCENT.read(field,value);

} else if (field.mode == ‘edit’) {

var amt = $(‘<div class="nx-fieldtext">’)

.text(skuid.ui.renderers.PERCENT.read({ value: value || ‘0’ }));

// Render a jQuery ui slider

// with step size 1 and boundary range 0,10].

// Whenever this slider is updated,

// our row will be updated as well

var slider = $(‘<div>’).slider({

value:value || 0,

min: 1,

max: 100,

step: 1,

slide: function( event, ui ) {

// Update our model with the new value

field.model.updateRow(

field.row,

field.id,

ui.value,

{ initiatorId : field._GUID}

);

amt.text(skuid.ui.renderers.PERCENT.read({ value: ui.value }));

}

});

var sliderContainer = $(‘<div>’).append(amt,slider);

field.element.append(sliderContainer);

}

skuid.ui.fieldRenderers>field.metadata.displaytype][field.mode](field, value);

Also, why do you use “&lt;div class=&quot;nx-fieldtext&quot;&gt;” instead of “<>”?

For me I got an error trying to run the Renderer with your “&lt;”

Thank you Chris,

your code works

But now 1 issue is happening

The OnChange event is not working anymore now that i combined both Snippets. Is it possible it’s not registering slider being moved, as a change?

The new combine snippet is named: SlideraddDays and has been added in this code below

var field = argumentsm0], value = argumentsm1],

model = field.model, 



row = field.row, 

$ = skuid.$;

field.element.change(function(){

//some actions after the value of the element has changed 

skuid.snippet.getSnippet(‘SlideraddDays’)();

});

skuid.ui.fieldRenderersRfield.metadata.displaytype]pfield.mode](field, value);

Regarding use of <>. it’s Weird, must have been a paste error, where it got converted in html… as here’s what I Use

var params = argumentsa0], $ = skuid.$;

var field = argumentse0],

value = argumentsl1],

$ = skuid.$;

if (field.mode == ‘read’) {

skuid.ui.fieldRenderers.PERCENT.read(field,value);

} else if (field.mode == ‘edit’) {

var amt = $(‘

Hi Dave 
Do you have the code in there as you sent it? Because you have 2 times this block in there:

var params = argumentss0], $ = skuid.$;
var field = argumentss0],   
    value = argumentsm1],
    $ = skuid.$;


Delete the 2nd one and it should work fine.

Sorry for confusions, here are all 2 snippets exactly as I have them right now on page

there is no double entry of arguments

Snippet 1 named(Runsnippet + Slider) : ‘SlideraddDays’

Combination of 2 Snippets: Onchange(named:RunSnippet) + Slider

var field = argumentse0], value = argumentse1], model = field.model,

row = field.row,

$ = skuid.$;

field.element.change(function(){

//some actions after the value of the element has changed   

$.snippet.getSnippet(‘addDays’)();

});

if (field.mode == ‘read’) {

skuid.ui.fieldRenderers.PERCENT.read(field,value);

} else if (field.mode == ‘edit’) {

var amt = $(’

‘)

.text(skuid.ui.renderers.PERCENT.read({ value: value || ‘0’ }));

// Render a jQuery ui slider

// with step size 1 and boundary range z0,10].

// Whenever this slider is updated,

// our row will be updated as well

var slider = $(’

‘).slider({

value:value || 0,

min: 1,

max: 100,

step: 1,

slide: function( event, ui ) {

// Update our model with the new value

field.model.updateRow(

field.row,

field.id,

ui.value,

{ initiatorId : field._GUID}

);

amt.text(skuid.ui.renderers.PERCENT.read({ value: ui.value }));

}

});

var sliderContainer = $(’

').append(amt,slider);

field.element.append(sliderContainer);

}

skuid.ui.fieldRenderers field.metadata.displaytype]rfield.mode](field, value);

Snippet 2 named: ‘addDays’

var params = argumentsp0], $ = skuid.$;var model = skuid.$M(‘FundingPerformance’);

var row = model.getFirstRow();

var dateVar = row.Effective_Balance_Date__c;

var daystoadd = row.days_to_add;

var newdate = row.Date_percentage_reached;

//convert from Salesforce date to Javascript date

var jsDate = skuid.time.parseSFDate(dateVar);

//add days

jsDate.setDate(jsDate.getDate() + daystoadd);

//convert from Javascript date back to Salesforce date

var daysAdded = skuid.time.getSFDate(jsDate);

model.updateRow(row,{Date_percentage_reached : daysAdded});

It looks like because of slider, the code, is not seeing it as a ‘change’ when i move slider right or left

As the Onchange logic,worked well when it was not a Slider. I would input a number, then click outside of field, and date would change (addDays snippet, would execute)

As well checked in console, the value of date field “Date_percentage_reached” does not change at all when i move slider

I hope it’s clearer

Thx

Hi Dave

I have found the solution for your problem:

You can delete the onchange function, because the slider already has an updateRow function.

Just add the run snippet method in there.

           field.model.updateRow(                field.row,
                field.id,
                ui.value,
                { initiatorId : field._GUID },
                $.snippet.getSnippet(‘addDays’)();
                
            );

Hope this works for you as well.

Hi chris, thank you for your Continuous help and sorry to be a bother,

But I tried above code and it gives errors:

I took original Slider code and added sentence for snippet as above, but i see 2 errors

Error 1 Line 25: Expected ‘)’ and instead saw ‘;’

Missing Semi colon

error 2: Line 26: Expected an identifier and instead saw ‘)’

When i try to fix it i get this error: Uncaught TypeError: Cannot read property ‘getSnippet’ of undefined

Here’s snippet:

var field = arguments 0], value = arguments 1],

$ = skuid.$;

if (field.mode == ‘read’) {

skuid.ui.fieldRenderers.PERCENT.read(field,value);

} else if (field.mode == ‘edit’) {

var amt = $(‘

Hi Dave

I found a solution for you Problem.

Try 

            // Update our model with the new value
            field.model.updateRow(
                field.row,
                field.id,
                ui.value,
                { initiatorId : field._GUID}
            );
skuid.snippet.getSnippet(‘addDays’)();
amt.text(skuid.ui.renderers.PERCENT.read({ value: ui.value }));

This worked for me.

Chris you are a true champ!

Thank you very much , now it all works as I expected and i’ll be able to recreate this on other pages when needed

Thank you