if(data[keyvar]==false)
{
jQuery('#BtnsaveAjax').prop("disabled", false).removeClass("k-state-disabled");
}
执行此语句后，保存按钮上的函数不会被调用。我是否需要添加或删除任何其他类才能恢复该功能？
答案 0 :(得分：0)
我想尝试回答你的问题，但首先我从你的问题中得到的是
我有一个网格..并编辑它我有一个弹出窗口..在那里 是两个按钮..编辑并保存..我有两种视图模式..编辑和 view ..在编辑模式下，保存按钮被禁用，在视图模式下保存 按钮被禁用..
所以现在当我点击＆＃34;按钮＆＃34;在这里我认为是指编辑按钮然后我希望我的保存按钮启用。到目前为止，这就是我所拥有的，
首先，当您单击查看详细信息时，您将看到禁用保存按钮 启用编辑按钮时，
然后当您单击编辑按钮时，将启用保存按钮
答案 1 :(得分：0)
这就是我的弹出窗口的样子..所以现在当我点击我的编辑按钮时，我希望保存按钮被启用..所以购买添加k-State-disabled我可以管理...但现在当我点击我的保存按钮..我在保存时添加的点击功能没有触发..
这是我弹出页面的代码..而Editable是一个字典，其中包含特定kendo小部件的禁用值。
@using Kendo.Mvc.UI;
@using Newtonsoft.Json;
@using SampleUIApp.Areas.AreaOne.Models;
@using SampleUIApp.Common;
@model SampleUIApp.Areas.AreaOne.Models.MemberModel
<script type="text/javascript">
$(document).ready(function ()
{
// For setting control mode
// It is observed that Kendo Multiselect does not accept value through below code
// change mode of multiselect like done below in the same view
var Edit = @(Html.Raw(JsonConvert.SerializeObject((Dictionary<string, bool>)ViewBag.Editable)));
for ( keyVar in Edit )
{
if (keyVar.search("Btn") != -1) {
jQuery('#' + keyVar).attr("disabled", Edit[keyVar]);
} else {
jQuery('#' + keyVar).prop("readonly", Edit[keyVar]);
}
}
var viewMode = @Html.Raw(Json.Encode(ViewBag.ViewMode));
if(viewMode == 'ADD')
{
$("#LoanGrid1").remove();
}
var title = viewMode + ' MEMBER';
setTitle(title);
});
function setViewMode(data) {
//for ( keyVar in data ) {
// if (keyVar.search("Btn") != -1) {
// jQuery('#' + keyVar).attr("disabled", data[keyVar]);
// }
// else {
// jQuery('#' + keyVar).prop("readonly", data[keyVar]);
// }
for ( keyVar in data ) {
if (keyVar.search("Btn") != -1) {
if(data[keyVar]==true){
jQuery('#' + keyVar).prop("disabled", true).addClass("k-state-disabled");
}
else{
jQuery('#' + keyVar).prop("disabled", false).removeClass("k-state-disabled");
}
}
else {
jQuery('#' + keyVar).prop("readonly", data[keyVar]);
}
}
}
function onAdditionalData() {
return {
text: $("#CityName").val()
};
}
function AccessModelDetails() {
var data = @Html.Raw(Json.Encode(this.Model));
alert(data.Remark);
}
function UpdateModelDetails() {
// var model = $('form').serialize();
// var data = Sys.Serialization.JavaScriptSerializer.deserialize(model);
// alert('model: ' + data.Remark);
$("#Remark").val("Remark Updated");
}
function saveDetails() {
alert('Calling : saveDetails');
var model = $("form").serialize();
Save(model); // Save Function is Written On Parent View
}
function Edit() {
var mode = 2; // 2 For Edit
var Fid = 0;
var viewName = 'MemberEditor';
var actionURL = '@Url.Action("setViewMode", "Member")';
$.ajax({
type: "POST",
data: {
Mode: mode,
lFeatureId: Fid,
ViewName: viewName
},
url: actionURL,
success: function (result) {
setViewMode(result);
}
});
}
// This Function will be called when an item is got selected from Multiselect Control
// Used for Member role
// here is a sample methos to get the selected item.
function OnSelectMemberRole(e) {
var dataItem = this.dataSource.view()[e.item.index()];
alert("event :: select (" + dataItem.MemberRoleName + " : " + dataItem.MemberRoleId + ")");
}
</script>
@using (Html.BeginForm())
{
<div class="editor">
<div id="DIV_Line07" class="line">
<div id="DIV_Buttons" class="col100" style="float: right">
@*
1.Below is the kendo button to call server side controller action by using MultiButton Attribute
2. Have to Set HtmlAttributes as follows
* name = Given Name With MutiButton Attribute
* type = "submit",
* value = Given Name With MutiButton Attribute
3. .Name(Given Name With MutiButton Attribute)
4. .Content("Caption Of Button")
*@
@(Html.Kendo().Button()
.Name("BtnEditAjax")
.Content("Edit - AJAX")
.HtmlAttributes(new { style = "float:right", type = "button" })
.Events(ev => ev.Click("Edit"))
)
@* @(Html.Kendo().Button()
.Name("Btnsave")
.HtmlAttributes(new { style = "float:right", name = "Btnsave", type = "submit", value = "save" })
.Content("Save - Server")
)*@
@*
1.Below is the kendo button to call server side controller action by using Javascript Function With Ajax
2. Have to Set HtmlAttributes as follows
* type = "button",
3. .Name(Name Of The Button)
4. .Content("Caption Of Button")
5. Events(ev => ev.Click("Javascript Function Name"))
*@
@(Html.Kendo().Button()
.Name("BtnsaveAjax")
.Content("Save - AJAX")
.HtmlAttributes(new { style = "float:right", type = "button" })
)
@(Html.Kendo().Button()
.Name("AccessModelinJS")
.Content("Access Model In JS")
.HtmlAttributes(new { style = "float:right", type = "button" })
.Events(ev => ev.Click("AccessModelDetails"))
)
@(Html.Kendo().Button()
.Name("UpdateModelinJS")
.Content("Update Model In JS")
.HtmlAttributes(new { style = "float:right", type = "button" })
.Events(ev => ev.Click("UpdateModelDetails"))
)
</div>
</div>
<div id="DIV_Line00" class="line">
<div id="DIV_Fname" class="col33">
@Html.HiddenFor(model => model.MemberId)
<label>
First Name - Upper Case
</label>
@*To make textbox uppercase set style's "text-transform" Attribute's value as "uppercase" in html HtmlAttributes*@
@(Html.Kendo().TextBoxFor(m => m.FirstName)
.Name("FirstName")
.HtmlAttributes(new { @class = "width100", style = " text-transform: uppercase" })
)
</div>
<div id="DIV_MName" class="col33">
<label>
Middle Name - Lower Case
</label>
@*To make textbox lowercase set style's "text-transform" Attribute's value as "lowercase" in html HtmlAttributes*@
@Html.Kendo().TextBoxFor(m => m.MiddleName).Name("MiddleName").HtmlAttributes(new { @class = "width100", style = " text-transform: lowercase" })
</div>
<div id="DIV_LName" class="col33">
<label>
Last Name - Alphabets Only
</label>
@*To make textbox AlphaOnly set pattern Attribute's value as "[A-Za-z\\s]*" in html HtmlAttributes*@
@Html.TextBoxFor(m => m.LastName, new { id = "LastName", @class = "width100 k-textbox", type = "text", pattern = "[A-Za-z\\s]*" })
</div>
</div>
<div id="DIV_Line01" class="line">
<div id="DIV_Height" class="col15">
<label>
DOB - Min & Max
</label>
@Html.ValidationMessageFor(model => model.DateOfBirth)
@(Html.Kendo().DatePickerFor(m => m.DateOfBirth)
.Min(new DateTime(1970, 01, 01))
.Max(new DateTime(2014, 11, 30))
.HtmlAttributes(new { @class = "width100" })
.Format("dd/MM/yyyy")
)
</div>
<div id="DIV_Membe rName" class="col18">
<label>
Age - Integer
</label>
@Html.ValidationMessageFor(model => model.Age)
@Html.Kendo().IntegerTextBoxFor(m => m.Age).HtmlAttributes(new { @class = "width100" })
</div>
<div id="DIV_Age" class="col15">
<label>
Height-Decimal 3
</label>
@*Format as "#.000" specifies that 3 decimals will be displayed, Number of 0s in the format Specifies number of decimals*@
@Html.ValidationMessageFor(model => model.Height)
@Html.Kendo().NumericTextBoxFor(m => m.Height).HtmlAttributes(new { @class = "width100" }).Format("#.000")
</div>
<div id="DIV_Country" class="col18">
<label>
StateAutoComplete
</label>
@* 1.Name Of the autocomplete must be ur property name of the model so that it could bind selected value to model .
2.List for autocomplete will only contains value and does not support Id Value pair pattern(In Used Version of kendo).
*@
@(Html.Kendo().AutoCompleteFor(m => m.StateName)
.Name("StateName")
.DataTextField("StateName")
.BindTo((System.Collections.IEnumerable)ViewData["states"]).HtmlAttributes(new { @class = "width100" })
)
</div>
<div id="DIV_CityServer" class="col33">
<label>
City-AutoComplete Server Filtering
</label>
@* 1.Name Of the autocomplete must be ur property name of the model so that it could bind selected value to model .
2.List for autocomplete will only contains value and does not support Id Value pair pattern(In Used Version of kendo).
*@
@(Html.Kendo().AutoCompleteFor(m => m.CityName)
.Name("CityName")
.DataTextField("CityName")
.MinLength(3)
//.BindTo((System.Collections.IEnumerable)ViewData["cities"]).HtmlAttributes(new { @class = "width100" })
.DataSource(
source =>
{
source.Read(read => { read.Action("GetCities", "Member").Data("onAdditionalData"); });
source.ServerFiltering(true);
})
.HtmlAttributes(new { @class = "width100" })
)
</div>
</div>
<div id="DIV_Line02" class="line">
<div id="DIV_DateOfBirth" class="col33">
<label>
Member Type - DropDownList
</label>
@*
0.List can be bind to DropDownListFor using "BindTo" or using "DataSource".
1.Name Of the DropDownListFor must be ur property name of the model so that it could bind selected value to model .
2.List for DropDownListFor will contains Id Value pair .
3.Selected Value will be Value of DataValueField - ".DataValueField("MemberTypeId")"
4.Selected Value will bind to model property given as name to DropDownListFor
*@
@(Html.Kendo().DropDownListFor(m => m.MemberType)
.Name("MemberType")
.DataTextField("MemberTypeName")
.DataValueField("MemberTypeId")
.HtmlAttributes(new { @class = "width100" })
.Filter("contains")
.BindTo((System.Collections.IEnumerable)ViewData["memberTypes"])
//.DataSource(
// source =>
// {
// source.Read(read => { read.Action("GetMemberTypes", "Member"); });
// })
)
</div>
<div id="DIV_MemberRole" class="col33">
<label>
Member Role - MultiSelect
</label>
@*
0.List can be bind to MultiSelectFor using "BindTo" or using "DataSource".
2.List for MultiSelectFor will contains Id Value pair .
1.Name Of the MultiSelectFor must be ur property name of the model so that it could bind selected values to model.
2.Type of property Specified in Name of MultiSelectFor has to be a collection type for example List<long> or List<string>.
3.Selected Values will be Values of DataValueField - ".DataValueField("MemberRoleId")"
4.Selected Values will bind to model property given as name to MultiSelectFor
*@
@(Html.Kendo().MultiSelectFor(m => m)
.Name("MemberRoleList")
.DataTextField("MemberRoleName")
.DataValueField("MemberRoleId")
.BindTo((System.Collections.IEnumerable)ViewData["memberRoles"])
.Events(e => e.Select("OnSelectMemberRole"))
//.DataSource(
// source =>
// {
// source.Read(read => { read.Action("GetMemberRoles", "Member"); });
// })
)
</div>
<div id="DIV_Mobile" class="col33">
<label>
Mobile - Mobile Mask
</label>
@*
1. Specifying Mask As "0000000000" allows to enter only 10 Digits.
*@
@Html.ValidationMessageFor(model => model.Mobile)
@(Html.Kendo().MaskedTextBoxFor(m => m.Mobile)
.Mask("0000000000")
.HtmlAttributes(new { @class = "width100" })
)
</div>
</div>
<div id="DIV_Line03" class="line">
<div id="DIV_Email" class="col33">
<label>
Email - With Validation
</label>
@*
1. For Email Validation On UI, Use Html.TextBoxFor
2. Set Attributes as follows
* type = "email"
* @class = "k-textbox"
* style = " text-transform: lowercase"
*@
@Html.TextBoxFor(model => model.Email, new { @class = "k-textbox width100", type = "email", style = " text-transform: lowercase" })
</div>
<div id="DIV_PIN" class="col33">
<label>
PIN - Mask
</label>
@*
1. Specifying Mask As "000000" allows to enter only 6 Digits.
*@
@(Html.Kendo().MaskedTextBoxFor(m => m.PIN)
.Mask("000000")
.HtmlAttributes(new { @class = "width100" })
)
</div>
<div id="DIV_Phone" class="col33">
<label>
Phone - Mask
</label>
@*
1. Specifying Mask As "(999) 000-0000" allows to enter Digits within specified mask.
*@
@(Html.Kendo().MaskedTextBoxFor(m => m.Phone)
.Mask("(999) 000-0000")
.HtmlAttributes(new { @class = "width100" })
)
</div>
<div id="DIV_Line05" class="line">
</div>
<div id="DIV_Line06" class="line">
<div id="DIV_Remark" class="col100">
<label>
Remark - Text Area
</label>
@*
To Use Text Area us helper Html.TextAreaFor
2. Set Attributes as follows
* @class = "k-textbox"
* style = " text-transform: lowercase"
* rows = as much U Want
* cols = as much U Want
*@
@Html.TextAreaFor(m => m.Remark, new { @class = "k-textbox width100", rows = "2", cols = "50" })
@Html.HiddenFor(m => m.Remark, new { id = "Remark" })
@* <textarea class="k-textbox" rows="2" cols="50" >
</textarea>*@
</div>
</div>
<div id="DIV_Phone" class="col100">
<label>
Loan Details
</label>
@(Html.Kendo().Grid<LoanModel>()
.Name("LoanGrid1")
.Columns(columns =>
{
columns.Bound(m => m.LoanNumber).Filterable(false).Title("Loan Number").Width("20%").HtmlAttributes(new { @style = "font-size:x-small" });
columns.Bound(m => m.ROI).Filterable(false).Title("ROI").Width("10%").Format("{0:N2}").HtmlAttributes(new { @style = "font-size:x-small" });
columns.Bound(m => m.Period).Filterable(false).Title("Period").Width("10%").Format("{0:N2}").HtmlAttributes(new { @style = "font-size:x-small" });
columns.Bound(m => m.LoanAmount).Filterable(false).Title("Loan Amount").Width("10%").Format("{0:N2}").HtmlAttributes(new { @style = "font-size:x-small" });
columns.Bound(m => m.OtstngAmount).Filterable(false).Title("Outstanding amount").Width("10%").Format("{0:N2}").HtmlAttributes(new { @style = "font-size:x-small" });
columns.Command(cmd => cmd.Destroy());
})
.Pageable()
.Scrollable(config => config.Enabled(false))
.Filterable(config => config.Mode(GridFilterMode.Menu))
.Sortable()
.Resizable(config => { config.Columns(true); })
.Reorderable(config => { config.Columns(true); })
.DataSource(source => source
.Ajax()
.PageSize(5)
.Model(model =>
{
model.Id(m => m.MemberId);
})
.Read(read => read.Action("FetchMemberLoanList", "Member", new { area = "AreaOne" }))
.Destroy(del => del.Action("Destroy", "Member", new { area = "AreaOne" }))
)
)
</div>
</div>
</div>
}