FullCalendar with Mysql

Reply

None

0 Points

FullCalendar with Mysql

Jun 03, 2020 09:58 AM|klasss|LINK

Hi,

This is my first experience with ASP.NET .
I've done several small projects and now I want to do something a little bigger.

I try use FullCalendar with connect mysql.

I have in View -- index :

<script>

    //Jquery
    $(function () {
        CriarEventosCalendario();
    });

    function CriarEventosCalendario() {

        var events = [];

        events.push({
            'id': 1,
            'title': 'TESTE1',
            'start': '2020-05-20 00:00:00',
            'end': '2020-05-20 00:00:00',
            'allday': false,
            'color': '#FFFF00',
            'textColor': '#000000'
        });

        events.push({
            'id': 2,
            'title': 'TESTE2',
            'start': '2020-05-24 00:00:00',
            'end': '2020-05-25 00:00:00',
            'allday': false,
            'color': '#FFFF00',
            'textColor': '#000000'
        });

        var calendarEl = document.getElementById('calendar');

        var calendar = new FullCalendar.Calendar(calendarEl, {
            plugins: ['interaction', 'dayGrid'],
            header: {
                left: 'prevYear,prev,next,nextYear today',
                center: 'title',
                right: 'dayGridMonth, dayGridWeek, dayGridDay'
            },
            navlinks: true,
            editable: true,
            eventLimit: true,
            eventClick: function (evenObj) {

            },
            events: events
        });

        calendar.render();
    }

Model -- AgedaModel

 public class AgendaModel
    {
        [Display(Name = "Id")]
        public string Id { get; set; }

        [Display(Name = "Title")]
        public string Title { get; set; }

        [Display(Name = "Start")]
        public string Start { get; set; }

        [Display(Name = "End")]
        public string End { get; set; }

        [Display(Name = "AllDay")]
        public bool AllDay { get; set; }

        [Display(Name = "Color")]
        public string Color { get; set; }

        [Display(Name = "TextColor")]
        public string TextColor { get; set; }

    }

And Controller -- AgendaController

namespace ProjectoGlobal.Controllers
{
    public class AgendaController : Controller
    {

        public IActionResult Index()
        {
            return View();
        }

I need a little guidance for this little project of mine. I thank anyone who can explain to me

Reply

KathyW

Contributor

5501 Points

2247 Posts

Re: FullCalendar with Mysql

Jun 03, 2020 02:00 PM|KathyW|LINK

"I need a little guidance for this little project of mine. I thank anyone who can explain to me"

What guidance do you need? What is not working as expected in the code you are trying? What errors do you get?

Reply

klasss

None

0 Points

3 Posts

Re: FullCalendar with Mysql

Jun 03, 2020 04:03 PM|klasss|LINK

To show data in a table I used the following:

This to show in a table:

            FuncionarioModel item;
            DAL objDAL = new DAL();
            string sql = $"SELECT Id, Nome FROM funcionario where id ='{id}' ORDER BY Nome asc"; 
            DataTable dt = objDAL.RetDataTable(sql);
            
                item = new FuncionarioModel
                {
                    Id = dt.Rows[0]["Id"].ToString(),
                    Nome = dt.Rows[0]["Nome"].ToString()
                 }

              return item;

I tried something similar: (i know it's wrong. but I thought of something like that.)

just a way that I thought

            AgendaModel item;
            DAL objDAL = new DAL();
            string sql = $"SELECT Id, title, start, end, allday, color, textcolo FROM Agenda; 
            events dt = objDAL.RetDataTable(sql);
            
                item = new AgendaModel
                {
                    Id = dt.Rows[0]["Id"].ToString(),
                    Nome = dt.Rows[0]["Nome"].ToString()
                 }

              return item;

Reply

KathyW

Contributor

5501 Points

2247 Posts

Re: FullCalendar with Mysql

Jun 03, 2020 04:54 PM|KathyW|LINK

Start at the beginning. What are you trying to do? What is the full code you are trying? What does it do that you don't expect it to do?

Reply

mgebhard

All-Star

48181 Points

21164 Posts

Re: FullCalendar with Mysql

Jun 03, 2020 04:58 PM|mgebhard|LINK

There are many fully functional FullCalendar MVC examples on the internet. I recommend you start with a few examples to see how others have implemented the same. Below are a few but you can Google for more examples.

https://www.toshalinfotech.com/Blogs/ID/115/How-to-Integrate-Full-calendar-with-MVC-application

https://www.c-sharpcorner.com/article/asp-net-mvc5-full-calendar-jquery-plugin/

The main issue I see with your approach is you are using a DataTable. The DataTable is ASP.NET construct used to bind data to data bound server controls. The FullCalendar is a JavaScript/jQuery API that runs in the browser The data format is JSON. It is up to you to learn the FullCalendar API so you know what data to pass back and forth.