0

我在我的页面中使用 boxy jQuery 插件在 clickEvent 上为 fullCalendar 插件显示一个表单。它工作得很好,我唯一的问题是,第一次打开对话框时,四四方方的表单会弹出确认对话框,当用户单击“确定”时,它会第二次提交表单,这会在我的身上生成 2 个事件我的数据库中的日历和 2 个条目。

我的代码在 fullCalendar 中如下所示:

dayClick: function(date, allDay, jsEvent, view) {
var day=""+date.getDate();
if(day.length==1){
day="0"+day;
}
var year=date.getFullYear();    
var month=date.getMonth()+1;
var month=""+month;
if(month.length==1){
month="0"+month;
}
var defaultdate=""+year+"-"+month+"-"+day+" 00:00:00";
var ele = document.getElementById("myform");
new Boxy(ele,{title: "Add Task", modal: true});
document.getElementById("title").value="";
document.getElementById("description").value="";
document.getElementById("startdate").value=""+defaultdate;
document.getElementById("enddate").value=""+defaultdate; 

}

我还在表单字段上使用验证器:

$.validator.addMethod(
    "datetime",
    function(value, element) {
    // put your own logic here, this is just a (crappy) example
        return value.match(/^([0-9]{4})-([0-1][0-9])-([0-3][0-9])\s([0-1][0-9]|[2][0-3]):([0-5][0-9]):([0-5][0-9])$/);
        },
    "Please enter a date in the format YYYY-mm-dd hh:MM:ss"
);

var validator=$("#myform").validate({
     onsubmit:true,
     rules: {
      title: {
       required: true
      },
      startdate: {
       required: true,
       datetime: true
      }, 
      enddate: {
       required: true,
       datetime: true
      }
     },
     submitHandler: function(form) {
    //this function renders a new event and makes a call to a php script that inserts it into the db
       addTask(form);
     }     
    }); 

表格如下所示:

<form id ='myform'>
<table border='1' width='100%'>
<tr><td align='right'>Title:</td><td align='left'><input id='title' name='title' size='30'/></td></tr>
<tr><td align='right'>Description:</td><td align='left'><textarea id='description' name='description' rows='4' cols='30'></textarea></td></tr>
<tr><td align='right'>Start Date:</td><td align='left'><input id='startdate' name='startdate' size='30'/></td></tr>
<tr><td align='right'>End Date:</td><td align='left'><input id='enddate' name='enddate' size='30' /></td></tr>
<tr><td colspan='2' align='right'><input type='submit' value='Add' /></td></tr>
</table>
</form>
4

1 回答 1

0

好吧,我暂时使用“脏修复”,只需删除 boxy.js 中的确认对话框,以便该函数在调用时不执行任何操作。不漂亮,但它现在有效。

于 2010-04-14T06:18:50.403 回答