.net Core Fullcalendar 显示点

我们将 fullcalendar 与 .netcore-razor 页面一起使用。我们可以在日历中进行粗略的操作。我们有用户,他们拥有userColor:'#hex_color'. 所以我想在日历中为每种用户颜色添加点。

https://img2.mukewang.com/650bdf860001875010690457.jpg

这是日历

https://img1.mukewang.com/650bdf9500015ea111390853.jpg

这就是我想要的类型

https://img4.mukewang.com/650bdf9f00011c5a02570212.jpg

基本上我只想为每个事件添加点,点颜色=用户颜色


$.each(data, function(i, v) {

  console.log(v);

  events.push({

    id: v.id,

    title: v.subject,

    tooltitle: v.tool,

    description: v.description,

    start: moment(v.start),

    end: v.end != null ? moment(v.end) : null,

    color: v.themeColor,

    allDay: v.isFullDay,

    type: v.type,

    rate: v.rate,

    status: v.status,

    //HERE

    textColor: v.TextColor

  });

})


在创建日历时


$('#calender').fullCalendar({

  contentHeight: 1000,

  eventLimit: true,

  eventColor: '#394006',

  events: events,

  //...

或者我可以在控制器中制作它吗?我怎样才能在那里赋予风格


foreach (var user in item.Users)

                        {

                             

                          //var user = _userManager.FindByIdAsync(id).Result;

                //here's the data

                            usertxt +=  user.Name+" "+user.Surname + " ● ";

                            usertxt2 +=  user.Name+" "+user.Surname + " <br> ";

//New try is


var v = HttpUtility.HtmlDecode("<span style='background: Red; width:15px; height:15px; radius: 100 %;'></span> ");

 usertxt += user.Name + " " + user.Surname + v;

//变成开发者视图


    demo user1 <span style='background: Red; width:15px; height:15px; radius: 100 %;'></span> demo user2<span style='background: Red; width:15px; height:15px; radius: 100 %;'></span> 


//But now shows any dot beacuse edit as hmtl codes are

    <span class="fc-title">Demo user&lt;span style='background: Red;'&gt;●&lt;/span&gt; &lt;span style='background: Red;'&gt;●&lt;/span&gt; &lt;span style='background: Red;'&gt;●&lt;/span&gt; Demo &lt;span style='background: Red;'&gt;●&lt;/span&gt; </span>



< and > turns into lt, gt

最后 !!它以这种方式工作,但是当日期改变时。渲染不见了。如何让它重新渲染

梦里花落0921
浏览 85回答 1
1回答

慕田峪4524236

如果您的用户数据是事件对象的一部分,那么每个事件都有与其关联的用户列表以及应为它们使用什么颜色,这会更有意义。您可以将点附加到事件的标题区域,以避免将其放置在下一行。eventRender: function (event, element) {&nbsp; var title = $(element).find(".fc-title");&nbsp;&nbsp;&nbsp; event.users.forEach(function(user) {&nbsp; &nbsp; var span = document.createElement("span");&nbsp; &nbsp; span.style.color = user.color;&nbsp; &nbsp; span.innerHTML = "&nbsp;●";&nbsp; &nbsp; title.append(span);&nbsp; });}这是基于一个事件,该事件具有“users”属性作为其一部分,结构如下:users: [{ "color": "red" }, { "color": "blue" }]演示:https ://codepen.io/ADyson82/pen/MWjwBBJ?editable=true&editors=001
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript