Pass custom button function through model

Question

I'm trying to pass function from MVC model to fullcalendar CustomButton like so

var model = new CalendarViewModel()
{
    (...different properties of fullcalendar...)
    CustomButtons = new
    {
        CustomButton = new
        {
            Text = "Custom",
            Click = "function() { window.location.href = " + Url.Action("CustomView", "Custom") + "; }"     
        }
    },
    Header = new { Center = "title", Left = "prev,next customButton", Right = "month,agendaWeek,agendaDay,today" },
};

And then serialize and pass it to js file

function initFrom(calendarViewModel, rootUrl) {
        $('#calendar').fullCalendar(calendarViewModel);
}

However I get error customButtonProps.click.call is not a function which I belive is caused because I'm passing string from serialized model.

If my approach is incorrect how can I achieve desired result - passing routing values to custom button click function (without hardcoding route values inside js file)?

You can serialize the C# object to json. Example given [here](https://stackoverflow.com/questions/6201529/how-do-i-turn-a-c-sharp-object-into-a-json-string-in-net) — Mayank, Sep 06 '18 at 13:58
I'm sorry if this wasn't clear but I'm already serializing my model, and pass JSON object to JS, problem lies in JavaScript not recognizing passed click value as a function. — mr_cysio, Sep 07 '18 at 06:33

score 0 · Accepted Answer · answered Sep 07 '18 at 10:06

I found a workaround for this.

Based on this scheduler demo I've appended custom button in JS and retrieved values from passed model (with a slight changes in model which I'm omitting here):

$('.fc-toolbar .fc-left').append(
    $('<div class="fc-button-group"><button type="button" class="ui-button ui-state-default ui-corner-left ui-corner-right ui-state-hover">' + calendarViewModel.customButton.text + '</button></div>')
        .on('click', function () {
            location.href = calendarViewModel.customButton.url;
        })
);

Pass custom button function through model

1 Answers1