オブジェクトに使用可能な属性のみを表示するにはどうすればよいですか？

Question

eventRenderメソッドでは、fullcalendarから、レンダリングされるテキストでは、という利用可能なeventオブジェクトの属性のみを表示したいと考えています。

あなたは下記見ることができるように、それは属性がある場合eventオブジェクトのすべての属性を表示しようとするundefinedそれはundefinedをレンダリングします：

eventRender: function(event, element) { 

    $(element).qtip({ 

     style: { 
      classes: 'myStyle', 
      height: 150, 
      width: 300, 
      textAlign: 'center', 
     }, 

     content: { 
      title: event.room_id, 

      text: "description: " + event.description + "<br/>" + 
        "number: " + event.capacity + "<br/>" + 
        "Name: " + event.name + "<br/>" + 
        "Role: " + event.role + "<br/>" + 
        "Rank: " + event.sub_role + "<br/>" + 
        "Hours: " + event.hours + "<br/>", 
     } 
    }) 
} 

Answer 1

あなたはイベントプロパティを経由して構築することができますツールチップテキスト

https://jsfiddle.net/j9x06z7s/

$('#calendar').fullCalendar({ 
    events: [{ 
    start: moment(), // required, should not show in tip 
    title: "Required title event 1", // required, should not show in tip 
    room_id: "Room 1", 
    description: "Description for event 1", 
    capacity: 10, 
    name: "Name 1", 
    role: "Role event 1", 
    sub_role: "Rank event 1", 
    hours: 1, 
    }, { 
    start: moment().add(1, 'day'), // required, should not show in tip 
    title: "Required title event 2", // required, should not show in tip 
    room_id: "Room 2", 
    description: "Description for event 2", 
    //capacity: 20, // should not show in tip 
    name: "Name 2", 
    //role: "Role event 2", // should not show in tip 
    sub_role: "Rank event 2", 
    hours: 2, 
    }, { 
    start: moment().add(2, 'day'), // required, should not show in tip 
    title: "Required title event 3", // required, should not show in tip 
    room_id: "Room 3", 
    description: "Description for event 3", 
    capacity: 30, 
    name: "", // should not show in tip 
    role: undefined, // should not show in tip 
    sub_role: [], // should not show in tip 
    hours: 3, 
    }], 
    eventRender: function(event, element) { 
    $(element).qtip({ 
     style: { 
     classes: 'myStyle', 
     height: 150, 
     width: 300, 
     textAlign: 'center', 
     }, 
     content: { 
     title: event.room_id, 
     text: build_text(event) 
     } 
    }); 
    } 
}); 

function build_text(event) { 
    var text = ""; 
    // go through event properties 
    $.each(event, function(key, value) { 
    // is it a key we care about for tooltip? 
    if (["description", "capacity", "name", "role", "sub_role", "hours"].includes(key) 
     // does it have a value? 
     && (value != null && value != "")) { 
     text += key + ": " + value + "<br/>"; 
    } 
    }); 
    return text; 
}