问题淘汰js与日期绑定 [英] problem knockout js with date binding
本文介绍了问题淘汰js与日期绑定的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
嗨伙计们
i有问题淘汰js与日期绑定不工作
这是家庭控制器
hi guys
i have problem knockout js with date binding dosn't work
this is home controller
namespace TestMVC.Controllers
{
public class Model
{
public string Name { get; set; }
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
}
public class HomeController : Controller
{
public ActionResult Index()
{
List<Model> modelList = new List<Model>(){
new Model{Name="Ahmed",StartDate = DateTime.Parse("10/10/2010") , EndDate=DateTime.Parse("20/10/2010")},
new Model{Name="MMMM",StartDate = DateTime.Parse("10/10/2012") , EndDate=DateTime.Parse("20/10/2013")}
};
Session["Model"] = modelList;
return View();
}
public JsonResult LoadModel()
{
if (Session["Model"] != null)
{
List<Model> modelList = (List<Model>)Session["Model"];
return Json(modelList, JsonRequestBehavior.AllowGet);
}
return Json(null, JsonRequestBehavior.AllowGet);
}
public void AddModel(Model model)
{
if (Session["Model"] != null)
{
List<Model> modelList = (List<Model>)Session["Model"];
modelList.Add(model);
Session["Model"] = modelList;
}
}
}
}
这是索引.html
this is index.html
@{
ViewBag.Title = "Home Page";
}
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script src="~/Scripts/knockout-2.2.0.js"></script>
<script src="~/Scripts/moment.js"></script>
for add<br />
<input type="text" data-bind="value: Name" />
<input type="text" data-bind="value: StartDate" />
<input type="text" data-bind="value: EndDate" />
<input type="button" data-bind="click: addModel" value="Add" />
<br />
for edit<br />
<div data-bind="if: model">
<input type="text" data-bind="value: model().Name" />
<input id="startDate" type="text" data-bind="Date: model().StartDate" />
<input id="endDate" type="text" data-bind="Date: model().EndDate" />
<input type="button" value="edit" data-bind="click: editModel" />
</div>
<table>
<thead>
<tr>
<td>Name</td>
<td>Start Date</td>
<td>End Date</td>
<td></td>
</tr>
</thead>
<tbody data-bind="foreach: modelList">
<tr>
<td data-bind="text: Name"></td>
<td data-bind="Date: StartDate"></td>
<td data-bind="Date: EndDate"></td>
<td>
<input type="button" data-bind="click: $root.edit" value="Select" />
</td>
</tr>
</tbody>
</table>
<script type="text/javascript">
var vm = function () {
var self = this;
self.Name = ko.observable("");
self.StartDate = ko.observable("");
self.EndDate = ko.observable("");
var model = {
Name: self.Name,
StartDate: self.StartDate,
EndDate: self.EndDate
}
self.model = ko.observable();
self.modelList = ko.observableArray();
self.loadModel = function () {
$.getJSON('/Home/LoadModel').done(function (data) {
self.modelList(data);
}).fail(function () {
});
}
self.addModel = function () {
$.ajax({
url: "/Home/AddModel",
data: ko.toJSON(model),
type: 'POST',
contentType: 'application/json; charset=utf-8'
}).done(function () {
self.loadModel();
});
}
self.edit = function (model) {
self.model(model)
}
self.editModel = function () {
data = self.model;
$.ajax({
url: "/Home/AddModel",
data: ko.toJSON(data),
type: 'POST',
contentType: 'application/json; charset=utf-8'
}).done(function () {
self.loadModel();
});
}
self.loadModel();
}
ko.applyBindings(new vm);
ko.bindingHandlers.Date = {
update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
var value = valueAccessor();
var date = moment(value);
var strDate = date.format('DD-MM-YYYY');
if ($(element).is(':input'))
$(element).val(strDate);
else
$(element).text(strDate);
}
};
</script>
当我点击选择然后点击编辑开始日期和endDate = 01-01-0001
< img src =http://www.gulfup.com/?nul7ou/>
< img src =http://www.gulfup.com/?rvdEAR/>
怎么样我可以解决这个问题
有人帮我请
i等待答案
when i click on select then click edit start date and endDate = 01-01-0001
<img src="http://www.gulfup.com/?nul7ou" />
<img src="http://www.gulfup.com/?rvdEAR" />
how i can fix this problem
anyone help me please
i am waiting answers
推荐答案
root.edit value = 选择 / >
< / td > 跨度>
< / tr >
< / tbody >
< / table >
< script 类型 = text / javascript >
var vm = function (){
var self = this ;
self.Name = ko.observable( );
self.StartDate = ko.observable( );
self.EndDate = ko.observable( );
var model = {
名称:self.Name,
StartDate:self.StartDate,
EndDate:self。 EndDate
}
self.model = ko.observable();
self.modelList = ko.observableArray();
self.loadModel = function (){
root.edit" value="Select" /> </td> </tr> </tbody> </table> <script type="text/javascript"> var vm = function () { var self = this; self.Name = ko.observable(""); self.StartDate = ko.observable(""); self.EndDate = ko.observable(""); var model = { Name: self.Name, StartDate: self.StartDate, EndDate: self.EndDate } self.model = ko.observable(); self.modelList = ko.observableArray(); self.loadModel = function () {
.getJSON(' / Home / LoadModel')。done( function (data) {
self.modelList(data);
})。失败( function (){
});
}
self.addModel = function (){
.getJSON('/Home/LoadModel').done(function (data) { self.modelList(data); }).fail(function () { }); } self.addModel = function () {
.ajax({
url: / Home / AddModel,
data:ko.toJSON(model),
类型:' POST',
contentType:' application / json; charset = utf-8'
})。done( function (){
self.loadModel();
});
}
self.edit = function (model){
self.model(model)
}
self.editModel = function (){
data = self.model;
.ajax({ url: "/Home/AddModel", data: ko.toJSON(model), type: 'POST', contentType: 'application/json; charset=utf-8' }).done(function () { self.loadModel(); }); } self.edit = function (model) { self.model(model) } self.editModel = function () { data = self.model;
这篇关于问题淘汰js与日期绑定的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文