问根据下拉列表中选择的用户id，获取员工在全日历中的上下班时间
EN

Stack Overflow用户

提问于 2018-05-24 16:57:28

回答 1查看 691关注 0票数 0

我想在完整的日历中显示用户的in time和out time。每个用户都有不同的in time和out time。并在下拉列表中选择用户id。现在，我得到了下拉列表，它与用户名和用户id绑定在一起，所以我必须将用户的登录时间和注销时间绑定到我的代码，在这里我将下拉列表与数据绑定在一起。这是我的控制器代码，用于将下拉列表与用户id和用户名绑定。

public ActionResult AttendanceScreen()
{
List<SelectListItem> userList = Getuser();
return View(userList);
}
[HttpPost]
public ActionResult AttendanceScreen(string ddlCustomers)
{
List<SelectListItem> userList = Getuser();
if (!string.IsNullOrEmpty(ddlCustomers))
{
SelectListItem selectedItem = userList.Find(p => p.Value == ddlCustomers);
ViewBag.Message = "Calender for Name: " + selectedItem.Text;
ViewBag.Message += "\\nID: " + selectedItem.Value;
}
return View(userList);
}
private static List<SelectListItem> Getuser()
{
RegMVCEntities entities = new RegMVCEntities();
List<SelectListItem> customerList = (from p in entities.tblRegistrations.AsEnumerable()
select new SelectListItem
{
Text = p.FName,
Value = p.UserId.ToString()
}).ToList();


//Add Default Item at First Position.
customerList.Insert(0, new SelectListItem { Text = "--Select Employee--", Value = "" });
return customerList;
}

这是我的视图，用于将用户id和用户名显示为警报。

@using (Html.BeginForm("AttendanceScreen", "Home", FormMethod.Post))
{

@Html.DropDownList("ddlCustomers", Model)
<br />
<br />
<input type="submit" value="Submit" />

}

@if (ViewBag.Message != null)
{
<script type="text/javascript">


window.onload = function () {

alert("@ViewBag.Message");


};

用于显示日历的控制器代码为

public JsonResult GetEvents()
{
using (RegMVCEntities dc = new RegMVCEntities())
{
var events = dc.User_LogTime.ToList();
dc.Configuration.ProxyCreationEnabled = false;
dc.Configuration.LazyLoadingEnabled = false;
return new JsonResult { Data = events, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
}
}

用于显示日历的我的视图代码是

<h2>Calender</h2>
<div id="calender"></div>

<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title"><span id="eventTitle"></span></h4>
</div>
<div class="modal-body">
<button id="btnDelete" class="btn btn-default btn-sm pull-right">
<span class="glyphicon glyphicon-remove"></span> Remove
</button>
<button id="btnEdit" class="btn btn-default btn-sm pull-right" style="margin-right:5px;">
<span class="glyphicon glyphicon-pencil"></span> Edit
</button>
<p id="pDetails"></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>

<div id="myModalSave" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title">Save Event</h4>
</div>
<div class="modal-body">
<form class="col-md-12 form-horizontal">
<input type="hidden" id="hdEventID" value="0" />
@*<div class="form-group">
<label>Subject</label>
<input type="text" id="txtSubject" class="form-control" />
</div>*@
<div class="form-group">
<label>LoginTime</label>
<div class="input-group date" id="dtp1">
<input type="text" id="txtStart" class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
@*<div class="form-group">
<div class="checkbox">
<label><input type="checkbox" id="chkIsFullDay" checked="checked" /> Is Full Day event</label>
</div>
</div>*@
<div class="form-group" id="divEndDate" style="display:none">
<label>LogoutTime</label>
<div class="input-group date" id="dtp2">
<input type="text" id="txtEnd" class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
@*<div class="form-group">
<label>Description</label>
<textarea id="txtDescription" rows="3" class="form-control"></textarea>
</div>*@
<div class="form-group">
<label>Theme Color</label>
<select id="ddThemeColor" class="form-control">
<option value="">Default</option>
<option value="red">Red</option>
<option value="blue">Blue</option>
<option value="black">Black</option>
<option value="green">Green</option>
</select>
</div>
<button type="button" id="btnSave" class="btn btn-success">Save</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</form>
</div>
</div>
</div>
</div>

<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.css" rel="stylesheet" />
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.print.css" rel="stylesheet" media="print" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css" rel="stylesheet" />
@section Scripts{
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
<script>
$(document).ready(function () {
debugger;

var event_array = [];

var selectedEvent = null;
FetchEventAndRenderCalendar();
function FetchEventAndRenderCalendar() {
events = [];
$.ajax({
url: "/Home/GetEvents",
data: "",
type: "GET",
dataType: "json",
async: false,
cache: false,
success: function (data) {
alert("success");

$.each(data, function (i, v) {
event_array.push({
userid: v.UserId,
start: moment(v.LoginTime),
end: moment(v.LogoutTime),

//start: moment(v.start),
//end: v.end != null ? moment(v.end) : null,
//color: v.themecolor,
//allday: v.isfullday
});

})

GenerateCalender(event_array);
},
error: function (error) {
alert('failed');
}
})
}

function GenerateCalender(event_array) {
debugger;
//$('#calender').fullCalendar('destroy');
$('#calender').fullCalendar({
contentHeight: 400,
defaultDate: new Date(),
timeFormat: 'h(:mm)a',
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay,agenda'
},
eventLimit: true,
eventColor: '#378006',
events: event_array,
eventClick: function (calEvent, jsEvent, view) {
selectedEvent = calEvent;
$('#myModal #eventTitle').text(calEvent.userid);
var $description = $('<div/>');
$description.append($('<p/>').html('<b>LoginTime:</b>' + calEvent.logintime.format("DD-MMM-YYYY HH:mm a")));

$description.append($('<p/>').html('<b>LogoutTime:</b>' + calEvent.logouttime.format("DD-MMM-YYYY HH:mm a")));

//$description.append($('<p/>').html('<b>Description:</b>' + calEvent.description));
//$('#myModal #pDetails').empty().html($description);

$('#myModal').modal();
},
//selectable: true,
//select: function (logintime, logouttime) {
// selectedEvent = {
//// userid: 0,
//// logintime: logintime,
//// logouttime: logouttime


//// };
//// openAddEditForm();
//// $('#calendar').fullCalendar('unselect');
////},
////editable: false,
eventDrop: function (event) {
var data = {
UserId: event.userid,
LoginTime: event.logintime.format('DD/MM/YYYY HH:mm A'),
LogoutTime: event.logouttime.format('DD/MM/YYYY HH:mm A')


};
SaveEvent(data);
}

});
}

这是我当前页面的屏幕截图

出席率屏幕

对，正如你在截图中看到的，我只是获取数据库中的进出时间，但这是针对数据库中的所有用户的。我只需要用下拉菜单中选择的用户id的进出时间来更新日历。

javascript

jquery

html

asp.net-mvc

fullcalendar

回答 1

Stack Overflow用户

发布于 2018-05-28 18:15:28

我已经做到了。这很简单，我只需要使用会话来获取用户id.This就是我的代码：

 public ActionResult AttendanceScreen(string ddlCustomers)
        {
            Session["userid"] = ddlCustomers;

            List<SelectListItem> userList = Getuser();
            if (!string.IsNullOrEmpty(ddlCustomers))
            {
                SelectListItem selectedItem = userList.Find(p => p.Value == ddlCustomers);
                ViewBag.Message = "Calender for Name: " + selectedItem.Text;
                ViewBag.Message += "\\nID: " + selectedItem.Value;
            }
            return View(userList);
           // return RedirectToAction("Index", "Nome", new { userid: userid });
        }
 public JsonResult GetEvents()
        {
            string username = User.Identity.Name;
            int isessionid = Convert.ToInt32(Session["userid"]);
            List<SelectListItem> userList = Getuser();
            if (isessionid == 0)
            {
                return null;
            }
            else
            {

                //int userid = int.Parse(username);

                RegMVCEntities svc = new RegMVCEntities();
                svc.Configuration.ProxyCreationEnabled = false;
                svc.Configuration.LazyLoadingEnabled = false;
               // var oCampaigns = svc.User_LogTime;
                var oReturn =
                       (from c in svc.User_LogTime.AsEnumerable()
                        where c.UserId == isessionid
                        select new 
                        {
                            LoginTime = c.LoginTime,
                            Logouttime = c.LogoutTime
                        }).ToList();
                //var events = dc.User_LogTime.ToList();
                //dc.Configuration.ProxyCreationEnabled = false;
                //   dc.Configuration.LazyLoadingEnabled = false;
                return new JsonResult { Data = oReturn.ToList(), JsonRequestBehavior = JsonRequestBehavior.AllowGet };
            }



        }

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/50505098

复制

相似问题

问根据下拉列表中选择的用户id，获取员工在全日历中的上下班时间
EN

回答 1

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问根据下拉列表中选择的用户id，获取员工在全日历中的上下班时间EN

回答 1

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问根据下拉列表中选择的用户id，获取员工在全日历中的上下班时间
EN