我已经试了一段时间来让这个工作。我正在努力从模式中获取用户输入并将其插入phpmyadmin中的my数据库。任何帮助都将不胜感激。
1) 使用select回调,我调出一个模式:
select: function(start, end, allDay)
{
$('#myModal').modal('show');
},
2) html中的模式本身:
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Add Event</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="FormControlInput1">Task Title</label>
<input type="text" class="form-control" id="title" placeholder="Enter Task Title">
</div>
<div class="form-group">
<label for="FormControlInput2">Task Number</label>
<input type="text" class="form-control" id="number" placeholder="Enter Task Number>
</div>
<div class="form-group">
<label for="FormControlInput3">Location</label>
<input type="text" class="form-control" id="location" placeholder="Enter Location">
</div>
<div class="form-group">
<label for="FormControlTextarea1">Tooling Required</label>
<textarea class="form-control" id="tooling" placeholder="Enter the tools required for the task here" rows="3"></textarea>
</div>
<div class="form-group">
<label for="FormControlTextarea2">Consumables</label>
<textarea class="form-control" id="consumables" placeholder="Enter the consumables required for the task here" rows="3"></textarea>
</div>
<div class="form-group">
<label for="FormControlSelect1">Safety Condition</label>
<select class="form-control" id="safety">
<option>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" id="buttonAddEvent">Add Event</button>
</div>
</div>
</div>
</div>
3) 此时,我想使用我制作的insert.php文件,该文件适用于代码中的其他函数:
<?php
//insert.php
$connect = new PDO('mysql:host=hostname;dbname=dbname', 'username', 'password');
if(isset($_POST["title"]))
{
$query = "
INSERT INTO events
(title, number, location, tooling, consumables, safety, start_event, end_event)
VALUES (:title, :number, :location, :tooling, :consumables, :safety, :start_event, :end_event)
";
$statement = $connect->prepare($query);
$statement->execute(
array(
':title' => $_POST['title'],
':number' => $_POST['number'],
':location' => $_POST['location'],
':tooling' => $_POST['tooling'],
':consumables' => $_POST['consumables'],
':safety' => $_POST['safety'],
':start_event' => $_POST['start'],
':end_event' => $_POST['end']
)
);
}
?>
我通常使用以下代码插入数据,但是这会使用prompts(),我想用模式输入替换它:
select: function(start, end, allDay)
{
var title = prompt("Enter Task Title");
if(title)
{
var number = prompt("Enter Task Number");
var location = prompt("Enter Train Location");
var tooling = prompt("Enter Tooling Required");
var consumables = prompt("Enter Consumables Required");
var start = $.fullCalendar.formatDate(start, "Y-MM-DD HH:mm:ss");
var end = $.fullCalendar.formatDate(end, "Y-MM-DD HH:mm:ss");
$.ajax({
url:"insert.php",
type:"POST",
data:{title:title, number:number, location:location, tooling:tooling, consumables:consumables, start:start, end:end},
success:function()
{
calendar.fullCalendar('refetchEvents');
}
})
}
},
2条答案
按热度按时间dly7yett1#
需要使用.on()将数据从模式输入传递到变量
感谢@adyson指出了正确的方向。
qf9go6mv2#
我没有看到任何来自php代码的返回数据(通常是get new updated record并以json\u encode的形式返回),然后ajax success函数应该处理响应数据并将其获取到calendar