完全なカレンダーは、私は、ユーザーがfullcalendar</p> <p>の黒い部分をクリックしたときに、これは、ユーザーがポップアップするようだ代わりにpromotボックスのフォームに必要事項を記入できるようにすることができますどのように思っていないpromot

Question

アム経由してイベントを追加します基本的に私がこれまで行ってきたこと。あなたが見ることができるように、私はそれが動作しているPHPページにデータを送信しているが、私はプロンプトボックスに満足していないだけでなく、彼らは同様にノートを追加することができる素敵なフォームになりたい。

select: function(start, end, allDay) { 
        var title = prompt('Event Title:'); 
         if (title) { 
          calendar.fullCalendar('renderEvent', 
           { 
            title: title, 
            start: start, 
            end: end, 
            allDay: allDay, 

           }, 
           true // make the event "stick" 
          ); 
          year = new Date(start).getFullYear(); 
          month = new Date(start).getMonth()+1; 
          month = ((month < 10) ? '0' : '') + month; 

          day = ((new Date(start).getDate() < 10) ? '0' : '') + new Date(start).getDate(); 

          hours = ((new Date(start).getHours() < 10) ? '0' : '') + new Date(start).getHours(); 

          min = ((new Date(start).getMinutes() < 10) ? '0' : '') + new Date(start).getMinutes(); 

          sec = ((new Date(start).getSeconds() < 10) ? '0' : '') + new Date(start).getSeconds(); 

          start = year + '-' + month + '-' + day +' '+hours+':'+min+':'+sec; 

          year = new Date(end).getFullYear(); 
          month = new Date(end).getMonth()+1; 
          month = ((month < 10) ? '0' : '') + month; 

          day = ((new Date(end).getDate() < 10) ? '0' : '') + new Date(end).getDate(); 

          hours = ((new Date(end).getHours() < 10) ? '0' : '') + new Date(end).getHours(); 

          min = ((new Date(end).getMinutes() < 10) ? '0' : '') + new Date(end).getMinutes(); 

          sec = ((new Date(end).getSeconds() < 10) ? '0' : '') + new Date(end).getSeconds(); 

          end = year + '-' + month + '-' + day +' '+hours+':'+min+':'+sec; 
          //alert(start+' - '+end); 

          $.get("system/classes/core.php?task=calendar&q=addnew&userid="+userid+"&title="+title+"&start="+start+"&end="+end+"&allDay="+allDay, function(data) { 
           alert(title + ' was created for '+ start +' '+ end); 
          }); 
         } 
          calendar.fullCalendar('unselect'); 
       }, 

Answer 1

まず、タイトルとその他の提出するフォームを作成する必要があります。その後、隠しdivにラップします。同様に...（簡単な例）

<div class="popup" style="display:none; position:fixed; top:25%; left:25%; background-color:white;"> 
    <input class"title" type="text" size="26" /> 
    <a href="#" onclick="return false" class="submitFrom">submit</a>&emsp; 
    <a href="#" onclick="return false" class="exit">cancel</a> 
</div> 

選択するたびに.show（）という非表示のdivが表示されます。フォームに記入し、そのフォームのsubmit.click（）を送信すると、情報を送信してdivを再度非表示にします。

select: function(start, end, allDay){ 
    $(".popup").show(); 
    var start = Date.parse(start)/1000; 
    var end = Date.parse(end)/1000; 
    var allDay = allDay; 
    var wipit = // create a session id such as a random number that can be cleared later to prevent double submissio 

    $(".submitForm").click(function(){ 
    var title = $(".title").val(); 

    if(title){ 
    $.post("/*page name*/", {title: title, start:start, end:end, allDay:allDay}, function(){ 
     $(".title").val("") 
     title = ""; 
     wipit = ""; 
     start = ''; 
     end = ''; 
     allDay = ''; 
     calendar.fullCalendar('unselect'); 
     calendar.fullCalendar('refetchEvents'); 
    }); 
    } else { 
    // clear all information, unselect events, and alert that a title needs to be entered 
    } 
    $(".popup").hide(); 
    }); 

    $(".exit").click(function(){ 
    // clear all info, unselect events and... 
    $(".popup").hide(); 
    }); 
} 

繰り返しますが、これは一般的なADN非常に単純であり、あなたのスペックATO修正だけでなく、あなたの好みにスタイリングしなければならないであろうが、それは動作するはずです。これが役に立ったら教えてください